smart phone home et footer

web/themes/custom/eql/css-compiled/styles.css

@@ -350,7 +350,7 @@ a {
 
 .path-frontpage .block-region-content {
   display: grid;
-  grid-template-areas: "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"  "actus actus actus actus actus actus" "actus actus actus actus actus actus" "programme programme programme programme programme programme" "programme programme programme programme programme programme" "programme programme programme programme programme programme";
+  grid-template-areas: "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"  "presentation presentation presentation presentation presentation presentation"   "actus actus actus actus actus actus" "actus actus actus actus actus actus" "programme programme programme programme programme programme" "programme programme programme programme programme programme" "programme programme programme programme programme programme";
   grid-template-rows: auto auto auto;
   grid-template-columns: 1fr repeat(4, 2fr) 1fr;
   min-height: 100vh; }
@@ -361,6 +361,13 @@ a {
     background-position-y: bottom;
     background-position-x: left;
     background-repeat: no-repeat; }
+    @media (max-width: 810px) {
+      .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 {
+        background: url("../images/pictos/forme_home_2_smartphone.svg");
+        background-size: 100%;
+        background-position-y: bottom;
+        background-position-x: left;
+        background-repeat: no-repeat; } }
     .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child {
       display: grid;
       grid-template-columns: 1fr repeat(4, 2fr) 1fr;
@@ -434,8 +441,11 @@ a {
             content: url('data:image/svg+xml,<svg width="40" height="20" xmlns="http://www.w3.org/2000/svg" version="1.1"><polyline points="71.9,49 24.3,49 24.3,51 71.9,51 58.1,64.8 59.5,66.2 75.7,50 59.5,33.8 58.1,35.2" transform="scale(0.5) translate(0,-25)"  fill="rgb(0,158,227)" stroke="rgb(0,158,227)" stroke-width="0.7"/></svg>'); }
         @media (max-width: 810px) {
           .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .links.inline {
-            grid-column: 2 / 5;
-            grid-row: 3; } }
+            grid-column: 2;
+            grid-row: 3;
+            font-size: 0.6rem; }
+            .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .links.inline a:after {
+              display: none; } }
   .path-frontpage .block-region-content .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca {
     grid-area: presentation;
     grid-column: 3 /span 4;
@@ -469,8 +479,12 @@ a {
     @media (max-width: 810px) {
       .path-frontpage .block-region-content .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca {
         grid-area: presentation;
-        grid-column: 3 /span 4;
-        grid-row: 3; } }
+        grid-column: 5;
+        grid-row: 4; }
+        .path-frontpage .block-region-content .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link {
+          font-size: 0.6rem; }
+          .path-frontpage .block-region-content .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link a::after {
+            display: none; } }
   .path-frontpage .block-region-content .block-block-content1bb9024b-d95f-4137-894c-362abf10a483 {
     grid-area: presentation;
     grid-column: 5;
@@ -515,9 +529,10 @@ a {
           text-transform: uppercase;
           font-weight: 700;
           color: #009ee3;
-          align-items: center; }
+          align-items: center;
+          font-size: 0.6rem; }
         .path-frontpage .block-region-content .block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-lien a::after {
-          content: url('data:image/svg+xml,<svg width="40" height="20" xmlns="http://www.w3.org/2000/svg" version="1.1"><polyline points="71.9,49 24.3,49 24.3,51 71.9,51 58.1,64.8 59.5,66.2 75.7,50 59.5,33.8 58.1,35.2" transform="scale(0.5) translate(0,-25)"  fill="rgb(0,158,227)" stroke="rgb(0,158,227)" stroke-width="0.7"/></svg>'); }
+          display: none; }
       .path-frontpage .block-region-content .block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-description {
         display: none; } }
   .path-frontpage .block-region-content .block-block-content7db64d87-3e22-4fbd-9c11-2b95f5bef695 {
@@ -2492,6 +2507,9 @@ a {
   flex-direction: row;
   background-color: white;
   padding-top: 3rem; }
+  @media (max-width: 810px) {
+    #fotter-bottom {
+      flex-direction: column; } }
   #fotter-bottom .region {
     display: block;
     padding-left: 2rem;
@@ -2506,6 +2524,10 @@ a {
     margin-left: 3rem;
     border: none;
     width: 20%; }
