@@ -320,7 +365,7 @@
id="g1522"
transform="translate(747.5991,1522.7208)">
@@ -328,7 +373,7 @@
id="g1526"
transform="translate(746.9782,1556.9387)">
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/img/formes-animees.svg b/web/themes/custom/quartiers_de_demain/src/assets/img/formes-animees.svg
new file mode 100644
index 0000000..a4133a8
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/img/formes-animees.svg
@@ -0,0 +1,102 @@
+
+
+
+
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/img/logo-QDD-v2.svg b/web/themes/custom/quartiers_de_demain/src/assets/img/logo-QDD-v2.svg
new file mode 100644
index 0000000..cf98e2d
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/img/logo-QDD-v2.svg
@@ -0,0 +1,399 @@
+
+
+
+
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js b/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
index ad561e2..9448c99 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
+++ b/web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
@@ -157,7 +157,7 @@
function handleScroll() {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop;
- const isMobile = window.innerWidth < 810;
+ const isMobile = window.innerWidth < 811;
if (scrollTop > threshold && !isHidden) {
if (isMobile) {
@@ -179,7 +179,7 @@
function handleTouchAndMouseEnter() {
if (isHidden) {
- if (window.innerWidth < 810) {
+ if (window.innerWidth < 811) {
slideDown();
} else {
slideIn();
@@ -189,7 +189,7 @@
function handleTouchAndMouseLeave() {
if (lastScrollTop > threshold && !isHidden) {
- if (window.innerWidth < 810) {
+ if (window.innerWidth < 811) {
slideUp();
} else {
slideOut();
@@ -210,13 +210,13 @@
// Initial check to see if we're at the top of the page
if (window.pageYOffset <= threshold) {
- if (window.innerWidth < 810) {
+ if (window.innerWidth < 811) {
slideDown();
} else {
slideIn();
}
} else {
- if (window.innerWidth < 810) {
+ if (window.innerWidth < 811) {
slideUp();
} else {
slideIn();
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
index 8fc2168..93f7c55 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
@@ -42,6 +42,11 @@ $width-menu-slidedown : 550px;
}
home{
padding-top: 0;
+
+
+ @media(max-width: 810px){
+ padding-top: 320px;
+ }
}
}
}
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
index cae83b1..30438f7 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/consultation.scss
@@ -21,8 +21,6 @@
font-size: 2rem;
}
-
-
}
.node-type-static{
&::before{
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 9aac37e..6e9bc58 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
@@ -1,6 +1,23 @@
#home{
+
.config_pages--type--diaporama-home{
+ position: relative;
+ &::after{
+ content: url('../img/formes-animees-1.svg');
+ display: block;
+ width: 50%;
+ position: absolute;
+ z-index: 5;
+ right: 11rem;
+ bottom: -6rem;
+ @media(max-width: 810px){
+ bottom: -5rem;
+ }
+ @media(max-width: 810px){
+ bottom: -5rem;
+ }
+ }
.field_field_images{
img{
width: 100%;
@@ -18,7 +35,8 @@
padding-bottom: 2rem;
}
article.node-type-static{
- padding-top: 4rem;
+ padding-top: 6rem;
+
.field_title{
display: none;
}
@@ -28,6 +46,21 @@
display: flex;
flex-direction: row;
flex-wrap: wrap ;
+ position: relative;
+ &::after{
+ content: url('../img/formes-animees-2.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ left: 1rem;
+ bottom: 0;
+ // @media(max-width: 810px){
+ // bottom: -5rem;
+ // }
+ // @media(max-width: 810px){
+ // bottom: -5rem;
+ // }
+ }
@media(max-width: 1090px){
flex-direction: column;
}
@@ -70,6 +103,16 @@
}
#paragraph-id--1{ ///// Les enjeux
background-color: #edefe8;
+ position: relative;
+ padding-bottom: 6rem;
+ &::after{
+ content: url('../img/formes-animees-3.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ right: 15%;
+ bottom: 45%;
+ }
.field_field_title{
font-family: 'gilroy-bold';
}
@@ -278,12 +321,29 @@
margin: auto;
align-items: center;
padding-bottom: 2rem;
+ position: relative;
+ &::before{
+ content: url('../img/formes-animees-4.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ left: 10%;
+ top: -6rem;
+ }
+ &::after{
+ content: url('../img/formes-animees-5.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ right: 15%;
+ top: 3rem;
+ }
@media(max-width: 500px){
width: 90%;
text-align: center;
}
.field_field_title{
- padding-top: 4rem;
+ padding-top: 3rem;
padding-bottom: 2rem;
@media(max-width: 500px){
padding-top: 0;
@@ -378,6 +438,8 @@
h5:nth-of-type(2){
grid-row: 2;
grid-column: 3;
+ position: relative;
+ top: -70px;
@media(max-width: 700px){
grid-row: 4;
grid-column: 2;
@@ -421,6 +483,8 @@
grid-column: inherit;
padding: 1rem;
padding-left: 0;
+ position: relative;
+ top: -70px;
@media(max-width: 700px){
grid-row: 4;
grid-column: 1 /span 2 ;
@@ -486,44 +550,4 @@
}
}
- // .config_pages--type--deroulement{
- // .field_field_phase{
- // .__timeline{
- // display: flex;
- // flex-direction: row;
- // .paragraph--type--phase-deroulement{
- // width: 30%;
- // display: grid;
- // grid-template-columns: auto auto;
- // grid-template-rows: auto auto auto;
- // .field_field_date_de_jour{
- // grid-row: 1 /span 3;
- // grid-column: 1;
- // }
- // .field_field_date_de_moi{
- // grid-row: 2 /span 3;
- // grid-column: 1;
-
- // }
- // .field_field_date_de_annee{
- // grid-row: 3;
- // grid-column: 1;
- // }
- // .field_field_titre{
- // grid-column: 2;
- // grid-row: 1;
- // }
- // .field_field_description{
- // grid-row: 2 /span 3;
- // grid-column: 2;
- // }
- // }
- // #paragraph-id--16{
-
- // }
- // }
-
- // }
- // }
-
}
\ No newline at end of file
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/formes-animees.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/formes-animees.scss
new file mode 100644
index 0000000..c9b4c5d
--- /dev/null
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/formes-animees.scss
@@ -0,0 +1,29 @@
+// #home{
+// #background-animated {
+// position: absolute;
+// top: 0;
+// left: 0;
+// width: 100%;
+// height: 100%;
+// pointer-events: none; /* Permet de cliquer à travers l'élément */
+// z-index: 5; /* S'assure que l'élément soit au-dessus */
+// @media(max-width: 810px){
+// top: 1820px;
+// }
+// svg{
+// max-width: 100%;
+// position: relative;
+// top: -1500px;
+// }
+
+// }
+
+// .layout-content {
+// position: relative;
+// z-index: 2; /* S'assure que le contenu soit au-dessus des animations */
+// }
+
+// .layout-container.home {
+// position: relative;
+// }
+// }
\ No newline at end of file
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss
index c61627a..492dec0 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss
@@ -12,7 +12,24 @@
background-position-x: -20%;
@media(max-width:1090px){
cursor:grab;
- }
+ }
+ position: relative;
+ &::before{
+ content: url('../img/formes-animees-6.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ right: 20%;
+ top: 2rem;
+ }
+ &::after{
+ content: url('../img/formes-animees-7.svg');
+ display: block;
+ position: absolute;
+ z-index: 5;
+ right: 26%;
+ bottom: -9rem;
+ }
h2{
width: fit-content;
margin: auto;
@@ -26,7 +43,7 @@
white-space: nowrap;
overflow: hidden;
padding-top: 5rem;
- padding-bottom: 4rem;
+ padding-bottom: 8rem;
@media(max-width:1090px){
padding-top: 18rem;
overflow: scroll;
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/quartiers_de_demain.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/quartiers_de_demain.scss
index 83bc256..fb76810 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/quartiers_de_demain.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/quartiers_de_demain.scss
@@ -30,7 +30,7 @@
@import "partials/timeline";
@import "partials/actu-caroussel-home";
@import "partials/animation-logo-header";
-
+@import "partials/formes-animees";
// @import "partials/slick_custom";
diff --git a/web/themes/custom/quartiers_de_demain/templates/field--block-content--logo-link.html.twig b/web/themes/custom/quartiers_de_demain/templates/field--block-content--logo-link.html.twig
index 362acc8..638a0cc 100644
--- a/web/themes/custom/quartiers_de_demain/templates/field--block-content--logo-link.html.twig
+++ b/web/themes/custom/quartiers_de_demain/templates/field--block-content--logo-link.html.twig
@@ -288,7 +288,7 @@
transform="translate(1161.8838,1648.1403)">
@@ -385,7 +385,7 @@
transform="translate(747.5991,1522.7208)">
@@ -394,7 +394,7 @@
transform="translate(746.9782,1556.9387)">
diff --git a/web/themes/custom/quartiers_de_demain/templates/page--front.html.twig b/web/themes/custom/quartiers_de_demain/templates/page--front.html.twig
index e9b02e5..413e923 100644
--- a/web/themes/custom/quartiers_de_demain/templates/page--front.html.twig
+++ b/web/themes/custom/quartiers_de_demain/templates/page--front.html.twig
@@ -81,7 +81,9 @@
#}
{{ page.content }}
{# /.layout-content #}
-
+ {#
+ {% include active_theme_path() ~ '/dist/assets/img/formes-animees.svg' %}
+
#}
{% if page.sidebar_first %}