From 28834ee6832609ceb606c0b57c6c43f2731e052a Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Fri, 19 Nov 2021 23:48:52 +0100
Subject: [PATCH] grid home

---
 web/themes/custom/eql/css-compiled/styles.css | 70 ++++++++++---------
 .../custom/eql/scss/pages/_gouvernance.scss   |  0
 web/themes/custom/eql/scss/pages/_home.scss   | 30 +++++---
 web/themes/custom/eql/scss/styles.scss        |  1 +
 4 files changed, 59 insertions(+), 42 deletions(-)
 create mode 100644 web/themes/custom/eql/scss/pages/_gouvernance.scss

diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css
index 452745f..0a8b311 100644
--- a/web/themes/custom/eql/css-compiled/styles.css
+++ b/web/themes/custom/eql/css-compiled/styles.css
@@ -252,9 +252,14 @@ a {
       .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite a {
         color: white; }
 
+.layout--onecol .block-block-content {
+  display: grid;
+  grid-template-columns: 1fr repeat(8, 2fr) 1fr; }
+
 .layout--onecol .field--type-link {
-  display: block;
-  float: right;
+  grid-area: 8 / span 9;
+  grid-row: 0;
+  justify-self: end;
   width: fit-content;
   height: fit-content;
   padding: 0.4rem 1rem;
@@ -273,40 +278,39 @@ a {
 
 .view-display-id-block_2 {
   padding-top: 2rem; }
-  .view-display-id-block_2 .node-type-static {
-    width: 80%;
-    margin: auto;
-    padding: 1rem; }
-    .view-display-id-block_2 .node-type-static div:first-child:not(.field__item):not(.field) {
-      display: flex;
-      flex-direction: row; }
-    .view-display-id-block_2 .node-type-static .inline.links {
-      align-self: flex-end;
-      width: fit-content;
-      height: fit-content;
-      padding: 0.4rem 1rem;
-      font-size: 0.8rem;
-      margin: 0;
-      background-color: white;
-      border: 2px solid #009ee3;
-      list-style: none; }
-      .view-display-id-block_2 .node-type-static .inline.links a {
-        text-transform: uppercase;
-        font-weight: 700;
-        color: #009ee3; }
+  .view-display-id-block_2 .node-type-static div:first-child:not(.field__item):not(.field) {
+    display: grid;
+    grid-template-columns: 1fr repeat(8, 2fr) 1fr; }
+  .view-display-id-block_2 .node-type-static .inline.links {
+    grid-column: 9;
+    grid-row: 2;
+    width: fit-content;
+    height: fit-content;
+    padding: 0.4rem 1rem;
+    font-size: 0.8rem;
+    margin: 0;
+    background-color: white;
+    border: 2px solid #009ee3;
+    list-style: none; }
+    .view-display-id-block_2 .node-type-static .inline.links a {
+      text-transform: uppercase;
+      font-weight: 700;
+      color: #009ee3; }
+  .view-display-id-block_2 .node-type-static .field--name-field-images {
+    grid-column: 2 / 3; }
     .view-display-id-block_2 .node-type-static .field--name-field-images .field__item img {
       width: 15rem;
       height: auto; }
-    .view-display-id-block_2 .node-type-static .field--name-title {
-      display: none; }
-    .view-display-id-block_2 .node-type-static .field--name-field-accroche {
-      flex: 1 1 50px;
-      padding-left: 1rem; }
-      .view-display-id-block_2 .node-type-static .field--name-field-accroche p {
-        font-size: 1.5rem;
-        width: 110%;
-        margin: 0;
-        padding-bottom: 1rem; }
+  .view-display-id-block_2 .node-type-static .field--name-title {
+    display: none; }
+  .view-display-id-block_2 .node-type-static .field--name-field-accroche {
+    grid-column: 3 / 9;
+    padding-left: 1rem; }
+    .view-display-id-block_2 .node-type-static .field--name-field-accroche p {
+      font-size: 1.5rem;
+      width: 110%;
+      margin: 0;
+      padding-bottom: 1rem; }
 
 .field--name-field-partenaires {
   padding-top: 3rem; }
diff --git a/web/themes/custom/eql/scss/pages/_gouvernance.scss b/web/themes/custom/eql/scss/pages/_gouvernance.scss
new file mode 100644
index 0000000..e69de29
diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss
index 9a9801a..8836270 100644
--- a/web/themes/custom/eql/scss/pages/_home.scss
+++ b/web/themes/custom/eql/scss/pages/_home.scss
@@ -85,9 +85,18 @@
 
 // bouton voir toutes actus du bandeau bleu
 .layout--onecol{
+    .block-block-content{
+        display: grid;
+        // grid-template-rows: repeat(auto fill, 1fr);
+        grid-template-columns: 1fr repeat(8, 2fr) 1fr;
+    }
+        
     .field--type-link {
-        display: block;
-        float: right;
+        grid-area: 8 / span 9;
+        grid-row: 0;
+        justify-self: end;
+        // display: block;
+        // float: right;
         width: fit-content;
         height: fit-content;
         padding: 0.4rem 1rem;
@@ -115,16 +124,17 @@
 .view-display-id-block_2{
     padding-top: 2rem;
     .node-type-static{
-        width: 80%;
-        margin: auto;
+        // margin: auto;
         div:first-child:not(.field__item):not(.field){
-            display: flex;
-            flex-direction: row;
+        display: grid;
+        // grid-template-rows: repeat(auto fill, 1fr);
+        grid-template-columns: 1fr repeat(8, 2fr) 1fr;
         }
-        padding: 1rem;
 
         .inline.links{
-            align-self: flex-end;
+            // align-self: flex-end;
+            grid-column: 9;
+            grid-row: 2;
             width: fit-content;
             height: fit-content;
             padding: 0.4rem 1rem;
@@ -144,6 +154,7 @@
             }
         }
         .field--name-field-images{
+            grid-column: 2 / 3;
             .field__item{
                 img{
                     width: 15rem;
@@ -155,7 +166,8 @@
             display: none;
         }
         .field--name-field-accroche{
-            flex: 1 1 50px;
+            // flex: 1 1 50px;
+            grid-column: 3 / 9;
             padding-left: 1rem;
             p{
                 font-size: 1.5rem;
diff --git a/web/themes/custom/eql/scss/styles.scss b/web/themes/custom/eql/scss/styles.scss
index ea4eee5..1ca683f 100644
--- a/web/themes/custom/eql/scss/styles.scss
+++ b/web/themes/custom/eql/scss/styles.scss
@@ -21,6 +21,7 @@
 @import "pages/_home";
 @import "pages/_partenaires";
 @import "pages/_actualites";
+@import "pages/_gouvernance";
 
 
 /*partials*/