+    @media (max-width: 810px) {
+      #fotter-bottom .region-footer-bottom-left {
+        width: 100%;
+        margin-left: 0rem; } }
     #fotter-bottom .region-footer-bottom-left .view-id-partenaires .view-content {
       display: flex;
       flex-direction: row;
@@ -2523,6 +2545,9 @@ a {
     display: flex;
     flex-direction: column-reverse;
     justify-content: flex-end; }
+    @media (max-width: 810px) {
+      #fotter-bottom .region-footer-bottom-right {
+        width: 100%; } }
     #fotter-bottom .region-footer-bottom-right #block-socialnetwork {
       margin-bottom: 1rem; }
       #fotter-bottom .region-footer-bottom-right #block-socialnetwork .field--name-body p {
@@ -2564,6 +2589,9 @@ a {
         margin-top: 0; }
   #fotter-bottom .region-footer-bottom-middle {
     width: 60%; }
+    @media (max-width: 810px) {
+      #fotter-bottom .region-footer-bottom-middle {
+        width: 100%; } }
     #fotter-bottom .region-footer-bottom-middle .view-id-partenaires .view-content {
       display: flex;
       flex-direction: row;

web/themes/custom/eql/images/pictos/forme_home_2_smartphone.svg

@@ -0,0 +1,122 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   id="svg871"
+   xml:space="preserve"
+   width="1022.6142"
+   height="1695.3451"
+   viewBox="0 0 1022.6142 1695.3451"
+   sodipodi:docname="forme_home_2_smartphone.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/"><metadata
+     id="metadata877"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+     id="defs875"><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath893"><path
+         d="M 0,0 H 1263.5 V -982.96474 H 0 Z"
+         clip-rule="evenodd"
+         id="path891" /></clipPath><linearGradient
+       x1="0"
+       y1="0"
+       x2="393.55112"
+       y2="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1.0000104,0,0,-1.0000104,1187.5312,848.11903)"
+       spreadMethod="pad"
+       id="linearGradient923"><stop
+         style="stop-opacity:1;stop-color:#4ca5e1"
+         offset="0"
+         id="stop919" /><stop
+         style="stop-opacity:1;stop-color:#f25152"
+         offset="1"
+         id="stop921" /></linearGradient><linearGradient
+       x1="0"
+       y1="0"
+       x2="493.23679"
+       y2="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.99998925,0,0,-0.99998925,-103.89338,971.68058)"
+       spreadMethod="pad"
+       id="linearGradient943"><stop
+         style="stop-opacity:1;stop-color:#4ca5e1"
+         offset="0"
+         id="stop939" /><stop
+         style="stop-opacity:1;stop-color:#26448e"
+         offset="1"
+         id="stop941" /></linearGradient><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient943"
+       id="linearGradient1728"
+       x1="-162.00925"
+       y1="623.79181"
+       x2="341.04544"
+       y2="623.79181"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(598.31786,-923.95276)" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient923"
+       id="linearGradient1736"
+       x1="637.69739"
+       y1="456.5993"
+       x2="1028.988"
+       y2="456.5993"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1.6512491,0,0,1.6844893,-1016.5674,-973.84839)" /></defs><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     id="namedview873"
+     showgrid="false"
+     inkscape:zoom="0.32694942"
+     inkscape:cx="483.25518"
+     inkscape:cy="880.8702"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g879"
+     inkscape:document-rotation="0"
+     inkscape:pagecheckerboard="0"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0" /><g
+     id="g879"
+     inkscape:groupmode="layer"
+     inkscape:label="forme_home"
+     transform="matrix(1.3333333,0,0,-1.3333333,-10.719379,1318.7682)"><path
+       style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-variant-east-asian:normal;font-feature-settings:normal;font-variation-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;shape-margin:0;inline-size:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:11.25;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:markers fill stroke;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;stop-color:#000000"
+       d="M 541.20254,-272.12823 1100.1099,-683.33083 688.90735,-1242.2383 129.99993,-831.03569 Z"
+       id="path910" /><path
+       id="path912"
+       style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-variant-east-asian:normal;font-feature-settings:normal;font-variation-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;shape-margin:0;inline-size:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#26448e;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:22.8913;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:markers fill stroke;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;stop-color:#000000"
+       d="m 202.58714,931.90593 -3.63791,-4.9438 -452.32333,-614.8 L 38.448137,97.461606 H 59.16311 L -236.21071,314.77547 205.20048,914.74413 805.16917,473.32975 528.63379,97.461606 h 15.23895 L 822.33257,475.94309 Z" /><rect
+       style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:url(#linearGradient1736);stroke-width:11.25;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke;stop-color:#000000"
+       id="rect1680-2"
+       width="627.54175"
+       height="640.17432"
+       x="45.718075"
+       y="-524.79889"
+       transform="matrix(0.97270863,-0.23202998,-0.22245187,-0.97494367,0,0)" /><rect
+       style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:url(#linearGradient1728);stroke-width:11.25;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke;stop-color:#000000"
+       id="rect1680-2-9"
+       width="400"
+       height="400"
+       x="441.93378"
+       y="-546.06274"
+       transform="matrix(0.92187643,0.38748399,0.38748399,-0.92187643,0,0)" /></g></svg>

web/themes/custom/eql/scss/pages/_home.scss

@@ -4,7 +4,7 @@
         grid-template-areas: "presentation presentation presentation presentation presentation presentation" 
                             "presentation presentation presentation presentation presentation presentation" 
                             "presentation presentation presentation presentation presentation presentation" 
-                            "presentation presentation presentation presentation presentation presentation" 
+                            "presentation presentation presentation presentation presentation presentation"  
                              "actus actus actus actus actus actus"
                              "actus actus actus actus actus actus"
                              "programme programme programme programme programme programme"
@@ -25,6 +25,13 @@
             background-position-y: bottom;
             background-position-x: left;
             background-repeat: no-repeat;
+            @media (max-width: 810px){
+                background: url("../images/pictos/forme_home_2_smartphone.svg");
+                background-size: 100%;
+                background-position-y: bottom;
+                background-position-x: left;
+                background-repeat: no-repeat;
+            }
             .node-type-static{
                 div:first-child{
                     display: grid;
@@ -119,9 +126,15 @@
                             }
                         }
                         @media (max-width: 810px){ 
-                            grid-column: 2 / 5;
+                            grid-column: 2;
                             grid-row:3;
-                            
+                            font-size: 0.6rem;
+                                    
+                        a{
+                            &:after{
+                                display: none;        
+                            }
+                        }
                         }
                     }
                 }
