Explorar o código

responsive actu

ouidade %!s(int64=3) %!d(string=hai) anos
pai
achega
3bd5e4d1a0

+ 28 - 0
web/themes/custom/eql/css-compiled/styles.css

@@ -718,6 +718,9 @@ a {
     .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodefield-actu-type {
       padding-top: 2rem;
       grid-column: 2; }
+      @media (max-width: 810px) {
+        .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodefield-actu-type {
+          margin-left: 10%; } }
     .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodetitle {
       grid-column: 2 /span 7;
       margin: 0; }
@@ -725,6 +728,16 @@ a {
         font-family: "Source Code Pro";
         font-size: 2.5rem;
         font-weight: 500; }
+        @media (max-width: 810px) {
+          .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodetitle .field--name-title {
+            font-size: 2rem;
+            margin-right: 10%; } }
+      @media (max-width: 810px) {
+        .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodetitle {
+          width: 70%;
+          margin-left: 10%;
+          margin-right: 10%;
+          font-size: 2rem; } }
     .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodefield-date {
       grid-column: 2 / span 3;
       text-transform: uppercase;
@@ -739,6 +752,9 @@ a {
           padding-right: 1rem;
           padding-left: 1rem;
           content: "|"; }
+      @media (max-width: 810px) {
+        .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodefield-date {
+          margin-left: 10%; } }
     .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre {
       grid-column: 2 /span 7;
       margin-top: 1rem;
@@ -751,6 +767,10 @@ a {
         width: 600px;
         max-height: 360px;
         object-fit: cover; }
+    @media (max-width: 810px) {
+      .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--top .block-region-top {
+        display: flex;
+        flex-direction: column; } }
 
 .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--first .block-region-first {
   display: flex;
@@ -776,6 +796,10 @@ a {
       .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre:hover {
         text-decoration: underline; }
 
+@media (max-width: 810px) {
+  .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--first {
+    display: none; } }
+
 .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--second {
   flex: 0 1 50%; }
   .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--second .block-region-second {
@@ -828,6 +852,10 @@ a {
         align-items: center; }
         .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--second .block-region-second .block-entity-fieldnodefield-partenaires .field__items .paragraph--type--partenaire .field--name-field-lien {
           padding-top: 1rem; }
+  @media (max-width: 810px) {
+    .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--second {
+      flex: 0 1 80%;
+      margin: auto; } }
 
 .path-node.page-node-type-actualite .layout--threecol-25-50-25 .layout__region--third .block-region-third {
   display: flex;

+ 31 - 2
web/themes/custom/eql/scss/pages/_actualite.scss

@@ -42,6 +42,9 @@
                 .block-entity-fieldnodefield-actu-type{
                     padding-top: 2rem;
                     grid-column: 2;
+                    @media (max-width: 810px){
+                        margin-left: 10%;
+                    }
                 }
             
                 .block-entity-fieldnodetitle{
@@ -51,7 +54,18 @@
                         font-family: "Source Code Pro";
                         font-size: 2.5rem;
                         font-weight: 500;
+                        @media (max-width: 810px){
+                            font-size: 2rem;
+                            margin-right: 10%;
+                        }
                     }
+                    @media (max-width: 810px){
+                        width:  70%;
+                        margin-left: 10%;
+                        margin-right: 10%;
+                        font-size: 2rem;
+                    }
+                    
                 }
 
                 .block-entity-fieldnodefield-date{
@@ -70,6 +84,9 @@
                             content: "|";
                         }
                     }
+                    @media (max-width: 810px){
+                        margin-left: 10%;
+                    }
                 }
 
                 .block-entity-fieldnodefield-sous-titre{
@@ -93,10 +110,14 @@
                     // bottom: -50%;
                     
                 }
-    
+                @media (max-width: 810px){
+                    display: flex;
+                    flex-direction: column;
+                }
             }                       
         }
         .layout__region--first{
+            
             // margin-top: 18rem;
 
             .block-region-first{
@@ -131,7 +152,9 @@
                 }
             }
 
-            
+            @media (max-width: 810px){
+                display: none;
+            }
         }
         .layout__region--second{ 
             // grid-row: 3; 
@@ -219,6 +242,12 @@
                     }
                 }
             }
+
+            @media (max-width: 810px){
+                flex: 0 1 80%;
+                margin: auto;
+
+            }
         }
         
         .layout__region--third{