responsive page /ressource

This commit is contained in:
2025-10-07 13:42:11 +02:00
parent b52522fa33
commit 2b3e19430c
2 changed files with 64 additions and 6 deletions
+35 -1
View File
@@ -3433,15 +3433,38 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
grid-template-rows: repeat(2, auto); grid-template-rows: repeat(2, auto);
padding-top: 3rem; padding-top: 3rem;
} }
@media (max-width: 510px) {
.node-type-ressource {
display: flex;
flex-direction: column;
padding-top: 0;
}
}
.node-type-ressource .image-ressource { .node-type-ressource .image-ressource {
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 2;
margin-right: 2rem; margin-right: 2rem;
} }
.node-type-ressource .image-ressource img { @media (max-width: 510px) {
.node-type-ressource .image-ressource {
width: 100%;
}
}
@media (max-width: 510px) {
.node-type-ressource .image-ressource .field__item {
display: flex;
width: 100%;
}
}
.node-type-ressource .image-ressource .field__item img {
height: 400px; height: 400px;
width: auto; width: auto;
} }
@media (max-width: 510px) {
.node-type-ressource .image-ressource .field__item img {
margin: auto;
}
}
.node-type-ressource .infos-content { .node-type-ressource .infos-content {
grid-row: 1; grid-row: 1;
grid-column: 3/span 4; grid-column: 3/span 4;
@@ -3449,6 +3472,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
border: none; border: none;
background-color: transparent; background-color: transparent;
} }
@media (max-width: 510px) {
.node-type-ressource .infos-content {
width: 85%;
}
}
.node-type-ressource .infos-content .field--name-field-type-de-ressource { .node-type-ressource .infos-content .field--name-field-type-de-ressource {
text-transform: uppercase; text-transform: uppercase;
font-size: 1rem; font-size: 1rem;
@@ -3489,6 +3517,12 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 100%; width: 100%;
margin-top: 2rem; margin-top: 2rem;
} }
@media (max-width: 510px) {
.node-type-ressource .body-content {
width: 80%;
margin: auto;
}
}
.node-type-ressource .body-content .field--name-field-fichiers { .node-type-ressource .body-content .field--name-field-fichiers {
width: fit-content; width: fit-content;
} }
@@ -9,16 +9,33 @@
// #block-reha-titredepage{ // #block-reha-titredepage{
// display: block !important; // display: block !important;
// } // }
@media (max-width:510px){
display: flex;
flex-direction: column;
padding-top: 0;
}
.image-ressource{ .image-ressource{
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 2;
margin-right: 2rem; margin-right: 2rem;
@media (max-width:510px){
img{ width: 100%;
height: 400px;
width: auto;
} }
.field__item{
@media (max-width:510px){
display: flex;
width: 100%;
}
img{
height: 400px;
width: auto;
@media (max-width:510px){
margin: auto;
}
}
}
} }
.infos-content{ .infos-content{
grid-row: 1; grid-row: 1;
@@ -26,6 +43,9 @@
margin-left: 2rem; margin-left: 2rem;
border: none; border: none;
background-color:transparent; background-color:transparent;
@media(max-width:510px){
width: 85%;
}
.field--name-field-type-de-ressource{ .field--name-field-type-de-ressource{
text-transform: uppercase; text-transform: uppercase;
font-size: 1rem; font-size: 1rem;
@@ -66,6 +86,10 @@
grid-column: 2 /span 3; grid-column: 2 /span 3;
width: 100%; width: 100%;
margin-top: 2rem; margin-top: 2rem;
@media (max-width:510px){
width: 80%;
margin: auto;
}
.field--name-field-fichiers{ .field--name-field-fichiers{
width: fit-content; width: fit-content;
} }