afiche slider css

themes/modern2/assets/new/scripts/core/affiche-item.js

@@ -231,21 +231,21 @@ const runBtns = new NewsBtn(".news-global").activateSwitch(
   }
 );
 
-const mobileAside = new AssignEvent(
-  ".aside-mobile-open",
-  "click",
-  "toggle",
-  "active",
-  ".aside-mobile"
-).listen(bodyScrollHandler);
+// const mobileAside = new AssignEvent(
+//   ".aside-mobile-open",
+//   "click",
+//   "toggle",
+//   "active",
+//   ".aside-mobile"
+// ).listen(bodyScrollHandler);
 
-const mobileAsideCloser = new AssignEvent(
-  ".aside-mobile-out",
-  "click",
-  "remove",
-  "active",
-  ".aside-mobile"
-).listen(bodyScrollHandler);
+// const mobileAsideCloser = new AssignEvent(
+//   ".aside-mobile-out",
+//   "click",
+//   "remove",
+//   "active",
+//   ".aside-mobile"
+// ).listen(bodyScrollHandler);
 
 // Mobile search
 try {
@@ -265,3 +265,19 @@ try {
     ".mobile-search"
   ).listen(bodyScrollHandler);
 } catch (_) {}
+
+const afficheSwiper = new Swiper(".afficheSwiper", {
+  slidesPerView: 1,
+  spaceBetween: 0,
+  loop: false,
+  navigation: {
+    prevEl: ".affiche-prev",
+    nextEl: ".affiche-next",
+  },
+});
+
+if (afficheSwiper.slides.length < 2) {
+  document.querySelector(".affiche-prev").style.display = "none";
+  document.querySelector(".affiche-next").style.display = "none";
+  afficheSwiper.disable();
+}

themes/modern2/assets/new/scripts/core/article.js

@@ -204,7 +204,7 @@ const articleSwiper = new Swiper(".articleSwiper", {
   },
 });
 
-if (articleSwiper.slides.length < 20) {
+if (articleSwiper.slides.length < 2) {
   document.querySelector(".article-prev").style.display = "none";
   document.querySelector(".article-next").style.display = "none";
   articleSwiper.disable();

themes/modern2/assets/new/styles/_general.scss

@@ -29,6 +29,14 @@ ul {
   list-style-type: none;
 }
 
+ol {
+  margin-left: 1rem;
+  li {
+    font-size: 1.7rem;
+    line-height: 2.5rem;
+  }
+}
+
 a {
   color: #000;
   text-decoration: none;

themes/modern2/assets/new/styles/_header.scss

@@ -59,6 +59,10 @@
     padding: 1rem 0.6rem;
     width: 100%;
     font-weight: bold;
+
+    &::placeholder {
+      color: black;
+    }
   }
 
   button {

themes/modern2/assets/new/styles/affiche/_affiche-item.scss

@@ -22,6 +22,11 @@
   }
 }
 
+.affiche-next,
+.affiche-prev {
+  top: 40%;
+}
+
 .affiche-item-img {
   @include imgStyle(unset, unset, cover);
   justify-self: center;
@@ -51,6 +56,12 @@
 
 // Media
 @media screen and (max-width: 1080px) {
+  .affiche-swiper-wrapper {
+    // display: inline-block;
+    max-width: calc(100vw - 8rem);
+
+    margin: 0 auto;
+  }
   .affiche-item-inner {
     grid-template-columns: 1fr;
   }
@@ -69,6 +80,11 @@
   }
 }
 
+@media screen and (max-width: 1000px) {
+  .affiche-swiper-wrapper {
+    max-width: calc(100vw - 5rem);
+  }
+}
 @media screen and (max-width: 800px) {
   .affiche-item-head {
     flex-direction: column-reverse;

themes/modern2/assets/new/styles/main/_posts.scss

@@ -31,6 +31,10 @@
   &.sm {
     .trending-img {
       overflow: hidden;
+
+      img {
+        height: 14rem;
+      }
     }
   }
   &.big {

themes/modern2/assets/new/styles/main/_trending.scss

@@ -116,7 +116,11 @@
   align-items: flex-end;
 
   .trending-img {
-    @include imgStyle(11.7rem, 7.5rem, cover);
+    @include imgStyle(11.7rem, unset, cover);
+
+    img {
+      height: 9rem;
+    }
   }
 }
 
@@ -130,11 +134,11 @@
 
 // Media
 @media screen and (max-width: 1500px) {
-  .trending-item {
-    &:last-child {
-      display: none;
-    }
-  }
+  // .trending-item {
+  //   &:last-child {
+  //     display: none;
+  //   }
+  // }
 }
 @media screen and (max-width: 1150px) {
   .trending-banner {

themes/modern2/assets/new/styles/style.css

@@ -30,6 +30,14 @@ ul {
   list-style-type: none;
 }
 
+ol {
+  margin-left: 1rem;
+}
+ol li {
+  font-size: 1.7rem;
+  line-height: 2.5rem;
+}
+
 a {
   color: #000;
   text-decoration: none;
@@ -125,6 +133,15 @@ a {
   width: 100%;
   font-weight: bold;
 }
+.header-search input::-moz-placeholder {
+  color: black;
+}
+.header-search input:-ms-input-placeholder {
+  color: black;
+}
+.header-search input::placeholder {
+  color: black;
+}
 .header-search button {
   display: flex;
   flex-direction: row;
@@ -1548,6 +1565,9 @@ a {
   -o-object-fit: cover;
      object-fit: cover;
 }
+.trending-item .trending-img img {
+  height: 9rem;
+}
 
 .trending-main-content-inner {
   width: 100%;
@@ -1618,6 +1638,9 @@ a {
 .posts-item.sm .trending-img {
   overflow: hidden;
 }
+.posts-item.sm .trending-img img {
+  height: 14rem;
+}
 .posts-item.big {
   grid-area: big;
 }
@@ -2575,6 +2598,11 @@ a {
   color: rgb(3, 159, 55);
 }
 
+.affiche-next,
+.affiche-prev {
+  top: 40%;
+}
+
 .affiche-item-img {
   max-width: unset;
   max-height: unset;
@@ -2615,6 +2643,10 @@ a {
 }
 
 @media screen and (max-width: 1080px) {
+  .affiche-swiper-wrapper {
+    max-width: calc(100vw - 8rem);
+    margin: 0 auto;
+  }
   .affiche-item-inner {
     grid-template-columns: 1fr;
   }
@@ -2630,6 +2662,11 @@ a {
     align-self: unset;
   }
 }
+@media screen and (max-width: 1000px) {
+  .affiche-swiper-wrapper {
+    max-width: calc(100vw - 5rem);
+  }
+}
 @media screen and (max-width: 800px) {
   .affiche-item-head {
     flex-direction: column-reverse;