From 25e22aca88dd7d2bdd0fd4cf67b01e289bc35a61 Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Tue, 2 Jul 2024 12:41:14 +0200
Subject: [PATCH] home parargraphe 7

---
 .../dist/assets/css/bundle.css                | 57 ++++++++++++++++-
 .../dist/assets/img/pillier-1.svg             | 33 ++++++++++
 .../dist/assets/img/pillier-2.svg             | 33 ++++++++++
 .../dist/assets/img/pillier-3.svg             | 33 ++++++++++
 .../src/assets/img/pillier-1.svg              | 33 ++++++++++
 .../src/assets/img/pillier-2.svg              | 33 ++++++++++
 .../src/assets/img/pillier-3.svg              | 33 ++++++++++
 .../src/assets/scss/pages/home.scss           | 62 ++++++++++++++++++-
 8 files changed, 315 insertions(+), 2 deletions(-)
 create mode 100644 web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-1.svg
 create mode 100644 web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-2.svg
 create mode 100644 web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-3.svg
 create mode 100644 web/themes/custom/quartiers_de_demain/src/assets/img/pillier-1.svg
 create mode 100644 web/themes/custom/quartiers_de_demain/src/assets/img/pillier-2.svg
 create mode 100644 web/themes/custom/quartiers_de_demain/src/assets/img/pillier-3.svg

diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
index 6d589de..9060a43 100644
--- a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
@@ -666,7 +666,7 @@ footer span.totop #toTop .arrow-up::before {
 #home article.node-type-static .field_body > p:nth-child(1) {
   margin-bottom: 0;
   flex: 1 100%;
-  font-size: 2.5rem;
+  font-size: 1.7rem;
 }
 #home article.node-type-static .field_body > p:nth-child(2),
 #home article.node-type-static .field_body p:nth-child(3) {
@@ -921,4 +921,59 @@ footer span.totop #toTop .arrow-up::before {
 #home article.node-type-static #paragraph-id--6 .field_field_texte .colone-picto > p:nth-of-type(3) img {
   max-width: 100%;
   height: auto;
