Quellcode durchsuchen

import typo asset, transition boutons, css flickity, champs obligatoire form, media queries section asso, sup de uncat dans wordpress, fail : css form, sou cat burger

chloe vor 3 Jahren
Ursprung
Commit
20ff0d38cc

+ 7 - 5
web/app/themes/la_mine/asset/dist/index.js

@@ -1,5 +1,3 @@
-
-
 var Home = document.querySelector('.hero .slide');
 var flkty = new Flickity( Home, {
   // options
@@ -25,6 +23,13 @@ for (var i = 0; i < slide_tpsF.length; i++) {
   });
 }
 
+var Partenaires = document.querySelector('.container_slide .row');
+var flkty = new Flickity( Partenaires, {
+  // options
+  groupCells: true,
+  pageDots: false
+});
+
 var msnry = new Masonry( '.tableau_engagements.row', {
   columnWidth: '.engagement',
   itemSelector: '.engagement',
@@ -39,7 +44,6 @@ hamburgers.addEventListener("click", function() {
   nav.classList.toggle("is-active");
 });
 
-
 var elem = document.querySelector('.grid');
 
 var iso = new Isotope( elem, {
@@ -49,8 +53,6 @@ var iso = new Isotope( elem, {
 
 var filtersElem = document.querySelector('.filter-button-group');
 filtersElem.addEventListener( 'click', function( event ) {
-
   var filterValue = event.target.getAttribute('data-filter');
   iso.arrange({ filter: filterValue });
-
 });

+ 110 - 8
web/app/themes/la_mine/asset/dist/style.css

@@ -45,9 +45,14 @@ section{
 }
 
 /* START KEVIN */
+.burger{
+  position: fixed;
+  top: 0;
+  right: 0;
+}
   .nav-main{
     display: none;
-    position: absolute;
+    position: fixed;
     right: 0;
     top: 70px;
     background: white;
@@ -58,6 +63,21 @@ section{
   }
 /* END KEVIN */
 
+.menu-item {
+  font-family: Millimetre, sans-serif;
+  text-transform: uppercase;
+  padding: 15px;
+}
+
+  /*.nav-main li:first-child {display: none;}
+  .nav-main li:first-child:hover .menu-item ul {display:block;}*/
+
+
+.menu-item a:hover {
+  background-color: black;
+  color: white;
+}
+
 .titre_page, .titre {
   position: absolute;
   top: -100px;
@@ -127,7 +147,7 @@ section{
     content: "Picto";
     position: absolute;
     transform: translate(-50%, -50%);
-    background: grey;
+    background: black;
     border-radius: 50px;
   }
 
@@ -152,7 +172,15 @@ section{
     background-color: white;
     border: 8px solid yellow;
   }
-
+  @media screen and (min-width: 200px) and (max-width: 640px) {
+      .image_sectionasso {
+        display: none;
+        width: 100%;
+    }
+    .content_asso {
+      width: 100%;
+    }
+}
   /* responsive iframe */
   #section_MineVideo .wrapper__content {
     position: relative;
@@ -247,6 +275,28 @@ section{
 
 }
 /*fin sections page accueil*/
+/*page collecte avec formulaire*/
+
+/*trouver comment styliser les champs du formulaire*/
+/*.af-input acf-input{
+  background-color: pink;
+}*/
+.af-submit-button{
+  position: relative;
+  margin: 50px auto 10px auto;
+  display:flex;
+  border: 4px solid black;
+  border-radius: 0%;
+  text-align: center;
+  padding: 5px;
+  transform: scale(1) rotate(0deg);
+  transition: transform 0.3s ease;
+}
+.af-submit-button:hover{
+  transform: scale(1.1) rotate(-10deg);
+  transition: all 0.3s ease;
+}
+/*fin collecte et form*/
 
 /*page évent*/
 .titre_event {
@@ -363,7 +413,7 @@ section{
   border-radius: 0%;
   text-align: center;
   padding: 5px;
-  transform: scale(1);
+  transform: scale(1) rotate(0deg);
   transition: transform 0.3s ease;
 }
 .__bouttons #bouton_asso {
@@ -375,7 +425,7 @@ section{
   top: -30px;
 }
 .__bouttons div:hover, .telechargement_plaquette:hover, .bouton_asso:hover, .redirection_page:hover, .tout_voir:hover {
-  transform: scale(1.1);
+  transform: scale(1.1) rotate(-10deg);
   transition: all 0.3s ease;
 }
 .group_link {
@@ -393,10 +443,44 @@ section{
   border: none;
   border-radius: 0%;
 }
-.hero .slide .flickity-button{
 
+.flickity-button {
+  background: transparent;
+}
+.flickity-prev-next-button {
+  width: 100px;
+  height: 100px;
 }
+.flickity-button-icon {
+  fill: white;
+}
+.flickity-button-icon:hover {
+  fill: black;
+}
+.flickity-prev-next-button:hover {
+  background: transparent;
+}
+.flickity-button:disabled {
+  display: none;
+}
+
 /*FIN BOUTON*/
+/*gestion des dots*/
+.flickity-page-dots {
+  bottom: 0px;
+}
+.flickity-page-dots .dot {
+  width: 12px;
+  height: 12px;
+  opacity: 1;
+  background: transparent;
+  border: 2px solid white;
+}
+.flickity-page-dots .dot.is-selected {
+  background: white;
+}
+/*fin gestion des dots*/
+
 footer{
   background-color: rgba(240, 240, 240, 240);
   width: 100%;
@@ -413,6 +497,24 @@ footer img {
 ._rs{
   margin-left: 5%;
 }
+.container_slide .row {
+  width: 100%;
+ height: 200px;
+ margin-right: 10px;
+ background: #333;
+}
+.container_slide .row .flickity-prev-next-button{
+  width: 50px;
+  height: 50px;
+}
+.container_slide .row li {
+   width: 100%;
+   height: 200px;
+   margin-right: 10px;
+   background: #8C8;
+   border-radius: 5px;
+   counter-increment: carousel-cell;
+}
 
 /* START KEVIN */
   header{
@@ -441,12 +543,12 @@ footer img {
     height: 100%;
     object-fit: cover;
   }
-  .hero .slide .flickity-page-dots{
+  /*.hero .slide .flickity-page-dots{
     bottom: 20px;
   }
   .hero .slide .flickity-page-dots li{
     background: white;
-  }
+  }*/
   .hero .__head{
     width: 100%;
     text-align: center;

+ 1 - 1
web/app/themes/la_mine/templates/accueil.twig

@@ -14,7 +14,7 @@
 			{% endfor %}
 
 			<div class="btn tout_voir">
-				<a href="{{agenda.url}}">Tout voir</a>
+				<a href="/agenda">Tout voir</a>
 			</div>
 		</div>
 		</div>

+ 1 - 1
web/app/themes/la_mine/templates/footer.twig

@@ -36,7 +36,7 @@
   <div class="partenaires row-">
     <div class="_titre">{{options.titre}}</div>
     <div class="logo_partenaires">
-      <div class="container d-flex">
+      <div class="container_slide d-flex">
         <div class="row justify-content align-items">
             {% for partner in options.partenaire %}
               <ul><li><a href="{{partner.lien_site_partenaire}}"><img src="{{ Image(partner.logo).src }}" /></li></ul></a>