responsive slide ressources

This commit is contained in:
2025-06-08 22:08:11 +02:00
parent c30d886bb7
commit 8c365d816a
5 changed files with 122 additions and 63 deletions
File diff suppressed because one or more lines are too long
+58 -8
View File
@@ -5293,7 +5293,7 @@ svg.ext {
} }
@media (max-width: 810px) { @media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale h2 { .path-ressources .layout-content .region-content #block-contenudelapageprincipale h2 {
margin-left: 0; margin-left: 2rem;
text-align: left; text-align: left;
line-height: 4rem; line-height: 4rem;
} }
@@ -5315,14 +5315,14 @@ svg.ext {
} }
@media (max-width: 810px) { @media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block {
margin-left: 0; margin-left: 2rem;
width: 90%; width: 85%;
} }
} }
@media (max-width: 479px) { @media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block {
order: 1; order: 1;
margin-left: 0; margin-left: 2rem;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block .config_pages--base-de-donnees--full { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block .config_pages--base-de-donnees--full {
@@ -5331,7 +5331,6 @@ svg.ext {
@media (max-width: 810px) { @media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block .config_pages--base-de-donnees--full { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block .config_pages--base-de-donnees--full {
padding-top: 1rem; padding-top: 1rem;
padding-left: 2rem;
margin-top: 1rem; margin-top: 1rem;
} }
} }
@@ -5711,6 +5710,11 @@ svg.ext {
width: 110vw; width: 110vw;
z-index: 0; z-index: 0;
} }
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer)::before {
left: 0;
}
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) > * { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) > * {
position: relative; position: relative;
z-index: 1; z-index: 1;
@@ -5729,6 +5733,12 @@ svg.ext {
@media (max-width: 810px) { @media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) h3 { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) h3 {
padding-left: 2rem; padding-left: 2rem;
width: 70%;
}
}
@media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) h3 {
width: 65% !important;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) h3.type-publications-issues-du-programme-eqld { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) h3.type-publications-issues-du-programme-eqld {
@@ -5773,7 +5783,12 @@ svg.ext {
@media (max-width: 810px) { @media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .tout-voir { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .tout-voir {
left: 81vw; left: 81vw;
top: -4.3rem; }
}
@media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .tout-voir {
left: 76vw;
top: -1.5rem;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper {
@@ -5797,18 +5812,31 @@ svg.ext {
flex-direction: column; flex-direction: column;
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .views-row { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .views-row {
width: 100%; width: 100% !important;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next::before { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next::before {
content: url("../images/pictos/fleche-droite-dans-rond.png"); content: url("../images/pictos/fleche-droite-dans-rond.png");
display: block; display: inline-block;
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next::before {
transform: scale(0.5); /* Réduction à 50% */
transform-origin: top left; /* Point dancrage du redimensionnement */
}
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev::before { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev::before {
content: url("../images/pictos/fleche-droite-dans-rond.png"); content: url("../images/pictos/fleche-droite-dans-rond.png");
display: block; display: block;
display: inline-block;
transform: scaleX(-1); transform: scaleX(-1);
} }
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev::before {
transform: scale(-0.5, 0.5);
transform-origin: top right; /* Point dancrage du redimensionnement */
}
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev.slick-disabled::before, .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev.slick-disabled::before,
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next.slick-disabled::before { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next.slick-disabled::before {
opacity: 0 !important; opacity: 0 !important;
@@ -5816,6 +5844,19 @@ svg.ext {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next {
right: 10%; right: 10%;
} }
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev {
left: -10%;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-next {
right: 2%;
}
}
@media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-slide:not(footer) .views-row-wrapper .slick-prev {
left: -15%;
}
}
.carousel { .carousel {
display: none; display: none;
@@ -6804,6 +6845,11 @@ article.node-type-ressource .wrapper-ressource .field--name-title h2 a {
font-weight: 900; font-weight: 900;
font-style: normal; font-style: normal;
} }
@media (max-width: 810px) {
article.node-type-ressource .wrapper-ressource .field--name-title h2 {
line-height: 0 !important;
}
}
article.node-type-ressource .wrapper-ressource .field--name-field-auteur-s- { article.node-type-ressource .wrapper-ressource .field--name-field-auteur-s- {
grid-column: 2; grid-column: 2;
margin-top: 0.5rem; margin-top: 0.5rem;
@@ -6965,4 +7011,8 @@ article.node-type-ressource.type-paroles-de-laureats .wrapper-ressource .field--
} }
article.node-type-ressource.type-presse .field--name-field-images { article.node-type-ressource.type-presse .field--name-field-images {
display: none; display: none;
}
article.node-type-ressource article.node-type-ressource.type-les-projets-en-images .views-row-wrapper {
display: flex;
background: lawngreen;
} }
+5 -3
View File
@@ -122,10 +122,12 @@ jQuery(function ($) {
responsive: [{ responsive: [{
breakpoint: 810, breakpoint: 810,
settings: { settings: {
slidesToShow: 3, slidesToShow: 1,
arrows: true, dots: true,
arrows: false,
draggable: true, draggable: true,
centerMode: false, centerMode: true,
} }
}] }]
}); });
@@ -20,7 +20,7 @@
margin-left: 28%; margin-left: 28%;
@media (max-width:810px) { @media (max-width:810px) {
margin-left: 0; margin-left: 2rem;
text-align: left; text-align: left;
line-height: 4rem; line-height: 4rem;
} }
@@ -43,19 +43,20 @@
margin: auto; margin: auto;
margin-left: 28%; margin-left: 28%;
@media (max-width:810px) { @media (max-width:810px) {
margin-left: 0; margin-left: 2rem;
width: 90%; width: 85%;
} }
@media (max-width:479px) { @media (max-width:479px) {
order: 1; order: 1;
margin-left: 0; margin-left: 2rem;
// margin-right: 2rem;
} }
.config_pages--base-de-donnees--full{ .config_pages--base-de-donnees--full{
grid-column: 1 / span 5; grid-column: 1 / span 5;
@media (max-width: 810px){ @media (max-width: 810px){
padding-top: 1rem; padding-top: 1rem;
padding-left: 2rem; // padding-left: 2rem;
margin-top:1rem; margin-top:1rem;
} }
@media (max-width: 479px){ @media (max-width: 479px){
@@ -486,6 +487,9 @@
height: 100%; height: 100%;
width: 110vw; width: 110vw;
z-index: 0; z-index: 0;
@media (max-width: 810px){
left: 0;
}
} }
> * { > * {
position: relative; position: relative;
@@ -505,6 +509,10 @@
margin-block: 0em; margin-block: 0em;
@media (max-width: 810px){ @media (max-width: 810px){
padding-left: 2rem; padding-left: 2rem;
width: 70%;
}
@media (max-width: 479px){
width: 65% !important;
} }
} }
h3.type-publications-issues-du-programme-eqld { h3.type-publications-issues-du-programme-eqld {
@@ -518,6 +526,7 @@
&:before{ &:before{
content:url("../images/pictos/picto-ressource-paroleslaureats.svg"); content:url("../images/pictos/picto-ressource-paroleslaureats.svg");
padding-right: 1rem; padding-right: 1rem;
} }
} }
h3.type-les-projets-en-images { h3.type-les-projets-en-images {
@@ -525,12 +534,14 @@
&:before{ &:before{
content:url("../images/pictos/picto-ressource-projetsimages.svg"); content:url("../images/pictos/picto-ressource-projetsimages.svg");
padding-right: 1rem; padding-right: 1rem;
} }
} }
h3.type-presse { h3.type-presse {
&:before{ &:before{
content:url("../images/pictos/picto-ressource-presse.svg"); content:url("../images/pictos/picto-ressource-presse.svg");
padding-right: 1rem; padding-right: 1rem;
} }
} }
@@ -557,7 +568,11 @@
} }
@media (max-width: 810px){ @media (max-width: 810px){
left: 81vw; left: 81vw;
top: -4.3rem; // top: -4.3rem;
}
@media (max-width: 479px){
left: 76vw;
top: -1.5rem;
} }
} }
@@ -580,19 +595,29 @@
padding-left: 2rem; padding-left: 2rem;
flex-direction: column; flex-direction: column;
.views-row{ .views-row{
width: 100%; width: 100% !important;
} }
} }
.slick-next::before{ .slick-next::before{
content:url("../images/pictos/fleche-droite-dans-rond.png"); content:url("../images/pictos/fleche-droite-dans-rond.png");
display: block; // display: block;
display: inline-block;
@media (max-width: 810px){
transform: scale(0.5); /* Réduction à 50% */
transform-origin: top left; /* Point dancrage du redimensionnement */
}
} }
.slick-prev::before{ .slick-prev::before{
content:url("../images/pictos/fleche-droite-dans-rond.png"); content:url("../images/pictos/fleche-droite-dans-rond.png");
display: block; display: block;
display: inline-block;
transform: scaleX(-1); transform: scaleX(-1);
// display: none; @media (max-width: 810px){
transform: scale(-0.5, 0.5);
transform-origin: top right; /* Point dancrage du redimensionnement */
}
} }
.slick-prev.slick-disabled::before, .slick-prev.slick-disabled::before,
.slick-next.slick-disabled::before{ .slick-next.slick-disabled::before{
@@ -601,6 +626,20 @@
.slick-next { .slick-next {
right: 10%; right: 10%;
} }
@media (max-width: 810px){
.slick-prev {
left: -10%;
}
.slick-next{
right: 2%;
}
}
@media (max-width: 479px){
.slick-prev {
left: -15%;
}
}
} }
} }
} }
@@ -1,7 +1,9 @@
article.node-type-ressource{ article.node-type-ressource{
margin-bottom: 1rem ; margin-bottom: 1rem ;
padding-right: 1rem; padding-right: 1rem;
h2{text-align: left !important} h2{
text-align: left !important;
}
.ext{ .ext{
color: black; color: black;
} }
@@ -55,7 +57,9 @@ article.node-type-ressource{
font-weight: 900; font-weight: 900;
font-style: normal; font-style: normal;
} }
@media (max-width: 810px) {
line-height: 0 !important;
}
} }
} }
.field--name-field-auteur-s-{ .field--name-field-auteur-s-{
@@ -253,45 +257,9 @@ article.node-type-ressource{
} }
} }
// &.type-les-projets-en-images{ article.node-type-ressource.type-les-projets-en-images .views-row-wrapper {
// width: 500px !important; display: flex;
// .wrapper-ressource{ background: lawngreen;
// display: grid; }
// grid-template-columns: 3fr 1fr;
// // grid-template-rows: repeat(5, 1fr);
// .field--name-field-type-de-ressource{
// order: 2;
// grid-row: 2;
// grid-column: 1 /span 2;
// margin-bottom: 0.5rem;
// }
// .field--name-field-type-de-media{
// order: 1;
// grid-row: 1;
// grid-column: 1 /span 2;
// }
// .field--name-field-images{
// order: 3;
// grid-column: 1 ;
// grid-row: 3 /span 5;
// height: auto;
// // width: 90%;
// width: 400px !important;
// img{
// height: auto;
// width: 90%;
// border: 1px solid #a3a3a3;
// }
// }
// .field--name-title,
// .field--name-field-sous-titre,
// .field--name-field-auteur-s-,
// .field--name-field-edition,
// .field--name-field-date-de-parution,
// .field--name-field-mots-clefs{
// grid-column: 2;
// }
// }
// }
} }