From 1cf91ac32ec7fedd5fe2f01eef3a26f50feaa7b4 Mon Sep 17 00:00:00 2001 From: ouidade Date: Thu, 27 Jun 2024 14:30:05 +0200 Subject: [PATCH] =?UTF-8?q?ressources=20&=20actualit=C3=A9s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/themes/custom/reha/dist/css/bundle.css | 302 +++++++++++++++++- .../custom/reha/scss/pages/actualites.scss | 2 +- .../reha/scss/pages/les-sites-pilotes.scss | 265 +++++++++++++++ .../custom/reha/scss/pages/ressources.scss | 43 ++- 4 files changed, 586 insertions(+), 26 deletions(-) diff --git a/web/themes/custom/reha/dist/css/bundle.css b/web/themes/custom/reha/dist/css/bundle.css index a583b09..323d477 100644 --- a/web/themes/custom/reha/dist/css/bundle.css +++ b/web/themes/custom/reha/dist/css/bundle.css @@ -1940,6 +1940,254 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div margin-top: 2rem; } +.page-actualites h1 { + width: 80%; + margin: auto; + font-weight: 1000; +} +.page-actualites .view-display-id-page_1 { + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: baseline; + justify-content: space-between; +} +.page-actualites .view-display-id-page_1 article { + padding-bottom: 0.7rem; +} +.page-actualites .view-display-id-page_1 .views-row { + width: 28%; + padding: 1rem; +} +.page-actualites .view-display-id-page_1 .views-row:hover { + transform: scale(1.05); + transition: 0.3s transform ease, 0.3s box-shadow ease; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site { + margin: auto; + display: flex; + flex-direction: column; + width: 100%; + background-color: white; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .field--name-field-image { + order: 1; + max-width: 100%; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .field--name-field-image img { + width: 100%; + object-fit: cover; + height: fit-content; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site { + background-color: rgb(255, 255, 255); + order: 2; + display: flex; + flex-direction: column; + padding-left: 1rem; + padding-right: 1rem; + padding-top: 0.5rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site h1 { + display: none; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site h2 { + order: 2; + margin: 0; + font-size: 1.6rem; + font-weight: 900; + line-height: 1; + padding-bottom: 0.8rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row { + order: 1; + display: flex; + flex-direction: row; + align-items: end; + padding-bottom: 0.5rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-numero-site { + order: 1; + text-transform: uppercase; + font-size: 1rem; + display: inline-flex; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-numero-site::after { + content: "|"; + padding-left: 1rem; + padding-right: 1rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site { + order: 3; + font-size: 1.2rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site .field__item { + display: flex; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site .address { + margin: 0; + display: inline-flex; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site .address .postal-code { + order: 2; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site .address .locality { + order: 1; + text-transform: capitalize; + margin-right: 0.5rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site .address .country { + display: none; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .field--name-field-architecte { + order: 4; + font-size: 1.2rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .field--name-field-architecte .field__items { + display: flex; + flex-direction: row; + flex-wrap: wrap; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .field--name-field-architecte .field__items .field__item { + display: inline; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .field--name-field-architecte .field__items .field__item::after { + content: ","; + padding-right: 0.5rem; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site .field--name-field-architecte .field__item:last-of-type::after { + content: ""; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site ul.links { + order: 5; + text-transform: uppercase; + padding: 0; + margin: 0; + border: none; + padding-bottom: 1rem; + padding-top: 3rem; + display: inline-flex; +} +.page-actualites .view-display-id-page_1 .views-row .node-type-site .infos-content-site ul.links::after { + content: url("../../dist/images/noun-arrow-1569918-black.svg"); + padding-left: 0.5rem; +} +.page-actualites .view-display-id-page_1 footer { + background-color: transparent; + text-transform: none !important; +} +.page-actualites .view-display-id-page_1 footer p { + font-size: 2rem; + padding-left: 1rem; + font-weight: 1000; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 { + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: baseline; + justify-content: space-between; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row { + width: 28%; + padding: 1rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row:hover { + transform: none; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site { + margin: auto; + display: flex; + flex-direction: column; + width: 100%; + background-color: transparent; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site { + background-color: transparent; + order: 2; + display: flex; + flex-direction: column; + padding-left: 1rem; + padding-right: 1rem; + padding-right: 1rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site h2 { + order: 2; + margin: 0; + font-size: 1.6rem; + font-weight: 900; + line-height: 1; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site h2 a { + cursor: default !important; + pointer-events: none; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row { + order: 1; + display: flex; + flex-direction: row; + align-items: center; + padding-bottom: 0.5rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-lettre-de-site { + order: 1; + text-transform: uppercase; + font-size: 1rem; + font-weight: 400; + display: flex; + align-items: center; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-lettre-de-site::before { + content: "SITE"; + padding-right: 0.5rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-lettre-de-site::after { + content: "|"; + padding-left: 1rem; + padding-right: 1rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site { + order: 3; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site p.address { + padding-left: 0; + margin: 0; + display: inline-flex; + font-size: 1.3rem; + font-weight: 500 !important; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site p.address .postal-code { + order: 2; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site p.address .locality { + order: 1; + text-transform: capitalize; + margin-right: 0.5rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .first-row .field--name-field-adresse-site p.address .country { + display: none; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site .field--name-field-architecte { + order: 4; + text-transform: capitalize; + font-weight: 400; + font-size: 1.2rem; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site ul.links { + order: 5; + text-transform: uppercase; + padding: 0; + margin: 0; + border: none; + padding-bottom: 2rem; + padding-top: 0.9rem; + display: inline-flex; +} +.page-actualites .view-display-id-page_1 footer .view-display-id-block_2 .views-row .node-type-site .infos-content-site ul.links::after { + content: url("../../dist/images/noun-arrow-1569918-black.svg"); + padding-left: 0.5rem; +} + .block-page-title-block { padding-left: 1rem; } @@ -2547,9 +2795,15 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div font-size: 1.3rem; } +.page-ressources h1 { + width: 80%; + margin: auto; +} .page-ressources .view-ressources { - flex-direction: column; + flex-direction: row; padding: 5rem; + width: 80%; + margin: auto; } .page-ressources .view-ressources #views-exposed-form-ressources-page-1 { width: 100%; @@ -2571,48 +2825,64 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div order: 3; } .page-ressources .view-ressources .views-row .node-type-ressource { - display: flex; - flex-direction: column; + width: 80%; + margin: auto; } -.page-ressources .view-ressources .views-row .node-type-ressource .field--name-field-image { +.page-ressources .view-ressources .views-row .node-type-ressource .image-ressource { order: 1; - max-width: 100%; + width: 90%; + margin: auto; } -.page-ressources .view-ressources .views-row .node-type-ressource .field--name-field-image img { - height: 200px; - width: auto; +.page-ressources .view-ressources .views-row .node-type-ressource .image-ressource img { + width: 100%; + height: auto; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content { display: flex; flex-direction: column; border: solid #fdc300 1px; background-color: rgb(255, 255, 255); padding: 1rem; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content h2 { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content h2 { order: 2; margin: 0; font-size: 1.5rem; font-weight: 600; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content .field--name-field-sous-titre { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-sous-titre { order: 3; font-size: 1.3rem; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content .field--name-field-auteur { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-auteur { order: 4; font-weight: 900; padding-top: 1rem; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content .field--name-field-type-de-ressource { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-type-de-ressource { order: 1; text-transform: uppercase; font-size: 1.2rem; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content .field--name-field-site { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-site { order: 5; + background-color: rgb(153, 147, 174); + color: white; + border-radius: 50px; + width: fit-content; + padding: 0.2rem 0.9rem; + margin-top: 1rem; } -.page-ressources .view-ressources .views-row .node-type-ressource .filtered-content ul.links { +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-site .field__item { + display: inline; +} +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content .field--name-field-site a { + color: white; + font-weight: 900; + font-size: 0.8rem; + vertical-align: top; +} +.page-ressources .view-ressources .views-row .node-type-ressource .infos-content ul.links { order: 6; display: none; } @@ -2705,10 +2975,10 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div .page-actualites .view-actus .views-row .node-type-actualite .infos-content .field--name-field-site { order: 5; background-color: rgb(153, 147, 174); - color: white; border-radius: 50px; width: fit-content; padding: 0.2rem 0.9rem; + margin-top: 1rem; } .page-actualites .view-actus .views-row .node-type-actualite .infos-content .field--name-field-site .field__item { display: inline; diff --git a/web/themes/custom/reha/scss/pages/actualites.scss b/web/themes/custom/reha/scss/pages/actualites.scss index 470ad9f..14a3806 100644 --- a/web/themes/custom/reha/scss/pages/actualites.scss +++ b/web/themes/custom/reha/scss/pages/actualites.scss @@ -50,10 +50,10 @@ .field--name-field-site{ order: 5; background-color: $gris-violet; - color: white; border-radius: 50px; width: fit-content; padding: 0.2rem 0.9rem; + margin-top: 1rem; .field__item{ display: inline; diff --git a/web/themes/custom/reha/scss/pages/les-sites-pilotes.scss b/web/themes/custom/reha/scss/pages/les-sites-pilotes.scss index d99483c..8fb0514 100644 --- a/web/themes/custom/reha/scss/pages/les-sites-pilotes.scss +++ b/web/themes/custom/reha/scss/pages/les-sites-pilotes.scss @@ -1,4 +1,269 @@ + +.page-actualites{ + h1{ + width: 80%; + margin: auto; + font-weight: 1000; + + } + .view-display-id-page_1{ + + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: baseline; + justify-content: space-between; + article{ + padding-bottom: 0.7rem; + } + .views-row{ + width: 28%; + padding: 1rem; + &:hover{ + transform: scale(1.05); + transition: 0.3s transform ease, 0.3s box-shadow ease; + } + .node-type-site{ + margin: auto; + display: flex; + flex-direction: column; + width: 100%; + background-color: white; + .field--name-field-image{ + order: 1; + max-width: 100%; + img{ + width: 100%; + object-fit: cover; + height: fit-content; + } + } + .infos-content-site{ + background-color: $white-button; + order: 2; + display: flex; + flex-direction: column; + padding-left: 1rem; + padding-right: 1rem; + padding-top: 0.5rem; + h1{display: none;} + h2{ + order: 2; + margin: 0; + font-size: 1.6rem; + font-weight: 900; + line-height: 1; + padding-bottom: 0.8rem; + } + .first-row{ + order: 1; + display:flex; + flex-direction: row; + align-items: end; + padding-bottom: 0.5rem; + .field--name-field-numero-site { + order: 1; + text-transform: uppercase; + font-size: 1rem; + display: inline-flex; + &::after{ + content: '|'; + padding-left: 1rem; + padding-right: 1rem; + } + } + .field--name-field-adresse-site{ + order: 3; + font-size: 1.2rem; + .field__item{ + display: flex; + } + .address{ + margin: 0; + display: inline-flex; + .postal-code{ + order: 2; + } + .locality{ + order: 1; + text-transform: capitalize; + margin-right: 0.5rem; + } + .country{ + display: none; + } + } + } + } + + .field--name-field-architecte{ + order: 4; + font-size: 1.2rem; + .field__items{ + display: flex; + flex-direction: row; + flex-wrap: wrap; + .field__item{ + display: inline; + &::after{ + content:','; + padding-right: 0.5rem; + } + + } + } + .field__item:last-of-type::after { + content: ''; + } + } + ul.links{ + order: 5; + text-transform: uppercase; + padding: 0; + margin: 0; + border: none; + padding-bottom: 1rem; + padding-top: 3rem; + display: inline-flex; + &::after{ + content:url("../../dist/images/noun-arrow-1569918-black.svg"); + padding-left: 0.5rem; + } + + } + + } + + } + } + + footer{ + background-color: transparent; + text-transform: none !important; + p{ + font-size: 2rem; + padding-left: 1rem; + font-weight: 1000; + } + .view-display-id-block_2{ + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: baseline; + justify-content: space-between; + .views-row{ + width: 28%; + padding: 1rem; + &:hover{ + transform: none; + } + .node-type-site{ + margin: auto; + display: flex; + flex-direction: column; + width: 100%; + background-color: transparent; + + .infos-content-site{ + background-color: transparent; + order: 2; + display: flex; + flex-direction: column; + padding-left: 1rem; + padding-right: 1rem;; + padding-right: 1rem; + h2{ + order: 2; + margin: 0; + font-size: 1.6rem; + font-weight: 900; + line-height: 1; + a{ + cursor: default !important; + pointer-events: none; + } + + } + .first-row{ + order: 1; + display:flex; + flex-direction: row; + align-items: center; + padding-bottom: 0.5rem; + .field--name-field-lettre-de-site { + order: 1; + text-transform: uppercase; + font-size: 1rem; + font-weight: 400; + display: flex; + align-items: center; + + &::before{ + content:'SITE'; + padding-right: 0.5rem; + } + &::after{ + content: '|'; + padding-left: 1rem; + padding-right: 1rem; + } + } + .field--name-field-adresse-site{ + order: 3; + + p.address{ + padding-left: 0; + margin: 0; + display: inline-flex; + font-size: 1.3rem; + font-weight: 500!important; + .postal-code{ + order: 2; + } + .locality{ + order: 1; + text-transform: capitalize; + margin-right: 0.5rem; + } + .country{ + display: none; + } + } + } + } + .field--name-field-architecte{ + order: 4; + text-transform: capitalize; + font-weight: 400; + font-size: 1.2rem; + + } + ul.links{ + order: 5; + text-transform: uppercase; + padding: 0; + margin: 0; + border: none; + padding-bottom: 2rem; + padding-top: 0.9rem; + display: inline-flex; + &::after{ + content:url("../../dist/images/noun-arrow-1569918-black.svg"); + padding-left: 0.5rem; + } + + } + + } + + } + } + } + } + } +} + .block-page-title-block{ padding-left: 1rem; h1{ diff --git a/web/themes/custom/reha/scss/pages/ressources.scss b/web/themes/custom/reha/scss/pages/ressources.scss index a7823c6..6815654 100644 --- a/web/themes/custom/reha/scss/pages/ressources.scss +++ b/web/themes/custom/reha/scss/pages/ressources.scss @@ -1,9 +1,14 @@ .page-ressources{ + h1{ + width: 80%; + margin: auto; + } .view-ressources{ - flex-direction: column; + flex-direction: row; padding: 5rem; - + width: 80%; + margin: auto; #views-exposed-form-ressources-page-1{ width: 100%; margin: auto; @@ -25,19 +30,22 @@ } } .views-row{ + .node-type-ressource{ - display: flex; - flex-direction: column; + + width: 80%; + margin: auto; - .field--name-field-image{ + .image-ressource{ order: 1; - max-width: 100%; + width: 90%; + margin: auto; img{ - height: 200px; - width: auto; + width: 100%; + height: auto; } } - .filtered-content{ + .infos-content{ display: flex; flex-direction: column; border: solid $yellow-puca 1px; @@ -66,7 +74,24 @@ font-size: 1.2rem; } .field--name-field-site{ + order: 5; + background-color: $gris-violet; + color: white; + border-radius: 50px; + width: fit-content; + padding: 0.2rem 0.9rem; + margin-top: 1rem; + + .field__item{ + display: inline; + } + a{ + color: white; + font-weight: 900; + font-size: 0.8rem; + vertical-align: top; + } } ul.links{ order: 6;