add scrolltop

user/themes/figureslibres/js/site.js

@@ -100,7 +100,6 @@ function click_list() {
           $('.card a').click(function (e) {
             e.preventDefault()
           })
-
           click_img(e, $this, $href, url, page, cat, project_name)
         },
         complete: function(data) {
@@ -175,6 +174,7 @@ function click_img(e, $this, $href, url, page, cat, project_name) {
             // $projet.prepend(hamburger);
             closeAjax();
             $loader.hide();
+            scrollTop();
           }
         });
 
@@ -198,6 +198,7 @@ function animate() {
 function marg_item(project_name) {
 
   var $item = $('.card-image#'+project_name+' #item');
+
   var $item_offset = $item.offset().left-8;
   var $card = $item.parents('.card');
 
@@ -206,13 +207,36 @@ function marg_item(project_name) {
 
   var margin_right =  $item_list.width() - (pos_card + $card.width());
 
-  console.log('$card.width()',$card.width());
-  console.log('pos_card',pos_card);
-
-  console.log('$item_list',$item_list.width());
-
   $item.css('margin-left', '-'+$item_offset +'px');
-  // $item.parents('.card').css('margin-right', margin_right);
+
+// if new.vignette.left != old.vignette.left
+// alors recalcule margin.left
+
+  // var timer;
+  // $(window).resize(function() {
+  //   if(timer) {
+  // 		window.clearTimeout(timer);
+  // 	}
+  //
+  // 	timer = window.setTimeout(function() {
+  // 		// actual callback
+  //     var $item = $('.card-image#'+project_name+' #item');
+  //     console.log($item, '$item');
+  // 		console.log( "Firing!" );
+  //
+  //     var $item_offset = $item.offset().left-8;
+  //     console.log( "$item_offset", $item_offset );
+  //     var $card = $item.parents('.card');
+  //
+  //     var $item_list = $item.parents('#item_list');
+  //
+  //     var pos_card = $card.offset().left;
+  //
+  //     var margin_right =  $item_list.width() - (pos_card + $card.width());
+  //     $item.css('margin-left', '-'+$item_offset +'px');
+  // 	}, 500);
+  //
+  // });
 }
 
 function mouseHover() {
@@ -302,6 +326,14 @@ function croix() {
   $link.append(loader);
 }
 
+function scrollTop() {
+  var $body = $("html, body");
+  $('#item #top').click(function() {
+    $body.stop().animate({scrollTop:0}, 500, 'swing', function() {
+    });
+  })
+}
+
 $(document).ready(function($){
   // redirection();
   click_link();

user/themes/figureslibres/scss/theme/_mobile.scss

@@ -18,7 +18,6 @@
 
 @media screen and (max-width: 414px) {
   body{
-
     #start{
       width: $Wi-m;
       #text_figli{
@@ -53,258 +52,8 @@
       display: none;
     }
   }
+  .circle_hover.open{
+    width: 0!important;
+    height: 0!important;
+  }
 }
-//   body{
-//     #start{
-//       width: $Wi-m;
-//       #text_figli{
-//         #item_list{
-//           .card{
-//             width: $Wi-m;
-//             #item{
-//               width: calc(100% + (.5rem * 3));
-//             }
-//           }
-//         }
-//       }
-//     }
-//   }
-//
-//
-//   // typographie
-//   header{
-//     a{
-//       font-size: $txt-figli-m;
-//       line-height: $Flhome-m;
-//     }
-//   }
-//   .home{
-//     p{
-//       font-size: $txt-figli-m!important;
-//       line-height: $Flhome-m!important;
-//     }
-//   }
-//   .other_projets{
-//     h3{
-//       font-size: $txt-figli-m;
-//     }
-//   }
-//
-//   // mep
-//   header{
-//     width: calc( #{$Wi-m} - (#{$marg} * 2) );
-//   }
-//
-//   body{
-//     #start{
-//         width: calc( #{$Wi-m} - (#{$marg} * 2) );
-//     }
-//     &:not(.home){
-//       #start{
-//         margin-top: $Flhome;
-//       }
-//     }
-//     .sidebar-right{
-//       display: none;
-//     }
-//   }
-//
-//   #item_list{
-//     .card{
-//       width: calc( #{$Wi-m}  )!important;
-//       &:nth-child(odd){
-//         margin-right: 0;
-//       }
-//       .card-header{
-//         margin-bottom: $marg;
-//         & > * {
-//           margin-right: $marg;
-//         }
-//       }
-//     }
-//   }
-//
-//   .other_projets{
-//     margin-top: $margI;
-//     .card{
-//       width: $Wi-m;
-//       &:nth-child(-1n+3){
-//         margin-right: 0;
-//       }
-//     }
-//   }
-// }
-//
-// @media screen and (max-width: 768px) {
-//   body{
-//     #start{
-//       width: $Wi80-m;
-//       #text_figli{
-//         #item_list{
-//           .card{
-//             width: $Wi33-m;
-//             #item{
-//               width: calc(300% + (.5rem * 3));
-//             }
-//           }
-//         }
-//       }
-//     }
-//   }
-//
-//   // typographie
-//   header{
-//     a{
-//       font-size: 2.5rem;
-//       line-height: 3rem;
-//     }
-//   }
-//   // .home{
-//   //   p{
-//   //     font-size: $txt-figli-t!important;
-//   //     line-height: $Flhome-t!important;
-//   //   }
-//   // }
-//   .other_projets{
-//     h3{
-//       font-size: $txt-figli-t;
-//     }
-//   }
-//
-//   body{
-//     &:not(.home){
-//       #start{
-//         margin-top: 5rem;
-//       }
-//     }
-//   }
-//
-//   #item_list{
-//     .card{
-//       width: calc( #{$Wi-m}  );
-//       &:nth-child(odd){
-//         margin-right: 0;
-//       }
-//       .card-header{
-//         margin-bottom: $marg;
-//         & > * {
-//           margin-right: $marg;
-//         }
-//       }
-//     }
-//   }
-// }
-//
-// @media screen and (max-width: 812px) and (orientation: landscape) {
-//   // typographie
-//   header{
-//     a{
-//       font-size: $txt-figli-m;
-//       line-height: $Flhome-m;
-//     }
-//   }
-//   .home{
-//     p{
-//       font-size: $txt-figli-m!important;
-//       line-height: $Flhome-m!important;
-//     }
-//   }
-//   .other_projets{
-//     h3{
-//       font-size: $txt-figli-m;
-//     }
-//   }
-//
-//   // mep
-//   header{
-//     width: calc( #{$Wi-m} - (#{$marg} * 2) );
-//   }
-//
-//   body{
-//     #start{
-//         width: calc( #{$Wi-m} - (#{$marg} * 2) );
-//     }
-//     &:not(.home){
-//       #start{
-//         margin-top: $Flhome;
-//       }
-//     }
-//     .sidebar-right{
-//       display: none;
-//     }
-//   }
-//
-//   #item_list{
-//     .card{
-//       width: $Wi50;
-//       &:nth-child(odd){
-//         margin-right: $margI;
-//       }
-//     }
-//   }
-//
-//   .other_projets{
-//     .card{
-//       width: $Wi33;
-//       &:nth-child(-1n+3){
-//         margin-right: $marg;
-//       }
-//     }
-//   }
-// }
-//
-// @media screen and (max-width: 910px) and (orientation: portrait) {
-//   header{
-//     a{
-//       font-size: 2.5rem;
-//       line-height: 3rem;
-//     }
-//   }
-//   .home{
-//     p{
-//       font-size: $txt-figli-t!important;
-//       line-height: $Flhome-t!important;
-//     }
-//   }
-//   .other_projets{
-//     h3{
-//       font-size: $txt-figli-t;
-//     }
-//   }
-//   body{
-//     &:not(.home){
-//       #start{
-//         margin-top: 5rem;
-//       }
-//     }
-//   }
-// }
-//
-// @media screen and (max-width: 660px) {
-//   header{
-//     a{
-//       font-size: $txt-figli-m;
-//       line-height: $Flhome-m;
-//     }
-//   }
-//   .home{
-//     p{
-//       font-size: $txt-figli-m!important;
-//       line-height: $Flhome-m!important;
-//     }
-//   }
-//   .other_projets{
-//     h3{
-//       font-size: $txt-figli-m;
-//     }
-//   }
-//
-//   body{
-//     &:not(.home){
-//       #start{
-//         margin-top: $Flhome;
-//       }
-//     }
-//   }
-// }
-//

user/themes/figureslibres/scss/theme/_sidebar.scss

@@ -5,6 +5,8 @@
   right: calc( -20% + 0.5rem);
   top: 0;
   transition: 0.3s right ease;
+  background: white;
+  z-index: 999;
   #icone_list{
     z-index: 999;
     position: fixed;

user/themes/figureslibres/scss/theme/_start.scss

@@ -239,6 +239,14 @@ body{
           }
         }
       }
+      #top{
+        width: 20px;
+        height: 20px;
+        background: red;
+        position: absolute;
+        bottom: 0;
+        right: -3rem;
+      }
     }
   }
   &:not(.home){

user/themes/figureslibres/templates/partials/blog-item.html.twig

@@ -20,3 +20,4 @@
 
   {% endfor %}
 </div>
+<div id="top"></div>