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

Compare commits

base: bachir:fa077a52eddb7bee381e9d002d931c855571db06
Branches Tags
bachir:master
bachir:prod
bachir:stage
bachir:newPages
bachir:live
bachir:tmp
bachir:avantLive
bachir:prd
..
compare: bachir:b8e851e6f58dbb18ca07f8782fe78a49e1d81557
Branches Tags
bachir:master
bachir:prod
bachir:stage
bachir:newPages
bachir:live
bachir:tmp
bachir:avantLive
bachir:prd

2 Commits
fa077a52ed ... b8e851e6f5

Author SHA1 Message Date
ouidade
b8e851e6f5 actualites js et css 2025-03-25 16:14:02 +01:00
ouidade
886e31588c actualites js et css 2025-03-25 15:42:01 +01:00
8 changed files with 443 additions and 429 deletions
Show Stats Expand all files Collapse all files

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

File diff suppressed because one or more lines are too long

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

@ -1568,7 +1568,7 @@ footer {
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
} }
#actus-caroussel .content-actus .views-row { #actus-caroussel .content-actus .view-rows-wrapper .views-row {
display: flex; display: flex;
margin: auto; margin: auto;
width: 100%; width: 100%;
@ -1581,21 +1581,21 @@ footer {
align-items: center; align-items: center;
border-bottom: solid black 0.5px; border-bottom: solid black 0.5px;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite {
width: 85%; width: 85%;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu {
display: grid; display: grid;
grid-template-columns: 1fr 2fr; grid-template-columns: 1fr 2fr;
grid-template-rows: repeat(5 1fr); grid-template-rows: repeat(5 1fr);
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images {
grid-column: 1; grid-column: 1;
grid-row: 1/span 5; grid-row: 1/span 5;
width: 250px; width: 250px;
margin-right: 1rem; margin-right: 1rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -1603,17 +1603,17 @@ footer {
margin: auto; margin: auto;
margin-right: 1rem; margin-right: 1rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list {
margin: auto; margin: auto;
padding-top: 0 !important; padding-top: 0 !important;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom {
display: flex; display: flex;
margin: auto; margin: auto;
width: 250px; width: 250px;
height: auto; height: auto;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom img { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom img {
width: 100%; width: 100%;
height: auto; height: auto;
object-fit: cover; object-fit: cover;
@ -1622,46 +1622,46 @@ footer {
-webkit-border-radius: 9px; /* pour Safari sur Mac */ -webkit-border-radius: 9px; /* pour Safari sur Mac */
border-radius: 9px; /* CSS3 */ border-radius: 9px; /* CSS3 */
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption {
margin: 0; margin: 0;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption p { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption p {
margin-top: 0; margin-top: 0;
font-size: 0.4rem; font-size: 0.4rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button {
margin: auto; margin: auto;
transform: none; transform: none;
top: 30%; top: 30%;
height: 0; height: 0;
width: 0; width: 0;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before {
transform: scale(0.4) !important; transform: scale(0.4) !important;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before:hover { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before:hover {
filter: brightness(1.75); filter: brightness(1.75);
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-next { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-next {
right: 15%; right: 15%;
padding: 0; padding: 0;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-prev { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-prev {
left: 5%; left: 5%;
padding: 0; padding: 0;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite, #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite,
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_date, #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date,
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_site, #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site,
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_title, #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title,
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_body, #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body,
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_liens { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens {
grid-column: 2; grid-column: 2;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite {
order: 2; order: 2;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a {
text-transform: uppercase; text-transform: uppercase;
color: red; color: red;
font-size: 0.6rem; font-size: 0.6rem;
@ -1669,7 +1669,7 @@ footer {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a::before { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a::before {
content: ""; content: "";
display: inline-block; display: inline-block;
width: 16px; /* Ajuste la largeur */ width: 16px; /* Ajuste la largeur */
@ -1679,7 +1679,7 @@ footer {
background-repeat: no-repeat; background-repeat: no-repeat;
padding-right: 0.4rem; padding-right: 0.4rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_date { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date {
order: 3; order: 3;
color: red; color: red;
font-size: 0.6rem; font-size: 0.6rem;
@ -1687,7 +1687,7 @@ footer {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_date::before { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date::before {
content: ""; content: "";
display: inline-block; display: inline-block;
width: 16px; /* Ajuste la largeur */ width: 16px; /* Ajuste la largeur */
@ -1697,10 +1697,10 @@ footer {
background-repeat: no-repeat; background-repeat: no-repeat;
padding-right: 0.4rem; padding-right: 0.4rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_site { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site {
order: 4; order: 4;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_site a { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site a {
color: red; color: red;
font-size: 0.6rem; font-size: 0.6rem;
font-weight: 600; font-weight: 600;
@ -1708,7 +1708,7 @@ footer {
align-items: center; align-items: center;
padding-left: 0.2rem; padding-left: 0.2rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_site a::before { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site a::before {
content: ""; content: "";
display: inline-block; display: inline-block;
width: 10px; /* Ajuste la largeur */ width: 10px; /* Ajuste la largeur */
@ -1718,40 +1718,40 @@ footer {
background-repeat: no-repeat; background-repeat: no-repeat;
padding-right: 0.5rem; padding-right: 0.5rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_title { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title {
order: 5; order: 5;
line-height: 1rem; line-height: 1rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_title a { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title a {
color: rgb(7, 50, 194); color: rgb(7, 50, 194);
font-size: 1.2rem; font-size: 1.2rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_title h2 { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title h2 {
margin-top: 0.5rem; margin-top: 0.5rem;
margin-bottom: 0; margin-bottom: 0;
padding-left: 0; padding-left: 0;
font-family: "gilroy-medium"; font-family: "gilroy-medium";
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_sous_titre { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_sous_titre {
color: rgb(7, 50, 194); color: rgb(7, 50, 194);
font-family: "gilroy-light"; font-family: "gilroy-light";
font-size: 1.2rem; font-size: 1.2rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_body { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body {
order: 6; order: 6;
opacity: 1 !important; opacity: 1 !important;
transform: none !important; transform: none !important;
font-family: "gilroy-light"; font-family: "gilroy-light";
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_body p { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body p {
font-size: 0.8rem; font-size: 0.8rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_liens { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens {
order: 7; order: 7;
padding: 0; padding: 0;
width: fit-content; width: fit-content;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
padding-left: 0.5rem; padding-left: 0.5rem;
@ -1765,16 +1765,16 @@ footer {
font-size: 0.6rem; font-size: 0.6rem;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a svg { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a svg {
display: none; display: none;
} }
#actus-caroussel .content-actus .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a::after { #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a::after {
display: inline-flex; display: inline-flex;
content: url("../img/noun-arrow-to-right.svg"); content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem; padding-right: 0.2rem;
padding-left: 0.2rem; padding-left: 0.2rem;
} }
#actus-caroussel .content-actus .views-row .toggle-actualite { #actus-caroussel .content-actus .view-rows-wrapper .views-row .toggle-actualite {
display: block; display: block;
width: 40px; width: 40px;
height: 40px; height: 40px;
@ -1788,9 +1788,37 @@ footer {
cursor: pointer; cursor: pointer;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
#actus-caroussel .content-actus .views-row .toggle-actualite.open { #actus-caroussel .content-actus .view-rows-wrapper .views-row .toggle-actualite.open {
transform: rotate(180deg); transform: rotate(180deg);
} }
#actus-caroussel .content-actus footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c {
display: flex;
}
#actus-caroussel .content-actus footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c .field_field_link {
width: fit-content;
margin: auto;
}
#actus-caroussel .content-actus footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c .field_field_link a {
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
margin-bottom: 0.5rem;
}
#actus-caroussel .content-actus footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c .field_field_link a svg {
display: none;
}
#actus-caroussel .content-actus footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c .field_field_link a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-header { header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-header {
opacity: 0; opacity: 0;
@ -2034,6 +2062,9 @@ body {
} }
/*pages*/ /*pages*/
#home {
padding-bottom: 0;
}
#home .config_pages--type--diaporama-home { #home .config_pages--type--diaporama-home {
position: relative; position: relative;
} }
@ -3008,6 +3039,9 @@ body {
font-size: 2rem; font-size: 2rem;
font-weight: 500; font-weight: 500;
} }
.partenaires .layout-content .content_container #block-quartiers-de-demain-titredepage .field_intro {
visibility: visible;
}
.partenaires .layout-content .content_container .views-element-container { .partenaires .layout-content .content_container .views-element-container {
width: 80%; width: 80%;
} }
@ -3306,35 +3340,31 @@ body {
padding-bottom: 2rem; padding-bottom: 2rem;
opacity: 1 !important; opacity: 1 !important;
display: block !important; display: block !important;
font-family: "gilroy-light";
} }
#page-node .content_container .node-type-actualite div .field_body p { #page-node .content_container .node-type-actualite div .field_body p {
font-size: 0.8rem; font-size: 0.8rem;
} }
#page-node .content_container .node-type-actualite div .field_field_liens { #page-node .content_container .node-type-actualite div .field_field_site {
order: 3; margin-left: 0.5rem;
padding-bottom: 2rem;
padding-top: 2rem;
width: fit-content;
} }
#page-node .content_container .node-type-actualite div .field_field_liens a { #page-node .content_container .node-type-actualite div .field_field_site a {
display: flex; color: red;
flex-direction: row; font-size: 0.6rem;
padding-left: 0.5rem; font-weight: 600;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
color: white; padding-left: 0.1rem;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
} }
#page-node .content_container .node-type-actualite div .field_field_liens a svg { #page-node .content_container .node-type-actualite div .field_field_site a::before {
display: none; content: "";
} display: inline-block;
#page-node .content_container .node-type-actualite div .field_field_liens a::after { width: 10px; /* Ajuste la largeur */
display: inline-flex; height: 17px; /* Ajuste la hauteur */
content: url("../img/noun-arrow-to-right.svg"); background-image: url("../img/map_pointer.svg");
padding-right: 0.2rem; background-size: contain;
padding-left: 0.2rem; background-repeat: no-repeat;
padding-right: 0.5rem;
} }
#page-node .content_container .node-type-actualite div .field_field_images { #page-node .content_container .node-type-actualite div .field_field_images {
order: 5; order: 5;
@ -3367,6 +3397,7 @@ body {
font-weight: 600; font-weight: 600;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
} }
#page-node .content_container .node-type-actualite .infos-actu .field_field_type_d_actualite a::before { #page-node .content_container .node-type-actualite .infos-actu .field_field_type_d_actualite a::before {
content: url("../img/type-actu.svg"); content: url("../img/type-actu.svg");
@ -3378,11 +3409,41 @@ body {
flex-direction: row; flex-direction: row;
margin-left: 1rem; margin-left: 1rem;
padding-right: 1rem; padding-right: 1rem;
justify-content: space-between;
} }
#page-node .content_container .node-type-actualite .infos-actu .field_field_date::before { #page-node .content_container .node-type-actualite .infos-actu .field_field_date::before {
content: url("../img/date-actu.svg"); content: url("../img/date-actu.svg");
padding-right: 0.4rem; padding-right: 0.4rem;
} }
#page-node .content_container .node-type-actualite .infos-actu .field_field_liens {
order: 3;
margin-left: 1rem;
width: fit-content;
display: block !important;
}
#page-node .content_container .node-type-actualite .infos-actu .field_field_liens a {
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
}
#page-node .content_container .node-type-actualite .infos-actu .field_field_liens a svg {
display: none;
}
#page-node .content_container .node-type-actualite .infos-actu .field_field_liens a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
#page-node .content_container .toggle-actualite {
visibility: hidden;
}
.node-type-site .layout-content { .node-type-site .layout-content {
margin-top: 2rem; margin-top: 2rem;
@ -4206,6 +4267,7 @@ main {
#actualites main { #actualites main {
background-color: white; background-color: white;
padding-bottom: 0;
} }
#actualites .layout-container main { #actualites .layout-container main {
padding-top: 250px; padding-top: 250px;

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

@ -567,115 +567,6 @@ document.addEventListener('keydown', (e) => {
} }
}); });
// // Sélection des images et de leurs légendes dans la galerie
// let images = document.querySelectorAll('.paragraph--type--site-diapo .lightbox-trigger');
// let currentIndex;
// // Création de la lightbox et de ses éléments
// const lightbox = document.createElement('div');
// lightbox.id = 'lightbox';
// lightbox.classList.add('lightbox');
// document.body.appendChild(lightbox);
// const img = document.createElement('img');
// lightbox.appendChild(img);
// // Élément pour afficher la légende
// const caption = document.createElement('p');
// caption.classList.add('caption');
// lightbox.appendChild(caption);
// const closeBtn = document.createElement('span');
// closeBtn.classList.add('close');
// closeBtn.innerHTML = '×';
// lightbox.appendChild(closeBtn);
// // const prevBtn = document.createElement('a');
// // prevBtn.classList.add('prev');
// // prevBtn.innerHTML = '❮';
// // lightbox.appendChild(prevBtn);
// const prevBtn = document.createElement('a');
// prevBtn.classList.add('prev');
// const prevImg = document.createElement('img');
// prevImg.src = '/img/arrow-left.svg'; // <-- adapte le chemin à ton projet
// prevImg.alt = 'Précédent';
// prevBtn.appendChild(prevImg);
// // const nextBtn = document.createElement('a');
// // nextBtn.classList.add('next');
// // nextBtn.innerHTML = '&#10095;';
// // lightbox.appendChild(nextBtn);
// const nextBtn = document.createElement('a');
// nextBtn.classList.add('next');
// const nextImg = document.createElement('img');
// nextImg.src = '/img/arrow-right.svg'; // <-- adapte ici aussi
// nextImg.alt = 'Suivant';
// nextBtn.appendChild(nextImg);
// // Fonction pour afficher l'image et la légende à l'index donné
// function showImage(index) {
// if (index < 0) index = images.length - 1;
// if (index >= images.length) index = 0;
// currentIndex = index;
// // Mettre à jour l'image
// img.src = images[currentIndex].getAttribute('src');
// // Récupérer la légende associée (le paragraphe dans blockquote suivant l'image)
// const captionText = images[currentIndex]
// .closest('.cadre-img-zoom')
// .nextElementSibling.querySelector('.image-field-caption p')
// .textContent;
// caption.textContent = captionText || ''; // Affiche la légende ou une chaîne vide si elle est absente
// lightbox.style.display = 'flex';
// }
// // Événements de clic sur chaque image pour ouvrir le lightbox avec la légende
// images.forEach((image, index) => {
// image.addEventListener('click', () => {
// showImage(index);
// });
// });
// // Fermer le lightbox
// closeBtn.addEventListener('click', () => {
// lightbox.style.display = 'none';
// });
// // Navigation pour images précédente et suivante
// prevBtn.addEventListener('click', (e) => {
// e.stopPropagation();
// showImage(currentIndex - 1);
// });
// nextBtn.addEventListener('click', (e) => {
// e.stopPropagation();
// showImage(currentIndex + 1);
// });
// // Fermer le lightbox en cliquant en dehors de l'image
// lightbox.addEventListener('click', (e) => {
// if (e.target === lightbox) {
// lightbox.style.display = 'none';
// }
// });
// // Ajout des contrôles clavier (Échap, flèches gauche/droite)
// document.addEventListener('keydown', (e) => {
// if (lightbox.style.display === 'flex') {
// if (e.key === 'Escape') {
// lightbox.style.display = 'none';
// } else if (e.key === 'ArrowLeft') {
// showImage(currentIndex - 1);
// } else if (e.key === 'ArrowRight') {
// showImage(currentIndex + 1);
// }
// }
// });
//////////////// end lightbox galerie image page site//////////////////////// //////////////// end lightbox galerie image page site////////////////////////
@ -762,13 +653,16 @@ $(document).ready(function () {
let article = $(this); let article = $(this);
let dateField = article.find(".field_field_date"); let dateField = article.find(".field_field_date");
let typeField = article.find(".field_field_type_d_actualite"); let typeField = article.find(".field_field_type_d_actualite");
let siteField = article.find(".field_field_site");
// Vérifier si les deux éléments existent // Vérifier si les deux éléments existent
if (dateField.length > 0 && typeField.length > 0) { if (dateField.length > 0 || typeField.length > 0) {
// Vérifier si l'encapsulation n'existe pas déjà // Vérifier si l'encapsulation n'existe pas déjà
if (article.find(".infos-actu").length === 0) { if (article.find(".infos-actu").length === 0) {
// Créer un conteneur et y insérer les éléments // Créer un conteneur et y insérer les éléments
let infosActu = $("<div>").addClass("infos-actu").append(dateField, typeField); let infosActu = $("<div>").addClass("infos-actu").append(dateField, typeField, siteField);
// Ajouter ce conteneur après les champs existants // Ajouter ce conteneur après les champs existants
article.append(infosActu); article.append(infosActu);

90
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/actualite.scss
View File

@ -44,43 +44,37 @@
padding-bottom: 2rem; padding-bottom: 2rem;
opacity:1 !important; opacity:1 !important;
display: block !important; display: block !important;
font-family: "gilroy-light" ;
p{ p{
font-size: 0.8rem; font-size: 0.8rem;
} }
} }
.field_field_liens{ .field_field_site{
order: 3; // margin-top: 0.2rem;
padding-bottom: 2rem; margin-left: 0.5rem;
padding-top: 2rem; a{
width: fit-content; color: red;
font-size: 0.6rem;
a{ font-weight: 600;
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
color: white; // margin-left: 1rem;
background: black; padding-left: 0.1rem;
text-transform: uppercase;
font-size: 0.6rem; &::before{
svg{ content: "";
display: none; display: inline-block;
width: 10px; /* Ajuste la largeur */
height: 17px; /* Ajuste la hauteur */
background-image: url("../img/map_pointer.svg");
background-size: contain;
background-repeat: no-repeat;
// margin-right: 0.4rem;
padding-right: 0.5rem;
} }
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
} }
// a:not(.ext){
// display: none;
// }
} }
.field_field_images{ .field_field_images{
order: 5; order: 5;
@ -108,6 +102,8 @@
border-bottom: solid red 1px; border-bottom: solid red 1px;
padding: 1rem 0rem; padding: 1rem 0rem;
margin-bottom: 1rem; margin-bottom: 1rem;
// justify-content: space-around;
.field_field_type_d_actualite a{ .field_field_type_d_actualite a{
text-transform: uppercase; text-transform: uppercase;
color: red; color: red;
@ -115,6 +111,7 @@
font-weight: 600; font-weight: 600;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
&::before{ &::before{
content: url('../img/type-actu.svg'); content: url('../img/type-actu.svg');
padding-right: 0.4rem; padding-right: 0.4rem;
@ -126,17 +123,52 @@
flex-direction: row; flex-direction: row;
margin-left: 1rem; margin-left: 1rem;
padding-right: 1rem; padding-right: 1rem;
justify-content: space-between;
&::before{ &::before{
content: url('../img/date-actu.svg'); content: url('../img/date-actu.svg');
padding-right: 0.4rem; padding-right: 0.4rem;
} }
} }
.field_field_liens{
order: 3;
// padding-bottom: 2rem;
// padding-top: 2rem;
margin-left: 1rem;
width: fit-content;
display: block !important;
a{
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
}
}
} }
} }
.toggle-actualite{
visibility: hidden;
}
} }
} }
// } // }

1
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/actualites.scss
View File

@ -4,6 +4,7 @@
// background-color:white !important; // background-color:white !important;
main{ main{
background-color:white ; background-color:white ;
padding-bottom: 0;
} }
.layout-container main{ .layout-container main{
padding-top: $header-height-big; padding-top: $header-height-big;

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

@ -1,4 +1,5 @@
#home{ #home{
padding-bottom: 0;
.config_pages--type--diaporama-home{ .config_pages--type--diaporama-home{
position: relative; position: relative;
.diaporama{ .diaporama{
@ -108,26 +109,18 @@
} }
} }
h6{ h6{
// flex: 1 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
flex: 0 0 40%; flex: 0 0 40%;
// padding-right: 2rem;
margin-top: 1rem; margin-top: 1rem;
margin-bottom: 2rem !important; margin-bottom: 2rem !important;
width: fit-content; width: fit-content;
color: white; color: white;
background: black; background: black;
// padding-left: 0.5rem;
text-transform: uppercase; text-transform: uppercase;
font-size: 0.6rem; font-size: 0.6rem;
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
// margin: auto;
// padding-bottom: 2rem;
// @media(max-width: 1090px){
// padding-top: 0 ;
// margin-top: 0;
// }
a{ a{
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;

3
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/partenaires.scss
View File

@ -19,6 +19,9 @@
font-size: 2rem; font-size: 2rem;
font-weight: 500; font-weight: 500;
} }
.field_intro{
visibility: visible;
}
} }
.views-element-container{ .views-element-container{
&::before{ &::before{

463
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/actu-caroussel-home.scss
View File

@ -34,258 +34,287 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
} .views-row{
display: flex;
.views-row{ margin: auto;
display: flex; width: 100%;
margin: auto; font-size: 0.5rem;
width: 100%; margin-top: 1rem;
font-size: 0.5rem; margin-bottom: 1rem;
margin-top: 1rem; padding-bottom: 1rem;
margin-bottom: 1rem; display: flex;
padding-bottom: 1rem; flex-direction: row;
display: flex; align-items: center;
flex-direction: row; border-bottom: solid black 0.5px;
align-items: center; .node-type-actualite{
border-bottom: solid black 0.5px; width: 85%;
.node-type-actualite{ // padding-bottom: 2rem;
width: 85%;
// padding-bottom: 2rem; .content-wrapper-actu{
display: grid;
.content-wrapper-actu{ grid-template-columns: 1fr 2fr;
display: grid; grid-template-rows: repeat(5 1fr);
grid-template-columns: 1fr 2fr; .field_field_images{
grid-template-rows: repeat(5 1fr); grid-column: 1;
.field_field_images{ grid-row: 1 /span 5;
grid-column: 1; width: 250px;
grid-row: 1 /span 5; // display: flex;
width: 250px; // margin: auto;
// display: flex;
// margin: auto;
margin-right: 1rem;
.actu-diaporama{
// height: 150px;
width: 100%;
display: flex;
flex-direction: row;
align-items: center !important;
margin:auto;
margin-right: 1rem; margin-right: 1rem;
.slick-list{
margin: auto; .actu-diaporama{
padding-top: 0 !important; // height: 150px;
.cadre-img-zoom{ width: 100%;
display: flex; display: flex;
flex-direction: row;
align-items: center !important;
margin:auto;
margin-right: 1rem;
.slick-list{
margin: auto; margin: auto;
width: 250px; padding-top: 0 !important;
height: auto; .cadre-img-zoom{
img{ display: flex;
width: 100%; margin: auto;
width: 250px;
height: auto; height: auto;
object-fit: cover; img{
-moz-border-radius: 9px; /* pour Mozilla */ width: 100%;
-khtml-border-radius: 9px; /* pour Safari et Chrome */ height: auto;
-webkit-border-radius: 9px; /* pour Safari sur Mac */ object-fit: cover;
border-radius: 9px; /* CSS3 */ -moz-border-radius: 9px; /* pour Mozilla */
-khtml-border-radius: 9px; /* pour Safari et Chrome */
-webkit-border-radius: 9px; /* pour Safari sur Mac */
border-radius: 9px; /* CSS3 */
}
}
blockquote.image-field-caption{
margin: 0;
p{
margin-top: 0;
font-size: 0.4rem;
}
} }
} }
blockquote.image-field-caption{ button{
margin: 0; margin: auto;
p{ transform: none;
margin-top: 0; top: 30%;
font-size: 0.4rem; height: 0;
} width: 0;
&:before{
} transform: scale(0.4) !important;
} &:hover{
button{ filter: brightness(1.75);
margin: auto; }
transform: none;
top: 30%;
height: 0;
width: 0;
&:before{
transform: scale(0.4) !important;
&:hover{
filter: brightness(1.75);
} }
} }
} button.slick-next{
button.slick-next{ right: 15% ;
right: 15% ; padding: 0;
padding: 0; }
} button.slick-prev{
button.slick-prev{ left: 5%;
left: 5%; padding: 0;
padding: 0; }
} }
} }
} .field_field_type_d_actualite,
.field_field_type_d_actualite, .field_field_date,
.field_field_date, .field_field_site,
.field_field_site, .field_title,
.field_title, .field_body,
.field_body, .field_field_liens{
.field_field_liens{ grid-column: 2;
grid-column: 2;
}
} .field_field_type_d_actualite{
.field_field_type_d_actualite{ order: 2;
order: 2; a{
a{ text-transform: uppercase;
text-transform: uppercase; color: red;
color: red; font-size: 0.6rem;
font-size: 0.6rem; font-weight: 600;
font-weight: 600; display: inline-flex;
display: inline-flex; align-items: center;
align-items: center; &::before{
&::before{ content: "";
content: ""; display: inline-block;
display: inline-block; width: 16px; /* Ajuste la largeur */
width: 16px; /* Ajuste la largeur */ height: 16px; /* Ajuste la hauteur */
height: 16px; /* Ajuste la hauteur */ background-image: url('../img/type-actu.svg');
background-image: url('../img/type-actu.svg'); background-size: contain;
background-size: contain; background-repeat: no-repeat;
background-repeat: no-repeat; // margin-right: 0.4rem;
// margin-right: 0.4rem; padding-right: 0.4rem;
padding-right: 0.4rem; }
} }
} }
} .field_field_date{
.field_field_date{ order: 3;
order: 3;
color: red;
font-size: 0.6rem;
font-weight: 600;
display: inline-flex;
align-items: center;
// margin-left: 1rem;
&::before{
content: "";
display: inline-block;
width: 16px; /* Ajuste la largeur */
height: 16px; /* Ajuste la hauteur */
background-image: url('../img/date-actu.svg');
background-size: contain;
background-repeat: no-repeat;
// margin-right: 0.4rem;
padding-right: 0.4rem;
}
}
.field_field_site{
order: 4;
a{
color: red; color: red;
font-size: 0.6rem; font-size: 0.6rem;
font-weight: 600; font-weight: 600;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
// margin-left: 1rem; // margin-left: 1rem;
padding-left: 0.2rem;
&::before{ &::before{
content: ""; content: "";
display: inline-block; display: inline-block;
width: 10px; /* Ajuste la largeur */ width: 16px; /* Ajuste la largeur */
height: 10px; /* Ajuste la hauteur */ height: 16px; /* Ajuste la hauteur */
background-image: url("../img/map_pointer.svg"); background-image: url('../img/date-actu.svg');
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
// margin-right: 0.4rem; // margin-right: 0.4rem;
padding-right: 0.5rem; padding-right: 0.4rem;
} }
} }
} .field_field_site{
.field_title{ order: 4;
order: 5; a{
line-height: 1rem; color: red;
a{ font-size: 0.6rem;
color: $blue_QDD; font-weight: 600;
font-size: 1.2rem;
// pointer-events: none;
// cursor: default;
}
h2{
margin-top: 0.5rem;
margin-bottom: 0;
padding-left: 0;
font-family: 'gilroy-medium';
}
}
.field_field_sous_titre{
color: $blue_QDD;
font-family: 'gilroy-light';
font-size: 1.2rem;
}
.field_body {
order: 6;
// padding-bottom: 1rem;
opacity: 1 !important;
transform:none !important;
font-family: 'gilroy-light';
p{
font-size: 0.8rem;
}
}
.field_field_liens{
order: 7;
padding:0;
width: fit-content;
a{
display: flex;
flex-direction: row;
padding-left: 0.5rem;
padding-top: 0.2rem;
padding-bottom: 0.2rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
margin-bottom: 0.5rem;
svg{
display: none;
}
&::after{
display: inline-flex; display: inline-flex;
content: url("../img/noun-arrow-to-right.svg"); align-items: center;
padding-right: 0.2rem; // margin-left: 1rem;
padding-left: 0.2rem; padding-left: 0.2rem;
&::before{
content: "";
display: inline-block;
width: 10px; /* Ajuste la largeur */
height: 10px; /* Ajuste la hauteur */
background-image: url("../img/map_pointer.svg");
background-size: contain;
background-repeat: no-repeat;
// margin-right: 0.4rem;
padding-right: 0.5rem;
}
} }
} }
.field_title{
order: 5;
line-height: 1rem;
a{
color: $blue_QDD;
font-size: 1.2rem;
// pointer-events: none;
// cursor: default;
}
h2{
margin-top: 0.5rem;
margin-bottom: 0;
padding-left: 0;
font-family: 'gilroy-medium';
}
}
.field_field_sous_titre{
color: $blue_QDD;
font-family: 'gilroy-light';
font-size: 1.2rem;
}
.field_body {
order: 6;
// padding-bottom: 1rem;
opacity: 1 !important;
transform:none !important;
font-family: 'gilroy-light';
p{
font-size: 0.8rem;
}
}
.field_field_liens{
order: 7;
padding:0;
width: fit-content;
a{
display: flex;
flex-direction: row;
padding-left: 0.5rem;
padding-top: 0.2rem;
padding-bottom: 0.2rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
margin-bottom: 0.5rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
}
}
} }
} }
} .toggle-actualite {
.toggle-actualite { display: block;
display: block; width: 40px;
width: 40px; height: 40px;
height: 40px; margin: 10px auto;
margin: 10px auto; border: none;
border: none; background-color: transparent;
background-color: transparent; background-image: url("/themes/custom/quartiers_de_demain/dist/assets/img/fleche-bas.svg");
background-image: url("/themes/custom/quartiers_de_demain/dist/assets/img/fleche-bas.svg"); background-size: contain;
background-size: contain; background-repeat: no-repeat;
background-repeat: no-repeat; background-position: center;
background-position: center; cursor: pointer;
cursor: pointer; transition: transform 0.3s ease;
transition: transform 0.3s ease; }
}
.toggle-actualite.open {
.toggle-actualite.open { transform: rotate(180deg);
transform: rotate(180deg); }
}
}
} }
footer #block-block-content764294aa-409f-4668-88bf-dc71e186915c{
display: flex;
.field_field_link{
width: fit-content;
margin: auto;
a{
display: flex;
flex-direction: row;
padding-left: 0.5rem;
// padding-top: 0.2rem;
// padding-bottom: 0.2rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
margin-bottom: 0.5rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
}
}
}
} }
} }