bachir/drupal-quartiersdedemain
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

timeline month

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi
2024-07-17 21:29:18 +02:00
parent 119451da1a
commit adca214c4b
9 changed files with 236 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/themes/custom/quartiers_de_demain/dist/assets/bundle.js vendored
View File

File diff suppressed because one or more lines are too long

120
web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css vendored
View File

@ -1204,7 +1204,7 @@ footer {
font-size: 4rem;
}
}
#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_moi::after {
#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_moi .after::after {
content: ".";
}
#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee {
@ -1479,12 +1479,12 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
#home #background-animated {
position: absolute;
top: 1000px;
top: -400px;
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 */
z-index: 2; /* S'assure que l'élément soit au-dessus */
}
@media (max-width: 1400px) {
#home #background-animated {
@ -1494,16 +1494,95 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
#home #background-animated svg {
max-width: 100%;
position: relative;
top: -1500px;
}
#home .layout-content {
position: relative;
z-index: 2; /* S'assure que le contenu soit au-dessus des animations */
z-index: 1; /* S'assure que le contenu soit au-dessus des animations */
}
#home .layout-container.home {
position: relative;
}
#home .visible h5:nth-of-type(1) {
animation-delay: 1s;
animation-name: Appear;
animation-duration: 1s;
}
#home .visible svg:nth-of-type(1) {
animation-delay: 2s; /* Start after h5 (1s) + h5 duration (1s) */
animation-name: Appear;
animation-duration: 5s; /* Assuming svg animation is 5s */
}
#home .visible p:nth-of-type(1) {
animation-delay: 7s; /* Start after svg (2s) + svg duration (5s) */
animation-name: Appear;
animation-duration: 1s;
}
#home .visible h5:nth-of-type(2) {
animation-delay: 8s; /* Start after p (7s) + p duration (1s) */
animation-name: Appear;
animation-duration: 1s;
}
#home .visible svg:nth-of-type(2) {
animation-delay: 9s; /* Start after h5 (8s) + h5 duration (1s) */
animation-name: Appear;
animation-duration: 5s; /* Assuming svg animation is 5s */
}
#home .visible p:nth-of-type(2) {
animation-delay: 14s; /* Start after svg (9s) + svg duration (5s) */
animation-name: Appear;
animation-duration: 1s;
}
#home .visible h5:nth-of-type(3) {
animation-delay: 15s; /* Start after p (14s) + p duration (1s) */
animation-name: Appear;
animation-duration: 1s;
}
#home .visible svg:nth-of-type(3) {
animation-delay: 16s; /* Start after h5 (15s) + h5 duration (1s) */
animation-name: Appear;
animation-duration: 5s; /* Assuming svg animation is 5s */
}
#home .visible p:nth-of-type(3) {
animation-delay: 21s; /* Start after svg (16s) + svg duration (5s) */
animation-name: Appear;
animation-duration: 1s;
}
@keyframes Appear {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
#home #paragraph-id--7 .colone-picto svg #pillier-1-path365 {
stroke-dasharray: 1000; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 5s ease-in-out forwards; /* Animation de remplissage sur 2 secondes */
animation-delay: 5s;
}
#home #paragraph-id--7 .colone-picto svg #pillier-2-path367 {
stroke-dasharray: 0; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 5s ease-in-out forwards; /* Animation de remplissage sur 2 secondes */
animation-delay: 5s;
}
#home #paragraph-id--7 .colone-picto svg #pillier-3-path369 {
stroke-dasharray: 1000; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 5s ease-in-out forwards; /* Animation de remplissage sur 2 secondes */
animation-delay: 5s;
}
@keyframes fillAnimation {
from {
stroke-dashoffset: 1000; /* Début du chemin de décalage complet */
}
to {
stroke-dashoffset: 0; /* Aucun décalage, le chemin est complètement visible */
}
}
/*pages*/
#home .config_pages--type--diaporama-home {
position: relative;
@ -1547,6 +1626,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
#home article.node-type-static .field_body > p:nth-child(1) {
margin-bottom: 0;
flex: 1 100%;
z-index: 6;
font-size: 1.5rem;
}
@media (max-width: 1090px) {
@ -2087,36 +2167,6 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
position: relative;
}
}
#home article.node-type-static #paragraph-id--7 .colone-picto svg #pillier-1-path365 {
stroke-dasharray: 1000; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 8s ease-in-out infinite; /* Animation de remplissage sur 2 secondes */
animation-delay: 5s;
animation-direction: alternate; /* Animation en aller-retour */
}
#home article.node-type-static #paragraph-id--7 .colone-picto svg #pillier-2-path367 {
stroke-dasharray: 0; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 8s ease-in-out infinite; /* Animation de remplissage sur 2 secondes */
animation-delay: 10s;
animation-direction: alternate; /* Animation en aller-retour */
}
#home article.node-type-static #paragraph-id--7 .colone-picto svg #pillier-3-path369 {
stroke-dasharray: 0; /* Longueur totale du chemin */
stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
animation: fillAnimation 8s ease-in-out; /* Animation de remplissage sur 2 secondes */
animation-delay: 15s;
animation-direction: alternate; /* Animation en aller-retour */
animation-iteration-count: infinite; /* Animation infinie */
}
@keyframes fillAnimation {
from {
stroke-dashoffset: 1000; /* Début du chemin de décalage complet */
}
to {
stroke-dashoffset: 0; /* Aucun décalage, le chemin est complètement visible */
}
}
#home .paragraph--type--static-parts:not(#paragraph-id--7) #svg1 {
display: none;
}