Przeglądaj źródła

responsive /actualités

ouidade 1 tydzień temu
rodzic
commit
0ca64c9ba4

+ 18 - 0
web/themes/custom/reha/dist/css/bundle.css

@@ -3406,10 +3406,23 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   align-items: baseline;
   justify-content: space-between;
 }
+@media (max-width: 891px) {
+  .page-actualites .view-actus {
+    flex-direction: column;
+    width: 100%;
+  }
+}
 .page-actualites .view-actus .views-row {
   width: 28%;
   padding: 1rem;
 }
+@media (max-width: 891px) {
+  .page-actualites .view-actus .views-row {
+    width: 95%;
+    margin: auto;
+    padding: 0;
+  }
+}
 .page-actualites .view-actus .views-row:hover {
   transform: scale(1.05);
   transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -3417,6 +3430,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .page-actualites .view-actus .views-row .node-type-actualite {
   width: 30vw !important;
 }
+@media (max-width: 891px) {
+  .page-actualites .view-actus .views-row .node-type-actualite {
+    width: 100% !important;
+  }
+}
 .page-actualites .view-actus .views-row .node-type-actualite .entete_actu {
   flex-direction: column;
 }

+ 12 - 0
web/themes/custom/reha/scss/pages/_actualites.scss

@@ -13,15 +13,27 @@
         flex-wrap: wrap;
         align-items: baseline;
         justify-content: space-between;
+        @media (max-width:891px) {
+            flex-direction: column;
+            width: 100%;
+        }
         .views-row{
             width: 28%;
             padding: 1rem;
+            @media (max-width:891px) {
+                width: 95%;
+                margin: auto;
+                padding: 0;
+            }
             &:hover{
                 transform: scale(1.05);
                 transition: 0.3s transform ease, 0.3s box-shadow ease;   
             }
             .node-type-actualite{
                 width: 30vw !important;
+                @media (max-width:891px) {
+                    width: 100% !important;
+                }
                 .entete_actu{
                     flex-direction: column;
                     .image-actualite{