@media caroussel ressouce image

This commit is contained in:
2025-06-08 23:17:57 +02:00
parent 309e9ffd83
commit f19639719e
4 changed files with 176 additions and 7 deletions
+61
View File
@@ -5882,6 +5882,11 @@ svg.ext {
display: flex;
}
}
@media screen and (max-width: 810px) {
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top {
margin-left: 0;
}
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block {
margin-left: 0;
}
@@ -6007,9 +6012,65 @@ svg.ext {
opacity: 1;
z-index: 1;
}
@media screen and (max-width: 810px) {
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel {
display: flex;
flex-direction: column;
gap: 2rem;
align-items: center;
width: 100vw;
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .carousel .main-image-block {
width: 90%;
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .thumbnails-wrapper {
width: 100%;
display: flex !important;
flex-direction: row !important; /* 👈 corrige l'orientation */
justify-content: center;
align-items: center;
overflow-x: auto;
overflow-y: hidden;
max-height: none;
padding: 1rem 0;
position: relative;
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .thumbnails {
display: flex !important;
flex-direction: row !important; /* 👈 force l'alignement horizontal */
gap: 0.8 rem !important;
overflow-x: auto;
overflow-y: hidden;
scroll-behavior: smooth;
padding: 0 1rem;
max-width: 100%;
flex-wrap: nowrap;
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .thumbnails::-webkit-scrollbar {
display: none;
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .thumbnails img {
width: 60px;
height: 45px;
flex-shrink: 0; /* évite l’écrasement */
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .thumb-arrow {
display: none; /* inutile si scroll horizontal */
}
}
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-images .field__items {
display: none;
}
@media screen and (max-width: 810px) {
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource,
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodetitle,
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-edition,
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s-,
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution,
.page-node-type-ressource .type-les-projets-en-images.layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
margin-left: 7%;
}
}
body.type-media-reportage-photos .block-region-third .block-entity-fieldnodefield-projets-liee {
transform: translateY(-45.5rem);