From 9d2ea6febc7581653c97303aeb3a8d10796d50ea Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Sat, 6 Jul 2024 22:35:42 +0200
Subject: [PATCH] css footer

---
 .../dist/assets/css/bundle.css                | 88 ++++++++-----------
 .../src/assets/scss/pages/consultation.scss   |  4 +-
 .../{_partenaires.scss => partenaires.scss}   | 55 +++++++-----
 .../src/assets/scss/partials/_footer.scss     | 56 ++++++------
 .../templates/page--partenaires.html.twig     |  2 +-
 5 files changed, 103 insertions(+), 102 deletions(-)
 rename web/themes/custom/quartiers_de_demain/src/assets/scss/pages/{_partenaires.scss => partenaires.scss} (67%)

diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
index b4fefed..6abd3c5 100644
--- a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
@@ -378,38 +378,14 @@ header .header:hover + .header_nav_container {
 footer {
   z-index: 100;
 }
-footer span.totop {
-  display: inline-flex;
-  width: 100vw;
-}
-footer span.totop #toTop {
-  margin: auto;
-  background-color: #fff;
-  border-top-left-radius: 10%;
-  border-top-right-radius: 10%;
-  padding-bottom: 0.5rem;
-}
-footer span.totop #toTop .arrow-up {
-  font-size: 1.7rem;
-  line-height: 2.5rem;
-  text-align: center;
-  width: 4rem;
-  height: 2rem;
-  display: inline-block;
-  text-align: top;
-}
-footer span.totop #toTop .arrow-up::before {
-  content: url("/themes/custom/quartiers_de_demain/src/assets/img/up-arrow.svg");
-}
 
 .footer {
   display: grid;
   grid-template-columns: repeat(12, 1fr);
   grid-template-rows: repeat(1, 1fr);
-  background-color: rgb(255, 255, 255);
+  background-color: #edefe8;
   padding-top: 1rem;
   padding-bottom: 1rem;
-  border-top: 1px solid #808080;
 }
 .footer section {
   width: fit-content;
@@ -463,7 +439,7 @@ footer span.totop #toTop .arrow-up::before {
 }
 .footer #footer-left .footer_left_container img {
   width: auto;
-  height: 320px;
+  height: 150px;
 }
 @media (max-width: 700px) {
   .footer #footer-left .footer_left_container img {
@@ -1353,8 +1329,8 @@ footer span.totop #toTop .arrow-up::before {
 #consultation .layout-content .content_container .node-type-static::before {
   content: "";
   display: block;
-  border-bottom: solid 1px rgb(7, 50, 194);
-  width: 60%;
+  border-bottom: solid 2px rgb(7, 50, 194);
+  width: 80%;
   margin: auto;
 }
 #consultation .layout-content .content_container .node-type-static .paragraph--type--static-parts:not(#paragraph-id--7) #svg1 {
@@ -1476,10 +1452,17 @@ footer span.totop #toTop .arrow-up::before {
   width: 30%;
 }
 
+.partenaires {
+  background-color: #f6f7f3;
+}
+.partenaires .layout-content .content_container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
 .partenaires .layout-content .content_container #block-quartiers-de-demain-titredepage {
-  grid-column: 3/span 9;
-  grid-row: 1;
-  margin-top: 3rem;
+  margin-top: 1rem;
+  width: fit-content;
 }
 @media (max-width: 500px) {
   .partenaires .layout-content .content_container #block-quartiers-de-demain-titredepage {
@@ -1488,26 +1471,28 @@ footer span.totop #toTop .arrow-up::before {
   }
 }
 .partenaires .layout-content .content_container #block-quartiers-de-demain-titredepage h1 {
-  text-transform: uppercase;
-  color: rgb(247, 0, 43);
-  font-size: 1.6rem;
-  font-weight: 300;
+  text-transform: none;
+  color: black;
+  font-size: 2rem;
+  font-weight: 500;
 }
 .partenaires .layout-content .content_container .views-element-container {
-  grid-column: 3/span 9;
-  grid-row: 2;
+  width: 80%;
 }
