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

puce calendrier

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi 2025-04-08 22:03:57 +02:00
parent e4d3a32ed1
commit 9b6785d324
2 changed files with 55 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1484,7 +1484,20 @@ footer {
height: fit-content; height: fit-content;
} }
} }
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement::after {
content: "";
position: absolute;
bottom: -0.2rem;
left: 50%;
transform: translateX(-50%);
width: 10px;
height: 10px;
background-color: black;
border-radius: 50%;
z-index: 2;
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
@ -1498,38 +1511,6 @@ footer {
padding-left: 4rem; padding-left: 4rem;
} }
} }
#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);
}
@media (max-width: 1100px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
transform: translateY(18.6rem);
}
}
@media (max-width: 1080px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
transform: translateY(18.3rem);
}
}
@media (min-width: 809px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
transform: translateY(20.7rem);
}
}
@media (max-width: 770px) {
#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(21.2rem);
padding-right: 3rem;
}
}
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date {
width: fit-content !important; width: fit-content !important;
display: flex; display: flex;

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

@ -53,7 +53,22 @@
// content: '\002022'; // content: '\002022';
// } // }
} }
.paragraph--type--phase-deroulement::after {
content: '';
position: absolute;
bottom: -0.2rem; // Juste en dessous ou collé à la border-bottom
left: 50%;
transform: translateX(-50%);
width: 10px;
height: 10px;
background-color: black;
border-radius: 50%;
z-index: 2;
}
.paragraph--type--phase-deroulement{ .paragraph--type--phase-deroulement{
position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
@ -65,35 +80,35 @@
padding-bottom: 1rem; padding-bottom: 1rem;
padding-left: 4rem; padding-left: 4rem;
} }
.border-symbol{ // .border-symbol{
align-self: end; // align-self: end;
font-size: 2.5rem; // font-size: 2.5rem;
display: inline-block; /* Permet d'utiliser height */ // display: inline-block; /* Permet d'utiliser height */
line-height: 0; /* Assure que la hauteur est minimale */ // line-height: 0; /* Assure que la hauteur est minimale */
transform: translateX(1rem); // transform: translateX(1rem);
@media(max-width:1100px){ // @media(max-width:1100px){
transform: translateY(18.6rem); // transform: translateY(18.6rem);
} // }
@media(max-width:1080px){ // @media(max-width:1080px){
transform: translateY(18.3rem); // transform: translateY(18.3rem);
} // }
@media(min-width:809px){ // @media(min-width:809px){
transform: translateY(20.7rem); // transform: translateY(20.7rem);
} // }
@media(max-width:770px){ // @media(max-width:770px){
align-self: center; // align-self: center;
font-size: 2.5rem; // font-size: 2.5rem;
display: inline-block; // display: inline-block;
line-height: 0; // line-height: 0;
transform: translateY(21.2rem); // transform: translateY(21.2rem);
padding-right: 3rem; // padding-right: 3rem;
} // }
// @media(max-width:290px){ // // @media(max-width:290px){
// transform: translateY(22.2rem); // // transform: translateY(22.2rem);
// } // // }
} // }
// border-bottom: solid black 1px; // border-bottom: solid black 1px;
// &:before{ // &:before{
// content:"."; // content:".";