taille point interrogation faq

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

@@ -99,7 +99,16 @@
   top: 0%;
   left: 0%;
   width: 100%;
-  overflow: hidden; }
+  overflow: hidden;
+  display: flex;
+  flex-flow: row wrap; }
+  .layout-container header {
+    flex: 0 0 100%; }
+  .layout-container main {
+    position: relative;
+    top: -7rem; }
+  .layout-container footer {
+    flex: 0 0 100%; }
 
 .layout-content {
   padding-top: 7rem;
@@ -166,149 +175,152 @@ a {
 /*
 @import "pages/partials/header_footer";
 @import "pages/home";*/
-.path-node.page-node-type-static .layout-container {
+.path-node.page-node-type-static .layout-container .layout-content .layout__region--top {
+  padding-bottom: 3rem;
+  height: 30vh; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle {
+    width: fit-content;
+    margin-left: 13%;
+    margin-top: 15vh; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle .field--name-title {
+      font-family: 'Source Code Pro';
+      font-size: 2rem;
+      font-weight: 800;
+      text-transform: uppercase; }
+
+.path-node.page-node-type-static .layout-container .layout-content .layout__region--first {
+  position: relative; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--first .block-region-first {
+    display: flex;
+    justify-content: end;
+    position: sticky;
+    top: 7rem; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes {
+      display: flex;
+      width: 50%;
+      background-color: white;
+      padding-right: 2rem; }
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre {
+        display: flex;
+        font-size: 1rem;
+        font-weight: 1000;
+        color: #09398b;
+        border-bottom: 1px solid #009ee3;
+        padding-bottom: 0.5rem;
+        padding-right: 1rem; }
+        .path-node.page-node-type-static .layout-container .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre:hover {
+          text-decoration: underline; }
+
+.path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes {
+  background-color: white; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes .field--name-field-titre {
+    font-size: 1.5rem;
+    font-weight: 1000;
+    font-family: 'Source Code Pro';
+    color: #09398b;
+    text-transform: uppercase; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes h4 {
+    text-transform: none !important; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes h4 img {
+      width: 100%;
+      height: auto; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes .field--type-text-long {
+    padding-right: 2rem; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--second .block-entity-fieldnodefield-textes p {
+    margin-top: 0; }
+
+.path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third {
   display: flex;
   flex-direction: column;
-  flex-flow: row wrap; }
+  width: 70%; }
-  .path-node.page-node-type-static .layout-container header {
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-fichiers {
-    flex: 0 0 100%; }
+    height: fit-content;
-  .path-node.page-node-type-static .layout-container main {
+    border: 2px solid #009ee3;
-    flex: 0 0 100%; }
+    background-color: white; }
-    .path-node.page-node-type-static .layout-container main .layout-content .layout__region--top .block-entity-fieldnodetitle {
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .field--name-field-fichiers {
-      width: fit-content;
+    min-height: 4rem;
-      margin-left: 13%;
+    background: white;
-      margin-top: 15vh; }
+    color: #009ee3;
-    .path-node.page-node-type-static .layout-container main .layout-content .layout__region--first {
+    padding-left: 1rem;
-      position: relative; }
+    padding-top: 1rem;
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--first .block-region-first {
+    margin-bottom: 1rem; }
-        display: flex;
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .field--name-field-fichiers span:nth-of-type(2) {
-        justify-content: end;
+      display: none; }
-        position: sticky;
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf {
-        top: 7rem; }
+      height: inherit;
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes {
+      margin: auto; }
-          display: flex;
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf ::before {
-          width: 50%;
+        content: url("../images/pictos/noun_Download_file_307900.svg");
-          background-color: white;
+        min-width: 50px;
-          padding-right: 2rem; }
+        height: auto;
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre {
+        padding-right: 1rem; }
-            display: flex;
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf a {
-            font-size: 1rem;
+        hyphens: auto;
-            font-weight: 1000;
-            color: #09398b;
-            border-bottom: 1px solid #009ee3;
-            padding-bottom: 0.5rem;
-            padding-right: 1rem; }
-            .path-node.page-node-type-static .layout-container main .layout-content .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre:hover {
-              text-decoration: underline; }
-    .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes {
-      background-color: white; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes .field--name-field-titre {
-        font-size: 1.5rem;
-        font-weight: 1000;
-        font-family: 'Source Code Pro';
-        color: #09398b;
-        text-transform: uppercase; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes h4 {
-        text-transform: none !important; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes h4 img {
-          width: 100%;
-          height: auto; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes .field--type-text-long {
-        padding-right: 2rem; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--second .block-entity-fieldnodefield-textes p {
-        margin-top: 0; }
-    .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third {
-      display: flex;
-      flex-direction: column;
-      width: 70%; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-fichiers {
-        height: fit-content;
-        border: 2px solid #009ee3;
-        background-color: white; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .field--name-field-fichiers {
-        min-height: 4rem;
-        background: white;
-        color: #009ee3;
-        padding-left: 1rem;
-        padding-top: 1rem;
-        margin-bottom: 1rem; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .field--name-field-fichiers span:nth-of-type(2) {
-          display: none; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf {
-          height: inherit;
-          margin: auto; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf ::before {
-            content: url("../images/pictos/noun_Download_file_307900.svg");
-            min-width: 50px;
-            height: auto;
-            padding-right: 1rem; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf a {
-            hyphens: auto;
-            display: inline-flex;
-            align-items: center;
-            color: #009ee3;
-            font-weight: 800; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens .field__item {
-        margin: auto;
-        height: fit-content;
-        border: 2px solid #009ee3;
-        min-height: 4rem;
-        background: white;
-        color: #009ee3;
-        padding-left: 1rem;
-        padding-top: 1rem;
-        margin-bottom: 1rem; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a {
         display: inline-flex;
         align-items: center;
         color: #009ee3;
         font-weight: 800; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a::before {
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens .field__item {
-          content: url("../images/pictos/noun_External Link_674151.svg");
+    margin: auto;
-          min-width: 50px;
+    height: fit-content;
-          height: auto;
+    border: 2px solid #009ee3;
-          padding-right: 1rem; }
+    min-height: 4rem;
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a svg.ext {
+    background: white;
+    color: #009ee3;
+    padding-left: 1rem;
+    padding-top: 1rem;
+    margin-bottom: 1rem; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a {
+    display: inline-flex;
+    align-items: center;
+    color: #009ee3;
+    font-weight: 800; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a::before {
+      content: url("../images/pictos/noun_External Link_674151.svg");
+      min-width: 50px;
+      height: auto;
+      padding-right: 1rem; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a svg.ext {
+      display: none; }
+  .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress {
+    margin-top: 3rem; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress h2 {
+      font-size: 0.8rem;
+      color: black;
+      font-weight: 900; }
+    .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource {
+      display: flex;
+      flex-direction: column;
+      border: 2px solid #009ee3;
+      padding: 1rem;
+      height: fit-content;
+      margin-bottom: 1rem;
+      background-color: white; }
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type {
+        border-top: 1px solid #009ee3;
+        padding-top: 1rem; }
+        .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type::after {
+          content: url("../images/pictos/noun_Arrow_3771902.svg");
+          align-self: end; }
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-title a {
+        color: black;
+        font-size: 1.4rem;
+        font-weight: 600; }
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- {
+        font-weight: 800; }
+        .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- p {
+          margin: 0; }
+        .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- .field__label {
           display: none; }
-      .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress {
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition p {
-        margin-top: 3rem; }
+        margin: 0; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress h2 {
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition .field__label {
-          font-size: 0.8rem;
+        display: none; }
-          color: black;
+      .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images {
-          font-weight: 900; }
+        width: 50%; }
-        .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource {
+        .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images img {
-          display: flex;
+          width: 100%;
-          flex-direction: column;
+          height: auto; }
-          border: 2px solid #009ee3;
-          padding: 1rem;
-          height: fit-content;
-          margin-bottom: 1rem;
-          background-color: white; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type {
-            border-top: 1px solid #009ee3;
-            padding-top: 1rem; }
-            .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type::after {
-              content: url("../images/pictos/noun_Arrow_3771902.svg");
-              align-self: end; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-title a {
-            color: black;
-            font-size: 1.4rem;
-            font-weight: 600; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- {
-            font-weight: 800; }
-            .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- p {
-              margin: 0; }
-            .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- .field__label {
-              display: none; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition p {
-            margin: 0; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition .field__label {
-            display: none; }
-          .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images {
-            width: 50%; }
-            .path-node.page-node-type-static .layout-container main .layout-content .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images img {
-              width: 100%;
-              height: auto; }
 
 .path-frontpage .block-region-content {
   display: grid;
@@ -722,24 +734,17 @@ a {
     text-transform: uppercase; }
 
 .node-id-3 {
-  background: url("../images/pictos/carre_site.mp4");
+  background: url("../images/pictos/carre-contour-bleu_programme.svg");
   background-repeat: no-repeat;
   background-position-y: 7rem;
   max-width: 100vw;
   background-size: contain; }
-  .node-id-3 .layout__region--top {
+  .node-id-3 .layout__region--top .block-region-top .block-entity-fieldnodefield-images {
-    padding-bottom: 3rem;
+    display: none;
-    height: 30vh; }
+    height: inherit; }
-    .node-id-3 .layout__region--top .block-region-top .block-entity-fieldnodefield-images {
+  .node-id-3 .layout__region--top .block-region-top .block-entity-fieldnodetitle .field--name-title {
-      display: none;
+    color: #009ee3;
-      height: inherit; }
+    background-color: white; }
-    .node-id-3 .layout__region--top .block-region-top .block-entity-fieldnodetitle .field--name-title {
-      font-family: 'Source Code Pro';
-      font-size: 2rem;
-      font-weight: 800;
-      color: #009ee3;
-      background-color: white;
-      text-transform: uppercase; }
   .node-id-3 .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens .field__item {
     background: #009ee3 !important;
     color: white !important; }
@@ -924,6 +929,11 @@ a {
     grid-column: 2 / span 3; }
   .path-faq #block-contenudelapageprincipale .block-region-content .block-block-content.block-block-content10aba627-5586-4529-b44e-c0b4551a4398 {
     grid-column: 5;
+    display: flex;
+    flex-direction: column;
+    max-width: fit-content;
+    margin-left: 2rem;
+    padding: 1rem;
     background-color: #009ee3; }
     .path-faq #block-contenudelapageprincipale .block-region-content .block-block-content.block-block-content10aba627-5586-4529-b44e-c0b4551a4398 .field--name-field-lien {
       text-align: center; }
@@ -937,6 +947,8 @@ a {
         color: #09398b;
         text-transform: uppercase; }
     .path-faq #block-contenudelapageprincipale .block-region-content .block-block-content.block-block-content10aba627-5586-4529-b44e-c0b4551a4398 .field--name-field-description p {
+      display: flex;
+      flex-direction: column;
       margin-top: 0;
       margin-left: 1.5rem;
       margin-right: 1.5rem;
@@ -946,6 +958,8 @@ a {
         color: white;
         font-size: 1.3rem; }
       .path-faq #block-contenudelapageprincipale .block-region-content .block-block-content.block-block-content10aba627-5586-4529-b44e-c0b4551a4398 .field--name-field-description p:after {
+        margin-left: auto;
+        padding-top: 1rem;
         display: block;
         content: url("../images/pictos/noun_Arrow_3771902.svg"); }
   .path-faq #block-contenudelapageprincipale .block-region-content .block-views-blockfaq-block-1 {
@@ -1029,19 +1043,37 @@ a {
       background-color: #009ee3;
       text-transform: uppercase; }
 
+.page-node-type-ressource .block-contenudelapageprincipale {
+  display: flex; }
+  .page-node-type-ressource .block-contenudelapageprincipale span {
+    flex: 0 1 100%; }
+  .page-node-type-ressource .block-contenudelapageprincipale .node-type-ressource {
+    flex: 0 1 100%; }
+
 .node-type-offre_de_service {
   display: flex; }
   .node-type-offre_de_service .field--type-text-with-summary {
     flex: 0 1 50%; }
 
+.node-id-40 {
+  background: url("../images/pictos/carre-contour-bleu_programme.svg");
+  background-repeat: no-repeat;
+  background-position-y: 7rem;
+  max-width: 100vw;
+  background-size: contain; }
+  .node-id-40 .layout__region--top .block-region-top .block-entity-fieldnodefield-images {
+    display: none;
+    height: inherit; }
+  .node-id-40 .layout__region--top .block-region-top .block-entity-fieldnodetitle .field--name-title {
+    color: #009ee3; }
+
 /*partials*/
 .layout-container {
   position: relative; }
-
+  .layout-container header {
-header {
+    width: 100%;
-  width: 100%;
+    position: fixed;
-  position: fixed;
+    z-index: 99; }
-  z-index: 99; }
 
 #header-top {
   height: 7rem;

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

@@ -8,8 +8,8 @@
    id="svg8"
    sodipodi:docname="noun_Arrow_3771902.svg"
    inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
-   width="52"
+   width="45"
-   height="33"
+   height="auto"
    inkscape:export-filename="/home/ouidade/Sites/EQL/docker-eql/src_d9/web/themes/custom/eql/images/pictos/noun_Arrow_3771902.png"
    inkscape:export-xdpi="300"
    inkscape:export-ydpi="300"

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

@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
-   width="30mm"
+   width="80px"
-   height="30mm"
+   height="80px"
    viewBox="0 0 126.18079 126.18081"
    version="1.1"
    id="svg868"

web/themes/custom/eql/scripts/main.js

@@ -40,22 +40,39 @@ function toggleFaq(event) {
 }
 
 
-// function toggleFaq(event) {
-//   console.log(event);
-//   for (let i = 0; i < answers.length; i++) {
-//   const answer = answers[i]
-//   answer.classList.toggle('opened');}
-
-// }
 
 // /////////////////
+//// ancre dans texte
+document.querySelector('.paragraph--view-mode--textes-toc').click( function() {
+  var page = this.attr('href'); 
+  var speed = 750; // gérer la vitesse de défliement
+      
+      // Ici on retranche la hauteur du bandeau (201px dans ta feuille de styles)
+document.querySelector('html, body').animate( { scrollTop: page.offset().top - 201 }, speed );
+  return false;
+});
 
-// document.addEventListener('click', function(e) {
+/// sticky header on scroll
-//   if (e.target.classList.contains('rect_white_left') {
+
-//     e.target.parentNode.nextElementSibling...
+// // When the user scrolls the page, execute myFunction
+// window.onscroll = function() {stickyHeader()};
+// console.log(Event);
+
+// // Get the header
+// var header = document.getElementById("header-top");
+
+// // Get the offset position of the navbar
+// var sticky = header.offsetTop;
+
+// // Add the sticky class to the header when you reach its scroll position. Remove "sticky" when you leave the scroll position
+// function stickyHeader() {
+//   if (window.pageYOffset > sticky) {
+//     header.classList.add("sticky");
+//   } else {
+//     header.classList.remove("sticky");
 //   }
-// });
+// } 
- 
+
 ///////////////////
 
 // document.addEventListener('click', function(e) {

web/themes/custom/eql/scss/global/_layout.scss

@@ -7,6 +7,19 @@
     left: 0%;
     width: 100%;
     overflow: hidden;
+    display: flex;
+    flex-flow: row wrap;
+    ;
+    header{
+        flex: 0 0 100%;
+    }
+    main{
+        position: relative;
+        top: -7rem;
+    }
+    footer{
+        flex: 0 0 100%;
+    }
 }
 .layout-content{
     padding-top: 7rem;

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

@@ -1,32 +1,24 @@
 .node-id-3{
 
-    background: url('../images/pictos/carre_site.mp4');
+    background: url('../images/pictos/carre-contour-bleu_programme.svg');
     background-repeat: no-repeat;
     background-position-y: 7rem;
     max-width: 100vw;
     background-size: contain;
 
     .layout__region--top{               //bandeau titre page static
-        padding-bottom: 3rem;
-        height: 30vh;
         .block-region-top{
             .block-entity-fieldnodefield-images{
                 display: none;
                 height: inherit;
-        
             }
             .block-entity-fieldnodetitle{
                 .field--name-title{
-                    font-family: 'Source Code Pro';
-                    font-size: 2rem;
-                    font-weight: 800;
                     color: $blue-light;
                     background-color: $white;
-                    text-transform: uppercase;
                 }
             }
         }
-    
     }
     .layout__region--third{     // colone de droite fichiers et ressources liées
         .block-region-third{

web/themes/custom/eql/scss/pages/_annuaire-de-ressources.scss

@@ -0,0 +1,27 @@
+.node-id-40{
+
+    background: url('../images/pictos/carre-contour-bleu_programme.svg');
+    background-repeat: no-repeat;
+    background-position-y: 7rem;
+    max-width: 100vw;
+    background-size: contain;
+    .layout__region--top{               //bandeau titre page static
+
+        .block-region-top{
+            .block-entity-fieldnodefield-images{
+                display: none;
+                height: inherit;
+        
+            }
+            .block-entity-fieldnodetitle{
+                .field--name-title{
+
+                    color: $blue-light;
+
+                }
+            }
+        }
+    
+    }
+
+}

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

@@ -26,14 +26,17 @@
             // bloc bleu déposer une question
             .block-block-content.block-block-content10aba627-5586-4529-b44e-c0b4551a4398{
                 grid-column: 5;
+                display: flex;
+                flex-direction: column;
+                max-width: fit-content;
+                margin-left: 2rem;
+                padding: 1rem;
                 background-color: $blue-light;
                 .field--name-field-lien{
                     &:before{
                         margin-top: 1rem;
                         display: block;
-                        content: url("../images/pictos/picto_faq.svg");
+                        content: url("../images/pictos/picto_faq.svg");                        
-                        
-                        
                     }
                     text-align: center;
                     a{
@@ -45,6 +48,8 @@
                 }
                 .field--name-field-description{
                     p{
+                        display: flex;
+                        flex-direction: column;
                         margin-top: 0;
                         margin-left: 1.5rem;
                         margin-right: 1.5rem;
@@ -55,9 +60,11 @@
                             font-size: 1.3rem;
                         } 
                         &:after{
+                            margin-left: auto;
+                            padding-top: 1rem;
                             display: block;
                             content:url("../images/pictos/noun_Arrow_3771902.svg")
-    
+                            
                         }   
                     }
                 }

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

@@ -0,0 +1,13 @@
+
+.page-node-type-ressource{
+
+    .block-contenudelapageprincipale{
+        display: flex;
+        span{
+            flex: 0 1 100%;
+        }
+        .node-type-ressource{
+            flex:0 1 100%;
+        }  
+    }
+}

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

@@ -1,22 +1,29 @@
 .path-node.page-node-type-static{
     .layout-container{
-        display: flex;
+        // display: flex;
-        flex-direction: column;
+        // flex-direction: column;
-        flex-flow: row wrap;
+        // flex-flow: row wrap;
-        header{
+        // header{
-            flex: 0 0 100%;
+        //     flex: 0 0 100%;
-        }
+        // }
-        main{
+        // main{
-            flex: 0 0 100%;
+        //     flex: 0 0 100%;
             .layout-content{
                 // padding-top: 0;
                 .layout__region--top{               //bandeau titre page static
 
-
+                    padding-bottom: 3rem;
+                    height: 30vh;
                     .block-entity-fieldnodetitle{
                         width: fit-content;
                         margin-left: 13%;
                         margin-top: 15vh;
+                        .field--name-title{
+                            font-family: 'Source Code Pro';
+                            font-size: 2rem;
+                            font-weight: 800;
+                            text-transform: uppercase;
+                        }    
                     }
                     // .block-entity-fieldnodefield-images{
                     //     display: none;
@@ -228,7 +235,7 @@
             }
 
             
-        }
+        // }
 
     }
 }

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

@@ -1,12 +1,19 @@
 
 .layout-container{
     position: relative;
-}
+    header{                       
-header{                       
+        // display: block;
-    // display: block;
+        width: 100%;
-    width: 100%;
+        position: fixed;
-    position: fixed;
+        z-index: 99;
-    z-index: 99;
+        // position: -webkit-sticky;
+        // position: sticky;
+        // top: 0;
+        // .sticky{
+        //         position: fixed;
+        // }
+
+    }
 
     
 }

web/themes/custom/eql/scss/styles.scss

@@ -32,6 +32,8 @@
 @import "pages/_toutesressources";
 @import "pages/_ressource";
 @import "pages/_offreDeService";
+@import "pages/_annuaire-de-ressources";
+
 
 /*partials*/
 @import "partials/_header";

web/themes/custom/eql/templates/field.html.twig

@@ -59,20 +59,8 @@
     'first_part_home',
   ]
 %}
-{# {%
+
-  set id_titre =  [
+
-  'id-' ~ paragraph|clean_id,
-  'block-' ~ plugin_id|clean_class,
-  key.value,
-   'id-' ~ counter,
-  ]
-%} #}
-{%
-  set id_hook = [
-    'hook-id-' ~ paragraph.id()|clean_id,
-    'paragraph-id--'  ~ paragraph.id()|clean_id,
-  ]
-%}
 
 
   {% if label_hidden %}
@@ -84,16 +72,10 @@
       </div>
     {% else %}
       {% for item in items %}
-        {# {% for i in 0..10 %} #}
 
-      {# <span> {{index}}</span> #}
-        {# <span id="{{item[key].value }}"></span> #}
-         {# <span>{{counter}}</span> #}
-          {# <div {{ attributes.addClass(classes, 'field__item') }}>{{ item.content }}</div> #}
 
-        <div {{ attributes.addClass(classes, 'field__item').setAttribute('id', id_hook) }}>{{ item.content }}</div>
+        <div {{ attributes.addClass(classes, 'field__item') }}>{{ item.content }}</div>
-           
+
-        {# {% endfor %} #}
       {% endfor %}
     {% endif %}
   {% else %}
@@ -113,6 +95,3 @@
 
 
 
-{# {% for key, item in items %}
-      <span id="{{element['#items'][key].value|replace({' ':''}) }}"></span>
-      <div{{ item.attributes }}>{{ item.content }}</div> #}