-@media (max-width: 500px) {
-  .partenaires .layout-content .content_container .views-element-container {
-    grid-column: 2/span 9;
-  }
+.partenaires .layout-content .content_container .views-element-container::before {
+  content: "";
+  display: block;
+  border-bottom: solid 2px rgb(7, 50, 194);
+  width: 80%;
+  margin: auto;
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire {
   width: 100%;
   padding-bottom: 3rem;
   display: grid;
-  grid-template-columns: repeat(9, 1fr);
+  grid-template-columns: 1fr repeat(5, 2fr) 1fr;
   grid-template-rows: repeat(auto-fill);
+  padding-top: 1rem;
 }
 @media (max-width: 810px) {
   .partenaires .layout-content .content_container .views-element-container .node-type-partenaire {
@@ -1516,7 +1501,7 @@ footer span.totop #toTop .arrow-up::before {
   }
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_logo {
-  grid-column: 1/3;
+  grid-column: 2/3;
   grid-row: 1/span 3;
   padding-right: 1rem;
   margin: auto;
@@ -1527,7 +1512,7 @@ footer span.totop #toTop .arrow-up::before {
   max-height: 200px;
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_title {
-  grid-column: 3/span 8;
+  grid-column: 3/span 4;
   grid-row: 1;
   font-weight: 500;
   font-size: 0.6rem;
@@ -1539,7 +1524,7 @@ footer span.totop #toTop .arrow-up::before {
   }
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_body {
-  grid-column: 3/span 8;
+  grid-column: 3/span 4;
   grid-row: 2;
   margin-left: 1rem;
 }
@@ -1549,12 +1534,12 @@ footer span.totop #toTop .arrow-up::before {
   }
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien {
-  grid-column: 3/span 8;
+  grid-column: 3/span 4;
   grid-row: 3;
-  border-bottom: 2px solid rgb(7, 50, 194);
   width: fit-content;
-  padding-bottom: 0.5rem;
   margin-left: 1rem;
+  padding-left: 0.5rem;
+  background: black;
 }
 @media (max-width: 810px) {
   .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien {
@@ -1564,15 +1549,18 @@ footer span.totop #toTop .arrow-up::before {
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien a {
   display: inline-flex;
   align-items: center;
+  color: white;
+  background: black;
+  text-transform: uppercase;
+  font-size: 0.6rem;
 }
 .partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien a svg {
   display: none;
 }
-.partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien a::before {
+.partenaires .layout-content .content_container .views-element-container .node-type-partenaire .field_field_lien a::after {
   display: inline-block;
   content: url("../img/noun-arrow-to-right.svg");
   padding-right: 0.5rem;
-  padding-top: 0.2rem;
 }
 
 .node-type-static .layout-content {
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
index 5a31438..a324279 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
@@ -25,8 +25,8 @@
                 &::before{
                     content:"";
                     display: block;
-                    border-bottom: solid 1px $blue_QDD;
-                    width: 60% ;
+                    border-bottom: solid 2px $blue_QDD;
+                    width: 80% ;
                     margin: auto;
                 }
                 
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/_partenaires.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/partenaires.scss
similarity index 67%
rename from web/themes/custom/quartiers_de_demain/src/assets/scss/pages/_partenaires.scss
rename to web/themes/custom/quartiers_de_demain/src/assets/scss/pages/partenaires.scss
index 3e0f547..d5b2c2c 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/_partenaires.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/partenaires.scss
@@ -1,42 +1,49 @@
 .partenaires{
+    background-color: #f6f7f3;
     .layout-content{
         .content_container{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
             #block-quartiers-de-demain-titredepage{
-                grid-column: 3 /span 9;
-                grid-row: 1;
-                margin-top: 3rem;
+                margin-top: 1rem;
+                width: fit-content;
                 @media(max-width: 500px){
                     margin-top: 1rem;
                     grid-column: 2 /span 9;
                 } 
 
                 h1{
-                    text-transform: uppercase;
-                    color: $red_QDD ;
-                    font-size: $font-large;
-                    font-weight: 300;
+                    text-transform: none;
+                    color: black;
+                    font-size: 2rem;
+                    font-weight: 500;
                 }
             }
             .views-element-container{
-                grid-column: 3 /span 9;
-                grid-row: 2;
-                @media(max-width: 500px){
-                    grid-column: 2 /span 9;
-                } 
-
+                &::before{
+                    content:"";
+                    display: block;
+                    border-bottom: solid 2px $blue_QDD;
+                    width: 80% ;
+                    margin: auto;
+                }
+                
+                width: 80%;
                 .node-type-partenaire{
                     width: 100%;
                     padding-bottom: 3rem;
                     display: grid;
-                    grid-template-columns: repeat(9, 1fr);
+                    grid-template-columns: 1fr repeat(5, 2fr) 1fr;
                     grid-template-rows: repeat(auto-fill);
                     // grid-gap: 10px;
+                    padding-top: 1rem;
                     @media (max-width: 810px){
                         display: flex;
                         flex-direction: column;
                     }
                     .field_field_logo{
-                        grid-column: 1 / 3;
+                        grid-column: 2 / 3;
                         grid-row:  1 /span 3;
                         padding-right: 1rem;
                         margin: auto;
@@ -47,7 +54,7 @@
                         }
                     }
                     .field_title{
-                        grid-column: 3 /span 8;
+                        grid-column: 3 /span 4;
                         grid-row:  1;
                         font-weight: 500;
                         font-size: $font-normal;
@@ -57,7 +64,7 @@
                         }
                     }
                     .field_body{
-                        grid-column: 3 /span 8;
+                        grid-column: 3 /span 4 ;
                         grid-row:  2;
                         margin-left: 1rem;
                         @media (max-width:810px) {  
@@ -66,12 +73,12 @@
 
                     }
                     .field_field_lien{
-                        grid-column: 3 /span 8;
+                        grid-column: 3 /span 4;
                         grid-row:  3;
-                        border-bottom: 2px solid $blue_QDD;
                         width: fit-content;
-                        padding-bottom: 0.5rem;
                         margin-left: 1rem;
+                        padding-left: 0.5rem;
+                        background: black;
                         @media (max-width:810px) {  
                             margin-left: 0;
                         }
@@ -79,14 +86,18 @@
                         a{
                             display: inline-flex;
                             align-items: center;
+                            color: white;
+                            background: black;
+                            text-transform: uppercase;
+                            font-size: 0.6rem;
                             svg{
                                 display: none;
                             }
-                            &::before{
+                            &::after{
                                 display: inline-block;
                                 content: url("../img/noun-arrow-to-right.svg");
                                 padding-right: 0.5rem;
-                                padding-top: 0.2rem;
+                                
                             }
                         }
                     }
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/_footer.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/_footer.scss
index 408cd0e..6aa5f55 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/_footer.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/_footer.scss
@@ -1,43 +1,45 @@
 footer{
     z-index: 100;
-    span.totop {
-        display: inline-flex;
-        width: 100vw;
-        #toTop{
-            margin: auto;
-            background-color: #fff;
-            border-top-left-radius: 10%;
-            border-top-right-radius: 10%;
-            padding-bottom: 0.5rem;
-            .arrow-up{
-                font-size: 1.7rem;
-                line-height: 2.5rem;
-                text-align: center;
-                width: 4rem;
-                height: 2rem;
-                display: inline-block;
-                text-align: top;
+    
+    // span.totop {
+    //     display: inline-flex;
+    //     width: 100vw;
+    //     #toTop{
+    //         margin: auto;
+    //         background-color: #fff;
+    //         border-top-left-radius: 10%;
+    //         border-top-right-radius: 10%;
+    //         padding-bottom: 0.5rem;
+    //         .arrow-up{
+    //             font-size: 1.7rem;
+    //             line-height: 2.5rem;
+    //             text-align: center;
+    //             width: 4rem;
+    //             height: 2rem;
+    //             display: inline-block;
+    //             text-align: top;
 
-                &::before{
-                    content:url("/themes/custom/quartiers_de_demain/src/assets/img/up-arrow.svg") ;
+    //             &::before{
+    //                 content:url("/themes/custom/quartiers_de_demain/src/assets/img/up-arrow.svg") ;
                     
-                    // width: 20%;
-                }
-            }
+    //                 // width: 20%;
+    //             }
+    //         }
 
-        }
-    }
+    //     }
+    // }
 }
 .footer{
+    
     display: grid;
     grid-template-columns: repeat(12, 1fr);
     grid-template-rows: repeat(1, 1fr);
-    background-color: $white-header;
+    background-color: #edefe8;
     padding-top: 1rem;
     padding-bottom: 1rem;
     section{width: fit-content;}
     h2, ul{margin: 0;}
-    border-top: 1px solid #808080;
+    // border-top: 1px solid #808080;
      @media(max-width: 700px){
         display: flex;
         flex-wrap: wrap;
@@ -91,7 +93,7 @@ footer{
             }
             img{
                 width: auto;
-                height: $header-height;
+                height: 150px;
                 @media(max-width: 700px){
                     height: $header-height-pad;
                 }
diff --git a/web/themes/custom/quartiers_de_demain/templates/page--partenaires.html.twig b/web/themes/custom/quartiers_de_demain/templates/page--partenaires.html.twig
index 10535d7..ab14a80 100644
--- a/web/themes/custom/quartiers_de_demain/templates/page--partenaires.html.twig
+++ b/web/themes/custom/quartiers_de_demain/templates/page--partenaires.html.twig
@@ -80,7 +80,7 @@
   {# {% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %} #}
     <footer role="contentinfo">
       {# <section id="footer-top"> #}
-          <span class="totop"><a href="#" id="toTop"><i class="arrow-up"></i></a></span>
+          {# <span class="totop"><a href="#" id="toTop"><i class="arrow-up"></i></a></span> #}
       {# </section>  #}
       <div class="footer">
         <section id="footer-left">{{ page.footer_left }}</section>