responsive page /ressource

web/themes/custom/reha/dist/css/bundle.css

@@ -3433,15 +3433,38 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   grid-template-rows: repeat(2, auto);
   padding-top: 3rem;
 }
+@media (max-width: 510px) {
+  .node-type-ressource {
+    display: flex;
+    flex-direction: column;
+    padding-top: 0;
+  }
+}
 .node-type-ressource .image-ressource {
   grid-row: 1;
   grid-column: 2;
   margin-right: 2rem;
 }
-.node-type-ressource .image-ressource img {
+@media (max-width: 510px) {
+  .node-type-ressource .image-ressource {
+    width: 100%;
+  }
+}
+@media (max-width: 510px) {
+  .node-type-ressource .image-ressource .field__item {
+    display: flex;
+    width: 100%;
+  }
+}
+.node-type-ressource .image-ressource .field__item img {
   height: 400px;
   width: auto;
 }
+@media (max-width: 510px) {
+  .node-type-ressource .image-ressource .field__item img {
+    margin: auto;
+  }
+}
 .node-type-ressource .infos-content {
   grid-row: 1;
   grid-column: 3/span 4;
@@ -3449,6 +3472,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   border: none;
   background-color: transparent;
 }
+@media (max-width: 510px) {
+  .node-type-ressource .infos-content {
+    width: 85%;
+  }
+}
 .node-type-ressource .infos-content .field--name-field-type-de-ressource {
   text-transform: uppercase;
   font-size: 1rem;
@@ -3489,6 +3517,12 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   width: 100%;
   margin-top: 2rem;
 }
+@media (max-width: 510px) {
+  .node-type-ressource .body-content {
+    width: 80%;
+    margin: auto;
+  }
+}
 .node-type-ressource .body-content .field--name-field-fichiers {
   width: fit-content;
 }

web/themes/custom/reha/scss/pages/_node-ressource.scss

@@ -9,16 +9,33 @@
         // #block-reha-titredepage{
         //     display: block !important;
         // }
-
+        @media (max-width:510px){
+            display: flex;
+            flex-direction: column;
+            padding-top: 0;
+        }
         .image-ressource{
             grid-row: 1;
             grid-column: 2;
             margin-right: 2rem;
-
-            img{
-                height: 400px;
-                width: auto;
+            @media (max-width:510px){
+                width: 100%;
+            }
+            .field__item{
+                @media (max-width:510px){
+                    display: flex;
+                    width: 100%;
+                }  
+                img{
+                    height: 400px;
+                    width: auto;
+                    @media (max-width:510px){
+                        margin: auto;
+                    } 
+                }     
             }
+
+           
         }
         .infos-content{
             grid-row: 1;
@@ -26,6 +43,9 @@
             margin-left: 2rem;
             border: none;
             background-color:transparent;
+            @media(max-width:510px){
+                width: 85%;
+            }
             .field--name-field-type-de-ressource{
                 text-transform: uppercase;
                 font-size: 1rem;
@@ -66,6 +86,10 @@
             grid-column: 2 /span 3;
             width: 100%;
             margin-top: 2rem;
+            @media (max-width:510px){
+                width: 80%;
+                margin: auto;
+            }
             .field--name-field-fichiers{
                 width: fit-content;
             }