responsive page programme

This commit is contained in:
2025-10-07 12:15:28 +02:00
parent 43236af036
commit 8599dc1377
4 changed files with 92 additions and 41 deletions
+32 -1
View File
@@ -194,7 +194,7 @@
} }
@media (max-width: 500px) { @media (max-width: 500px) {
.layout-content { .layout-content {
padding-top: 0; padding-top: 2rem;
} }
} }
.layout-content .layout__region--first { .layout-content .layout__region--first {
@@ -203,6 +203,12 @@
.layout-content .layout__region--second { .layout-content .layout__region--second {
flex: 0 1 75%; flex: 0 1 75%;
} }
@media (max-width: 810px) {
.layout-content .layout__region--second {
flex: 0 1 90%;
margin: auto;
}
}
.layout-content .layout__region--second.view-id-home { .layout-content .layout__region--second.view-id-home {
margin: 0; margin: 0;
} }
@@ -2456,6 +2462,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 40%; width: 40%;
} }
} }
@media (max-width: 810px) {
.page-sitespilotes .view-display-id-page_1 .views-row {
width: 100%;
}
}
.page-sitespilotes .view-display-id-page_1 .views-row:hover { .page-sitespilotes .view-display-id-page_1 .views-row:hover {
transform: scale(1.05); transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease; transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -2595,6 +2606,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
.page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row:hover { .page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row:hover {
transform: none; transform: none;
} }
@media (max-width: 810px) {
.page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row {
width: 100%;
}
}
.page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site { .page-sitespilotes .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site {
margin: auto; margin: auto;
display: flex; display: flex;
@@ -2885,6 +2901,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
margin-top: 0.6rem; margin-top: 0.6rem;
border-bottom: #fdc300 solid 2px; border-bottom: #fdc300 solid 2px;
} }
@media (max-width: 810px) {
.page-programme .layout__region--first .block-region-first {
display: none;
}
}
.page-programme .block-region-second h2 { .page-programme .block-region-second h2 {
font-weight: 1000; font-weight: 1000;
font-size: 1.8rem; font-size: 1.8rem;
@@ -2893,11 +2914,21 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 80%; width: 80%;
font-size: 1.2rem; font-size: 1.2rem;
} }
@media (max-width: 810px) {
.page-programme .block-region-second .block-views-blockhome-block-1 {
width: 100%;
}
}
.page-programme .block-region-second .view-display-id-block_1 { .page-programme .block-region-second .view-display-id-block_1 {
margin: 0; margin: 0;
width: 80%; width: 80%;
padding-top: 1rem; padding-top: 1rem;
} }
@media (max-width: 810px) {
.page-programme .block-region-second .view-display-id-block_1 {
width: 100%;
}
}
.page-programme .block-region-second .block-config-pages-block { .page-programme .block-region-second .block-config-pages-block {
margin: 0; margin: 0;
width: 80%; width: 80%;
@@ -43,13 +43,17 @@ $width-menu-slidedown : 550px;
width: 90%; width: 90%;
} }
@media (max-width:500px) { @media (max-width:500px) {
padding-top: 0; padding-top: 2rem;
} }
.layout__region--first{ .layout__region--first{
flex: 0 1 25%; flex: 0 1 25%;
} }
.layout__region--second{ .layout__region--second{
flex: 0 1 75%; flex: 0 1 75%;
@media (max-width:810px){
flex: 0 1 90%;
margin: auto;
}
&.view-id-home{ &.view-id-home{
margin: 0; margin: 0;
} }
@@ -46,6 +46,9 @@
} }
} }
} }
@media (max-width:810px){
display: none;
}
} }
} }
.block-region-second{ .block-region-second{
@@ -56,59 +59,66 @@
.block-views-blockhome-block-1{ .block-views-blockhome-block-1{
width: 80%; width: 80%;
font-size: 1.2rem; font-size: 1.2rem;
@media (max-width:810px){
width: 100%;
}
} }
.view-display-id-block_1{ .view-display-id-block_1{
margin: 0; margin: 0;
width: 80%; width: 80%;
padding-top: 1rem; padding-top: 1rem;
} @media (max-width:810px){
.block-config-pages-block{
margin: 0;
width: 80%;
padding-top: 1rem;
.config_pages--partenaires--full{
.paragraph--type--partenaire{
width: 100%; width: 100%;
padding-bottom: 3rem; }
height: 205px; }
display: flex;
flex-direction: column;
flex-wrap: wrap; .block-config-pages-block{
justify-content: center; margin: 0;
align-content: baseline; width: 80%;
@media (max-width: 810px){ padding-top: 1rem;
.config_pages--partenaires--full{
.paragraph--type--partenaire{
width: 100%;
padding-bottom: 3rem;
height: 205px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} flex-wrap: wrap;
.paragraph--type--partenaire>* { justify-content: center;
flex: 1 1 80px; align-content: baseline;
} @media (max-width: 810px){
.field--name-field-logo{ display: flex;
width: fit-content; flex-direction: column;
padding-right: 1rem; }
} .paragraph--type--partenaire>* {
.field--name-field-nom{ flex: 1 1 80px;
font-weight: 900; }
font-size: 1.2rem .field--name-field-logo{
} width: fit-content;
.field--name-field-texte{ padding-right: 1rem;
.field__item{ }
p{ .field--name-field-nom{
strong{ font-weight: 900;
background-color: none; font-size: 1.2rem
}
.field--name-field-texte{
.field__item{
p{
strong{
background-color: none;
}
} }
} }
} }
.field--name-field-lien{
background-color: none;
}
} }
.field--name-field-lien{
background-color: none;
}
} }
} }
} }
}
} }
@@ -29,6 +29,9 @@
@media (max-width:1200px){ @media (max-width:1200px){
width: 40%; width: 40%;
} }
@media (max-width:810px){
width: 100%;
}
&:hover{ &:hover{
transform: scale(1.05); transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease; transition: 0.3s transform ease, 0.3s box-shadow ease;
@@ -170,6 +173,9 @@
&:hover{ &:hover{
transform: none; transform: none;
} }
@media (max-width:810px){
width: 100%;
}
.node-type-site{ .node-type-site{
margin: auto; margin: auto;
display: flex; display: flex;