From a107bf51db54d3b4b6d579c19500e4969238d973 Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Thu, 18 Nov 2021 11:50:41 +0100
Subject: [PATCH] home bandeau bleu

---
 web/themes/custom/eql/css-compiled/styles.css | 56 ++++++++++-------
 web/themes/custom/eql/scss/pages/_home.scss   | 63 ++++++++++++-------
 2 files changed, 74 insertions(+), 45 deletions(-)

diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css
index a43d620..fdba617 100644
--- a/web/themes/custom/eql/css-compiled/styles.css
+++ b/web/themes/custom/eql/css-compiled/styles.css
@@ -207,36 +207,46 @@ a {
   .block-views-blockactus-blocks-pages-block-1 .view-content {
     display: flex;
     flex-direction: row;
-    justify-content: space-around; }
-    .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child {
-      color: white; }
-      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child .field--name-field-images .field__item img {
-        width: 200px;
+    padding-left: 8rem;
+    padding-right: 4rem;
+    margin: auto; }
+    .block-views-blockactus-blocks-pages-block-1 .view-content .views-row {
+      width: 25%; }
+    .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite {
+      color: white;
+      line-height: 1.5rem;
+      padding: 0.5rem; }
+      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child {
+        display: flex;
+        flex-direction: column; }
+        .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child :nth-child(1) {
+          order: 1; }
+        .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child :nth-child(4) {
+          order: 2; }
+        .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite div:first-child :nth-child(5) {
+          order: 3; }
+      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite .field--name-field-images .field__item img {
+        width: 50%;
         height: fit-content; }
-    .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite h2 {
-      margin: 0; }
-    .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite a {
-      color: white; }
-
-.node-type-actualite div:first-child {
-  display: flex;
-  flex-direction: column; }
-  .node-type-actualite div:first-child :nth-child(1) {
-    order: 1; }
-  .node-type-actualite div:first-child :nth-child(4) {
-    order: 2; }
-  .node-type-actualite div:first-child :nth-child(5) {
-    order: 3; }
+      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite .field:not(.field--name-field-images) {
+        width: 100%; }
+      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite h2 {
+        margin: 0; }
+      .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite a {
+        color: white; }
 
 .field--type-link {
   display: block;
+  float: right;
   width: fit-content;
-  padding: 1rem;
-  font-size: 1.5rem;
+  height: fit-content;
+  padding: 0.4rem 1rem;
+  font-size: 0.8rem;
+  margin: 0;
   background-color: white;
-  border: 2px solid #009ee3; }
+  border: 2px solid #009ee3;
+  list-style: none; }
   .field--type-link a {
-    font-size: 1rem;
     text-transform: uppercase;
     font-weight: 700;
     color: #009ee3; }
diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss
index 6f47fdc..ab28a73 100644
--- a/web/themes/custom/eql/scss/pages/_home.scss
+++ b/web/themes/custom/eql/scss/pages/_home.scss
@@ -35,20 +35,37 @@
     .view-content{
         display: flex;
         flex-direction: row;
-        justify-content: space-around;
+        // justify-content: space-between;
+        padding-left: 8rem;
+        padding-right: 4rem;
+        margin: auto;
+        .views-row{
+            width: 25%;
+        }
         .node-type-actualite{
-            div:first-child{
-                color: $white;
-                .field--name-field-images {
-                    .field__item img{  
-                        width: 200px; 
-                        height: fit-content;  
-                        // &::after{ 
-                        //     content:"line";
-                        // }
-                    }
+            color: $white;
+            line-height: 1.5rem;
+            padding: 0.5rem;
+            div:first-child{                // block actu dans le bandeau
+                display: flex;
+                flex-direction: column;
+
+                :nth-child(1) { order: 1; } 
+                :nth-child(4) { order: 2; }  
+                :nth-child(5) { order: 3; }            
+            }
+            .field--name-field-images {
+                .field__item img{  
+                    width: 50%; 
+                    height: fit-content;  
+                    // &::after{ 
+                    //     content:"line";
+                    // }
                 }
             }
+            .field:not(.field--name-field-images){
+                width: 100%;
+            }
             h2{ margin:0; }
             a{ color: $white; }            
         }
@@ -58,26 +75,28 @@
 
 // actu dans bandeau
 
-.node-type-actualite div:first-child{
-    display: flex;
-    flex-direction: column;
-    :nth-child(1) { order: 1; } 
-    :nth-child(4) { order: 2; }  
-    :nth-child(5) { order: 3; }            
-}
+// .node-type-actualite div:first-child{
+//     display: flex;
+//     flex-direction: column;
+//     :nth-child(1) { order: 1; } 
+//     :nth-child(4) { order: 2; }  
+//     :nth-child(5) { order: 3; }            
+// }
 
 // bouton voir toutes actus du bandeau bleu
 
 .field--type-link {
     display: block;
+    float: right;
     width: fit-content;
-    padding: 1rem;
-    font-size: 1.5rem;
-    
+    height: fit-content;
+    padding: 0.4rem 1rem;
+    font-size: 0.8rem;
+    margin: 0;
     background-color: $white;
     border: 2px solid $blue-light;  
+    list-style: none; 
     a{
-        font-size: 1rem;
         text-transform: uppercase;
         font-weight: 700;
         color: $blue-light;