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

calendrier puce

This commit is contained in:
ouidade 2024-09-26 22:52:31 +02:00
parent d76be6f9e6
commit cfa848d40d
4 changed files with 48 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1165,32 +1165,34 @@ footer {
height: fit-content; 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 { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
padding-right: 1rem; padding-right: 1rem;
padding-bottom: 1rem;
} }
@media (max-width: 500px) { @media (max-width: 500px) {
#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 {
flex-direction: column; flex-direction: column;
align-items: baseline; 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:before { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
content: "."; align-self: end;
font-size: 4rem; font-size: 2.5rem;
position: absolute; display: inline-block; /* Permet d'utiliser height */
top: 50%; line-height: 0; /* Assure que la hauteur est minimale */
transform: translateY(-50%); /* Centrer parfaitement verticalement */ transform: translateX(1rem);
} }
@media (max-width: 550px) { @media (max-width: 500px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement:before { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .border-symbol {
display: none; align-self: center;
font-size: 2.5rem;
display: inline-block;
line-height: 0;
transform: translateY(22.5rem);
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 {
@ -1273,6 +1275,7 @@ footer {
width: 41%; width: 41%;
min-width: 35%; min-width: 35%;
height: 300px; height: 300px;
margin-bottom: 1rem;
} }
@media (max-width: 1090px) { @media (max-width: 1090px) {
#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text { #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text {

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

@ -41,32 +41,48 @@
} }
&.__paragraphs{ &.__paragraphs{
::before{ // ::before{
content: '.'; // content: '\002022';
} // }
} }
.paragraph--type--phase-deroulement{ .paragraph--type--phase-deroulement{
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
padding-right: 1rem; padding-right: 1rem;
padding-bottom: 1rem; // padding-bottom: 1rem;
@media(max-width:500px){ @media(max-width:500px){
flex-direction: column; flex-direction: column;
align-items: baseline; 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; // border-bottom: solid black 1px;
&:before{ // &:before{
content:"."; // content:".";
font-size: 4rem; // font-size: 4rem;
position: absolute; // position: absolute;
top: 50%; // top: 50%;
transform: translateY(-50%); /* Centrer parfaitement verticalement */ // transform: translateY(-50%); /* Centrer parfaitement verticalement */
@media(max-width:550px){ // @media(max-width:550px){
display: none; // display: none;
} // }
} // }
.date{ .date{
width: fit-content !important; width: fit-content !important;
@ -153,7 +169,7 @@
width: 41%; width: 41%;
min-width: 35%; min-width: 35%;
height: 300px; height: 300px;
margin-bottom: 1rem;
@media(max-width:1090px){ @media(max-width:1090px){
height: 200px; height: 200px;

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

@ -68,14 +68,6 @@
<div{{ attributes }}> <div{{ attributes }}>
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div> <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
<div class='timeline'> <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"> <div class="__timeline-content">
{% if multiple %} {% if multiple %}
{% endif %} {% endif %}

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

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