puce calendrier

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

View File

@ -1484,7 +1484,20 @@ footer {
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 {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
@ -1498,38 +1511,6 @@ footer {
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 {
width: fit-content !important;
display: flex;

View File

@ -53,7 +53,22 @@
// 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{
position: relative;
display: flex;
flex-direction: row;
align-items: center;
@ -65,35 +80,35 @@
padding-bottom: 1rem;
padding-left: 4rem;
}
.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){
transform: translateY(18.6rem);
}
@media(max-width:1080px){
transform: translateY(18.3rem);
}
@media(min-width:809px){
transform: translateY(20.7rem);
}
@media(max-width:770px){
align-self: center;
font-size: 2.5rem;
display: inline-block;
line-height: 0;
transform: translateY(21.2rem);
padding-right: 3rem;
}
// @media(max-width:290px){
// transform: translateY(22.2rem);
// }
// .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){
// transform: translateY(18.6rem);
// }
// @media(max-width:1080px){
// transform: translateY(18.3rem);
// }
// @media(min-width:809px){
// transform: translateY(20.7rem);
// }
// @media(max-width:770px){
// align-self: center;
// font-size: 2.5rem;
// display: inline-block;
// line-height: 0;
// transform: translateY(21.2rem);
// padding-right: 3rem;
// }
// // @media(max-width:290px){
// // transform: translateY(22.2rem);
// // }
}
// }
// border-bottom: solid black 1px;
// &:before{
// content:".";