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) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale h2 {
margin-left: 0;
margin-left: 2rem;
text-align: left;
line-height: 4rem;
}
@@ -5315,14 +5315,14 @@ svg.ext {
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block {
margin-left: 0;
width: 90%;
margin-left: 2rem;
width: 85%;
}
}
@media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-config-pages-block {
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 {
@@ -5331,7 +5331,6 @@ svg.ext {
@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 {
padding-top: 1rem;
padding-left: 2rem;
margin-top: 1rem;
}
}
@@ -5711,6 +5710,11 @@ svg.ext {
width: 110vw;
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) > * {
position: relative;
z-index: 1;
@@ -5729,6 +5733,12 @@ svg.ext {
@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 {
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 {
@@ -5773,7 +5783,12 @@ svg.ext {
@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 {
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 {
@@ -5797,18 +5812,31 @@ svg.ext {
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 {
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 {
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 {
content: url("../images/pictos/fleche-droite-dans-rond.png");
display: block;
display: inline-block;
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-next.slick-disabled::before {
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 {
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 {
display: none;
@@ -6804,6 +6845,11 @@ article.node-type-ressource .wrapper-ressource .field--name-title h2 a {
font-weight: 900;
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- {
grid-column: 2;
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 {
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: [{
breakpoint: 810,
settings: {
slidesToShow: 3,
arrows: true,
slidesToShow: 1,
dots: true,
arrows: false,
draggable: true,
centerMode: false,
centerMode: true,
}
}]
});
@@ -20,7 +20,7 @@
margin-left: 28%;
@media (max-width:810px) {
margin-left: 0;
margin-left: 2rem;
text-align: left;
line-height: 4rem;
}
@@ -43,19 +43,20 @@
margin: auto;
margin-left: 28%;
@media (max-width:810px) {
margin-left: 0;
width: 90%;
margin-left: 2rem;
width: 85%;
}
@media (max-width:479px) {
order: 1;
margin-left: 0;
margin-left: 2rem;
// margin-right: 2rem;
}
.config_pages--base-de-donnees--full{
grid-column: 1 / span 5;
@media (max-width: 810px){
padding-top: 1rem;
padding-left: 2rem;
// padding-left: 2rem;
margin-top:1rem;
}
@media (max-width: 479px){
@@ -486,6 +487,9 @@
height: 100%;
width: 110vw;
z-index: 0;
@media (max-width: 810px){
left: 0;
}
}
> * {
position: relative;
@@ -505,6 +509,10 @@
margin-block: 0em;
@media (max-width: 810px){
padding-left: 2rem;
width: 70%;
}
@media (max-width: 479px){
width: 65% !important;
}
}
h3.type-publications-issues-du-programme-eqld {
@@ -518,6 +526,7 @@
&:before{
content:url("../images/pictos/picto-ressource-paroleslaureats.svg");
padding-right: 1rem;
}
}
h3.type-les-projets-en-images {
@@ -525,12 +534,14 @@
&:before{
content:url("../images/pictos/picto-ressource-projetsimages.svg");
padding-right: 1rem;
}
}
h3.type-presse {
&:before{
content:url("../images/pictos/picto-ressource-presse.svg");
padding-right: 1rem;
}
}
@@ -557,7 +568,11 @@
}
@media (max-width: 810px){
left: 81vw;
top: -4.3rem;
// top: -4.3rem;
}
@media (max-width: 479px){
left: 76vw;
top: -1.5rem;
}
}
@@ -580,19 +595,29 @@
padding-left: 2rem;
flex-direction: column;
.views-row{
width: 100%;
width: 100% !important;
}
}
.slick-next::before{
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{
content:url("../images/pictos/fleche-droite-dans-rond.png");
display: block;
display: inline-block;
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-next.slick-disabled::before{
@@ -601,6 +626,20 @@
.slick-next {
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{
margin-bottom: 1rem ;
padding-right: 1rem;
h2{text-align: left !important}
h2{
text-align: left !important;
}
.ext{
color: black;
}
@@ -55,7 +57,9 @@ article.node-type-ressource{
font-weight: 900;
font-style: normal;
}
@media (max-width: 810px) {
line-height: 0 !important;
}
}
}
.field--name-field-auteur-s-{
@@ -253,45 +257,9 @@ article.node-type-ressource{
}
}
// &.type-les-projets-en-images{
// width: 500px !important;
// .wrapper-ressource{
// 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;
// }
article.node-type-ressource.type-les-projets-en-images .views-row-wrapper {
display: flex;
background: lawngreen;
}
// }
// }
}