+}
+#home article.node-type-static #paragraph-id--7 {
+  background-color: #0833c2;
+  display: flex;
+  flex-direction: column;
+  margin: auto;
+  align-items: center;
+  padding-bottom: 2rem;
+  color: white;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_title {
+  width: fit-content;
+  margin: auto;
+  width: 70%;
+  text-transform: lowercase;
+  font-size: 2.5rem;
+  font-weight: 800;
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+  text-align: center;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte {
+  width: 80%;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto h5 {
+  font-size: 5rem;
+  font-weight: 800;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p {
+  width: 30%;
+  display: flex;
+  flex-direction: column;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:not(:last-of-type) {
+  padding-right: 2rem;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(1)::before {
+  content: url("../img/pillier-1.svg");
+  padding-bottom: 1rem;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(2)::after {
+  content: url("../img/pillier-2.svg");
+  padding-bottom: 1rem;
+}
+#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(3)::before {
+  content: url("../img/pillier-3.svg");
+  padding-bottom: 1rem;
+}
+#home article.node-type-static #paragraph-id--9 {
+  display: none;
 }
\ No newline at end of file
diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-1.svg b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-1.svg
new file mode 100644
index 0000000..76db28e
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-1.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79999"
+   height="362.80029"
+   viewBox="0 0 362.79999 362.80029"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath366">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-579.53411,-2913.3184)"
+         id="path366" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-466.57886,-7752.7755)">
+    <path
+       id="path365"
+       d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,772.71213,8115.5755)"
+       clip-path="url(#clipPath366)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-2.svg b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-2.svg
new file mode 100644
index 0000000..2e86520
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-2.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79993"
+   height="362.7998"
+   viewBox="0 0 362.79993 362.7998"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath368">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-845.29322,-2892.7677)"
+         id="path368" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-1070.391,-8142.9767)">
+    <path
+       id="path367"
+       d="M 0,0 C 0,-126.805 102.795,-229.6 229.6,-229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,1127.0576,8142.9765)"
+       clip-path="url(#clipPath368)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-3.svg b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-3.svg
new file mode 100644
index 0000000..f6e4df0
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/img/pillier-3.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79993"
+   height="362.80029"
+   viewBox="0 0 362.79993 362.80029"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath370">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1213.1563,-2955.8185)"
+         id="path370" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-1617.5417,-7752.7755)">
+    <path
+       id="path369"
+       d="M 0,0 C 126.805,0 229.6,102.795 229.6,229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,1617.5417,8058.9088)"
+       clip-path="url(#clipPath370)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-1.svg b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-1.svg
new file mode 100644
index 0000000..76db28e
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-1.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79999"
+   height="362.80029"
+   viewBox="0 0 362.79999 362.80029"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath366">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-579.53411,-2913.3184)"
+         id="path366" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-466.57886,-7752.7755)">
+    <path
+       id="path365"
+       d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,772.71213,8115.5755)"
+       clip-path="url(#clipPath366)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-2.svg b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-2.svg
new file mode 100644
index 0000000..2e86520
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-2.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79993"
+   height="362.7998"
+   viewBox="0 0 362.79993 362.7998"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath368">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-845.29322,-2892.7677)"
+         id="path368" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-1070.391,-8142.9767)">
+    <path
+       id="path367"
+       d="M 0,0 C 0,-126.805 102.795,-229.6 229.6,-229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,1127.0576,8142.9765)"
+       clip-path="url(#clipPath368)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-3.svg b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-3.svg
new file mode 100644
index 0000000..f6e4df0
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/img/pillier-3.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="362.79993"
+   height="362.80029"
+   viewBox="0 0 362.79993 362.80029"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath370">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1213.1563,-2955.8185)"
+         id="path370" />
+    </clipPath>
+  </defs>
+  <g
+     id="g1"
+     transform="translate(-1617.5417,-7752.7755)">
+    <path
+       id="path369"
+       d="M 0,0 C 126.805,0 229.6,102.795 229.6,229.6"
+       style="fill:none;stroke:#ffffff;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       transform="matrix(1.3333333,0,0,-1.3333333,1617.5417,8058.9088)"
+       clip-path="url(#clipPath370)" />
+  </g>
+</svg>
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss
index bb2097a..e6a527c 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss
@@ -15,7 +15,7 @@
                 // width: 100%;
                 margin-bottom: 0;
                 flex: 1 100%;
-                font-size: 2.5rem;
+                font-size: 1.7rem;
             }
             > p:nth-child(2),
             p:nth-child(3){
@@ -293,6 +293,66 @@
                 }
             }
         }
+        #paragraph-id--7{
+            background-color: #0833c2ff;
+            display: flex;
+            flex-direction: column;
+            margin: auto;
+            align-items: center;
+            // width: 70%;
+            padding-bottom: 2rem;
+            color: white;
+            .field_field_title{
+                width: fit-content;
+                margin: auto;
+                width: 70%;
+                text-transform: lowercase;
+
+                font-size: 2.5rem;
+                font-weight: 800;
+                padding-top: 3rem;
+                padding-bottom: 3rem;
+                text-align: center;
+            }
+            .field_field_texte{
+                width: 80%;
+                .colone-picto{
+                    display: flex;
+                    flex-direction:row ;
+                    justify-content: center;
+                    h5{
+                        font-size: 5rem;
+                        font-weight: 800;
+                    }
+                    p{
+                        width: 30%;
+                        display: flex;
+                        flex-direction:column ;
+                        &:not(:last-of-type){
+                            padding-right: 2rem;
+                        }
+                    
+                        &:nth-of-type(1)::before{
+                            content: url("../img/pillier-1.svg");
+                            padding-bottom: 1rem;
+                           
+                        }
+                        &:nth-of-type(2)::after{
+                            content: url("../img/pillier-2.svg");
+                            padding-bottom: 1rem;
+                           
+                        }
+                        &:nth-of-type(3)::before{
+                            content: url("../img/pillier-3.svg");
+                            padding-bottom: 1rem;
+                            
+                        }
+                    }
+
+                }
+            }
+        }
+        #paragraph-id--9{display: none;}
     }