@@ -173,8 +186,13 @@
             }
             @media (max-width: 810px){
                 grid-area: presentation;
-                grid-column: 3 /span 4;
-                grid-row: 3;
+                grid-column: 5;
+                grid-row: 4;
+                .field--type-link { font-size: 0.6rem;
+                    a::after{
+                        display: none;
+                    }
+                }
             }
         }
 
@@ -229,9 +247,10 @@
                         font-weight: 700;
                         color: $blue-light;
                         align-items: center;
+                        font-size: 0.6rem;
                     } 
                     a::after{
-                        content: url('data:image/svg+xml,<svg width="40" height="20" xmlns="http://www.w3.org/2000/svg" version="1.1"><polyline points="71.9,49 24.3,49 24.3,51 71.9,51 58.1,64.8 59.5,66.2 75.7,50 59.5,33.8 58.1,35.2" transform="scale(0.5) translate(0,-25)"  fill="rgb(0,158,227)" stroke="rgb(0,158,227)" stroke-width="0.7"/></svg>');
+                        display: none;
                     }
                 }
                 .field--name-field-description{display: none;}

web/themes/custom/eql/scss/partials/_footer.scss

@@ -9,7 +9,9 @@
     background-color: $white;
     padding-top: 3rem;
 
-
+    @media (max-width: 810px){
+        flex-direction: column;
+    }
 
     .region{
         display: block;
@@ -28,6 +30,10 @@
         margin-left: 3rem;
         border: none;
         width: 20%;
+        @media (max-width: 810px){
+            width: 100%;
+            margin-left: 0rem;
+        }
         .view-id-partenaires{
             .view-content{
               
@@ -55,7 +61,9 @@
         display: flex;
         flex-direction: column-reverse;
         justify-content: flex-end;
-
+        @media (max-width: 810px){
+            width: 100%;
+        }
         #block-socialnetwork {
             margin-bottom: 1rem;
 
@@ -117,7 +125,9 @@
 
     .region-footer-bottom-middle{
         width: 60%;
-    
+        @media (max-width: 810px){
+            width: 100%;
+        }
         .view-id-partenaires{
             .view-content{
                 display: flex;