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

Compare commits

base: bachir:59d7abe4f00319174a41ae2c8610f1cf1fb33164
Branches Tags
bachir:master
bachir:prod
bachir:stage
bachir:prd
..
compare: bachir:761470724074acb393e5b9f152e07283ebd583b5
Branches Tags
bachir:master
bachir:prod
bachir:stage
bachir:prd

No commits in common. "59d7abe4f00319174a41ae2c8610f1cf1fb33164" and "761470724074acb393e5b9f152e07283ebd583b5" have entirely different histories.
59d7abe4f0 ... 7614707240

11 changed files with 90 additions and 107 deletions
Show Stats 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

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

@ -1165,34 +1165,32 @@ footer {
height: fit-content;
}
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track.__paragraphs ::before {
content: ".";
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
display: flex;
flex-direction: row;
align-items: center;
padding-right: 1rem;
padding-bottom: 1rem;
}
@media (max-width: 500px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
flex-direction: column;
align-items: baseline;
padding-bottom: 1rem;
}
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
align-self: end;
font-size: 2.5rem;
display: inline-block; /* Permet d'utiliser height */
line-height: 0; /* Assure que la hauteur est minimale */
transform: translateX(1rem);
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement:before {
content: ".";
font-size: 4rem;
position: absolute;
top: 50%;
transform: translateY(-50%); /* Centrer parfaitement verticalement */
}
@media (max-width: 500px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
align-self: center;
font-size: 2.5rem;
display: inline-block;
line-height: 0;
transform: translateY(22.5rem);
padding-right: 3rem;
@media (max-width: 550px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement:before {
display: none;
}
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date {
@ -1275,7 +1273,6 @@ footer {
width: 41%;
min-width: 35%;
height: 300px;
margin-bottom: 1rem;
}
@media (max-width: 1090px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text {
@ -1509,7 +1506,6 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
}
#home #background-animated {
display: none;
position: absolute;
top: 2000px;
left: 350px;
@ -1628,9 +1624,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
#home .config_pages--type--diaporama-home .diaporama .slick-list .cadre-img-zoom img {
width: 100%;
height: auto;
animation-duration: 4.5s;
animation-name: zoomOut;
animation-iteration-count: infinite;
animation: zoomOut 2.5s ease-in infinite;
}
#home .config_pages--type--diaporama-home .diaporama .slick-list blockquote {
position: relative;
@ -1643,10 +1637,10 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
}
@keyframes zoomOut {
0% {
transform: scale(1.1);
transform: scale(1);
}
100% {
transform: scale(1.3);
transform: scale(1.05);
}
}
#home .content_container #block-quartiers-de-demain-titredepage {

30
web/themes/custom/quartiers_de_demain/dist/assets/img/formes-animees.svg vendored
View File

@ -4,9 +4,9 @@
<svg
version="1.1"
id="svg1"
width="1399.6859"
height="4141.061"
viewBox="0 0 1399.6859 4141.0611"
width="1440.5675"
height="6585.9683"
viewBox="0 0 1440.5675 6585.9684"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
@ -46,47 +46,51 @@
</defs>
<g
id="g3"
transform="translate(-509.36305,-2803.6546)">
transform="translate(-509.36305,-2445.5661)">
<g
id="g2">
<g
id="g1"
transform="translate(0.17944336,-2.9196463)">
<path
id="path148"
d="m 1544.4558,8077.9597 194.3574,-163.0856"
style="fill:none;stroke:#0833c2;stroke-width:64.3111;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
id="path151"
d="m 1818.0282,2628.0978 v 160.571"
style="fill:none;stroke:#0833c2;stroke-width:78.092;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
id="path254"
d="M 0,0 C 0,205.098 -166.265,371.361 -371.362,371.361"
style="fill:none;stroke:#000000;stroke-width:137.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(0.48783546,0,0,-0.48783546,1583.811,6947.6351)"
transform="matrix(0.91872984,0,0,-0.91872984,1649.0098,9034.4538)"
clip-path="url(#clipPath255)" />
<path
id="path256"
d="m 533.81621,3347.9845 163.08557,194.3583"
style="fill:none;stroke:#0833c2;stroke-width:64.3111;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
id="path256-3"
d="m 1652.1683,6058.9184 -163.0856,194.3583"
style="fill:none;stroke:#0833c2;stroke-width:64.3111;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
<path
id="path257"
d="M 0,0 C -205.098,0 -371.361,-166.265 -371.361,-371.362"
style="fill:none;stroke:#f7002b;stroke-width:137.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(-0.47297787,0,0,-0.47297787,1700.711,2839.0872)"
transform="matrix(0.91872984,0,0,-0.91872984,1388.9577,2511.6402)"
clip-path="url(#clipPath258)" />
<path
id="path300"
d="M 0,0 C 0,-126.805 102.795,-229.6 229.6,-229.6"
style="fill:none;stroke:#f7002b;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(0.72647042,0,0,-0.72647042,1636.7965,4238.0583)"
transform="matrix(0.91872984,0,0,-0.91872984,1738.8107,4755.9014)"
clip-path="url(#clipPath301)" />
<path
id="path302"
d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
style="fill:none;stroke:#0833c2;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(0.82260013,0,0,-0.82260013,1865.1937,5133.4927)"
transform="matrix(0.91872984,0,0,-0.91872984,1874.1866,6246.5711)"
clip-path="url(#clipPath303)" />
<path
id="path311"
d="M 552.65311,4967.771 V 4707.7705"
d="M 552.65311,6047.771 V 5787.7705"
style="fill:none;stroke:#000000;stroke-width:78.092;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
</g>
</g>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

2
web/themes/custom/quartiers_de_demain/src/assets/js/animated_formes.js
View File

@ -3,7 +3,7 @@ document.addEventListener('scroll', function() {
const background = document.getElementById('background-animated');
if (background) {
// Adjust this value to control the speed of the parallax effect
const parallaxSpeed = 0.5;
const parallaxSpeed = 0.2;
background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)';
}
});

54
web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
View File

@ -561,36 +561,32 @@
////////////////////// end diaporama home swiper /////////////////////////////////
$(document).ready(function () {
$(document).ready(function(){
let diapohome = $('.config_pages--type--diaporama-home .diaporama');
if (diapohome.length) {
// Initialisation de Slick
diapohome.slick({
slidesToShow: 1,
dots: false,
arrows: false,
centerMode: true,
adaptiveHeight: true,
autoplay: true, // Activer l'autoplay
autoplaySpeed: 4000, // Changement de slide toutes les 4 secondes
infinite: true,
pauseOnHover: false, // Ne pas arrêter l'autoplay lors du survol
pauseOnFocus: false,
responsive: [
{
breakpoint: 810,
settings: {
slidesToShow: 1,
adaptiveHeight: false,
arrows: false,
draggable: true,
centerMode: false,
}
}]
});
}
if (diapohome) {
diapohome.slick({
slidesToShow: 1,
dots: false,
arrows: false,
centerMode: false, // Désactivé pour éviter les sauts
adaptiveHeight: false, // Désactivé pour éviter les changements de hauteur
autoplay: true,
autoplaySpeed: 2000,
infinite: true,
responsive: [
{
breakpoint: 810,
settings: {
slidesToShow: 1,
adaptiveHeight: false,
arrows: true,
draggable: true,
centerMode: true, // Désactivé seulement pour les petits écrans
}
}]
});
console.log('Diaporama initialisé');
}
});

10
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss
View File

@ -13,11 +13,7 @@
img{
width: 100%;
height: auto;
// animation: zoomOut infinite 4.3s ease-in-out;
animation-duration: 4.5s;
animation-name: zoomOut;
animation-iteration-count: infinite;
animation: zoomOut 2.5s ease-in infinite;
}
}
blockquote{
@ -32,10 +28,10 @@
@keyframes zoomOut {
0% {
transform: scale(1.1);
transform: scale(1);
}
100% {
transform: scale(1.3);
transform: scale(1.05);
}
}

2
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/formes-animees.scss
View File

@ -1,7 +1,7 @@
#home{
#background-animated {
display: none;
// display: none;
position: absolute;
top: 2000px;
left: 350px;

46
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss
View File

@ -41,48 +41,32 @@
}
&.__paragraphs{
// ::before{
// content: '\002022';
// }
::before{
content: '.';
}
}
.paragraph--type--phase-deroulement{
display: flex;
flex-direction: row;
align-items: center;
padding-right: 1rem;
// padding-bottom: 1rem;
padding-bottom: 1rem;
@media(max-width:500px){
flex-direction: column;
align-items: baseline;
padding-bottom: 1rem;
}
.border-symbol{
align-self: end;
font-size: 2.5rem;
display: inline-block; /* Permet d'utiliser height */
line-height: 0; /* Assure que la hauteur est minimale */
transform: translateX(1rem);
@media(max-width:500px){
align-self: center;
font-size: 2.5rem;
display: inline-block;
line-height: 0;
transform: translateY(22.5rem);
padding-right: 3rem;
}
}
// border-bottom: solid black 1px;
// &:before{
// content:".";
// font-size: 4rem;
// position: absolute;
// top: 50%;
// transform: translateY(-50%); /* Centrer parfaitement verticalement */
// @media(max-width:550px){
// display: none;
// }
&:before{
content:".";
font-size: 4rem;
position: absolute;
top: 50%;
transform: translateY(-50%); /* Centrer parfaitement verticalement */
@media(max-width:550px){
display: none;
}
// }
}
.date{
width: fit-content !important;
@ -169,7 +153,7 @@
width: 41%;
min-width: 35%;
height: 300px;
margin-bottom: 1rem;
@media(max-width:1090px){
height: 200px;

1
web/themes/custom/quartiers_de_demain/templates/config-pages--diaporama-home.html.twig
View File

@ -18,4 +18,5 @@ set classes = [
%}
<div{{ attributes.addClass(classes) }}>
{{ content }}
{# {% include active_theme_path() ~ '/dist/assets/img/formes-animees-1.svg' %} #}
</div>

8
web/themes/custom/quartiers_de_demain/templates/field--config-pages--deroulement.html.twig
View File

@ -68,6 +68,14 @@
<div{{ attributes }}>
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
<div class='timeline'>
{# <div class="__timeline-arrows">
<button id='arrowPrev' class="arrow arrow__prev" aria-label="Previous" type="button">
{% include active_theme_path() ~ '/dist/assets/img/prev.svg' %}
</button>
<button id='arrowNext' class="arrow arrow__next" aria-label="Next" type="button">
{% include active_theme_path() ~ '/dist/assets/img/next.svg' %}
</button>
</div> #}
<div class="__timeline-content">
{% if multiple %}
{% endif %}

2
web/themes/custom/quartiers_de_demain/templates/paragraph--phase-deroulement.html.twig
View File

@ -50,7 +50,7 @@
{% block paragraph %}
{# <div{{ attributes.addClass(classes) }}> #}
<div{{ attributes.addClass(classes).setAttribute('id', 'paragraph-id--' ~ paragraph.id()) }}>
<span class="border-symbol">&#x2022;</span> <!-- Ajout du symbole -->
{% block content %}
{# {{ content }} #}
<div class="date">