فهرست منبع

responsive page programme

ouidade 1 هفته پیش
والد
کامیت
8599dc1377

+ 32 - 1
web/themes/custom/reha/dist/css/bundle.css

@@ -194,7 +194,7 @@
 }
 @media (max-width: 500px) {
   .layout-content {
-    padding-top: 0;
+    padding-top: 2rem;
   }
 }
 .layout-content .layout__region--first {
@@ -203,6 +203,12 @@
 .layout-content .layout__region--second {
   flex: 0 1 75%;
 }
+@media (max-width: 810px) {
+  .layout-content .layout__region--second {
+    flex: 0 1 90%;
+    margin: auto;
+  }
+}
 .layout-content .layout__region--second.view-id-home {
   margin: 0;
 }
@@ -2456,6 +2462,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
     width: 40%;
   }
 }
+@media (max-width: 810px) {
+  .page-sitespilotes .view-display-id-page_1 .views-row {
+    width: 100%;
+  }
+}
 .page-sitespilotes .view-display-id-page_1 .views-row:hover {
   transform: scale(1.05);
   transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -2595,6 +2606,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row:hover {
   transform: none;
 }
+@media (max-width: 810px) {
+  .page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row {
+    width: 100%;
+  }
+}
 .page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site {
   margin: auto;
   display: flex;
@@ -2885,6 +2901,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   margin-top: 0.6rem;
   border-bottom: #fdc300 solid 2px;
 }
+@media (max-width: 810px) {
+  .page-programme .layout__region--first .block-region-first {
+    display: none;
+  }
+}
 .page-programme .block-region-second h2 {
   font-weight: 1000;
   font-size: 1.8rem;
@@ -2893,11 +2914,21 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   width: 80%;
   font-size: 1.2rem;
 }
+@media (max-width: 810px) {
+  .page-programme .block-region-second .block-views-blockhome-block-1 {
+    width: 100%;
+  }
+}
 .page-programme .block-region-second .view-display-id-block_1 {
   margin: 0;
   width: 80%;
   padding-top: 1rem;
 }
+@media (max-width: 810px) {
+  .page-programme .block-region-second .view-display-id-block_1 {
+    width: 100%;
+  }
+}
 .page-programme .block-region-second .block-config-pages-block {
   margin: 0;
   width: 80%;

+ 5 - 1
web/themes/custom/reha/scss/global/_layout.scss

@@ -43,13 +43,17 @@ $width-menu-slidedown : 550px;
         width: 90%;
     }
     @media (max-width:500px) {
-       padding-top: 0;
+       padding-top: 2rem;
     }
     .layout__region--first{
         flex: 0 1 25%;
     }
     .layout__region--second{
         flex: 0 1 75%;
+        @media (max-width:810px){
+            flex: 0 1 90%;
+            margin: auto;
+        }
         &.view-id-home{
             margin: 0;
         }

+ 48 - 38
web/themes/custom/reha/scss/pages/_le-programme.scss

@@ -46,6 +46,9 @@
                     }
                 }
             }
+            @media (max-width:810px){
+               display: none;
+            }
         }
     }
     .block-region-second{
@@ -56,59 +59,66 @@
         .block-views-blockhome-block-1{
             width: 80%;
             font-size: 1.2rem;
+            @media (max-width:810px){
+                width: 100%;
+            }
         }
         .view-display-id-block_1{
             margin: 0;
             width: 80%;
             padding-top: 1rem;
+            @media (max-width:810px){
+                width: 100%;
+            }
         }
+        
 
-    .block-config-pages-block{
-        margin: 0;
-        width: 80%;
-        padding-top: 1rem;
-        .config_pages--partenaires--full{
-            .paragraph--type--partenaire{
-                width: 100%;
-                padding-bottom: 3rem;
-                height: 205px;
-                display: flex;
-                flex-direction: column;
-                flex-wrap: wrap;
-                justify-content: center;
-                align-content: baseline;
-                @media (max-width: 810px){
+        .block-config-pages-block{
+            margin: 0;
+            width: 80%;
+            padding-top: 1rem;
+            .config_pages--partenaires--full{
+                .paragraph--type--partenaire{
+                    width: 100%;
+                    padding-bottom: 3rem;
+                    height: 205px;
                     display: flex;
                     flex-direction: column;
-                }
-                .paragraph--type--partenaire>* {
-                flex: 1 1 80px;
-                }
-                .field--name-field-logo{
-                    width: fit-content;
-                    padding-right: 1rem;
-                }
-                .field--name-field-nom{
-                    font-weight: 900;
-                    font-size: 1.2rem
-                }
-                .field--name-field-texte{
-                    .field__item{
-                        p{
-                            strong{
-                                background-color: none;
+                    flex-wrap: wrap;
+                    justify-content: center;
+                    align-content: baseline;
+                    @media (max-width: 810px){
+                        display: flex;
+                        flex-direction: column;
+                    }
+                    .paragraph--type--partenaire>* {
+                    flex: 1 1 80px;
+                    }
+                    .field--name-field-logo{
+                        width: fit-content;
+                        padding-right: 1rem;
+                    }
+                    .field--name-field-nom{
+                        font-weight: 900;
+                        font-size: 1.2rem
+                    }
+                    .field--name-field-texte{
+                        .field__item{
+                            p{
+                                strong{
+                                    background-color: none;
+                                }
                             }
                         }
                     }
+                    .field--name-field-lien{
+                        background-color: none;
+                    }
+                
+                
                 }
-                .field--name-field-lien{
-                    background-color: none;
-                }
-            
-            
             }
         }
     }
-    }
 }
 

+ 6 - 0
web/themes/custom/reha/scss/pages/_les-sites-pilotes.scss

@@ -29,6 +29,9 @@
             @media (max-width:1200px){
                 width: 40%;
             }
+            @media (max-width:810px){
+                width: 100%;
+            }
             &:hover{
                 transform: scale(1.05);
                 transition: 0.3s transform ease, 0.3s box-shadow ease;   
@@ -170,6 +173,9 @@
                     &:hover{
                         transform: none;
                     }
+                    @media (max-width:810px){
+                        width: 100%;
+                    }
                     .node-type-site{
                         margin: auto;
                         display: flex;