From 1face90cd0414ba2a08fe98f7a74cc4e4e603e00 Mon Sep 17 00:00:00 2001 From: ouidade Date: Tue, 7 Dec 2021 15:12:12 +0100 Subject: [PATCH] page node type actualite --- web/themes/custom/eql/css-compiled/styles.css | 59 ++- .../custom/eql/scss/pages/_actualite.scss | 50 +++ .../custom/eql/scss/pages/_home1 copy.scss | 393 ------------------ web/themes/custom/eql/scss/pages/_static.scss | 58 ++- 4 files changed, 136 insertions(+), 424 deletions(-) delete mode 100644 web/themes/custom/eql/scss/pages/_home1 copy.scss diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index cf8e80d..9223c31 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -227,6 +227,7 @@ a { height: auto; padding-right: 1rem; } .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf a { + hyphens: auto; display: inline-flex; align-items: center; color: #009ee3; @@ -256,24 +257,37 @@ a { .layout__region--third .block-region-third .block-entity-fieldnodefield-ress { margin-top: 5rem; } .layout__region--third .block-region-third .block-entity-fieldnodefield-ress h2 { - font-size: 1rem; - color: black; } + font-size: 0.8rem; + color: black; + font-weight: 900; } .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource { display: flex; + flex-direction: column; border: 2px solid #009ee3; - padding-left: 1rem; - padding-bottom: 3rem; + padding: 1rem; height: fit-content; margin-bottom: 1rem; background-color: white; } .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type { border-top: 1px solid #009ee3; padding-top: 1rem; } - .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field, .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource a { - line-height: 0.6rem; - font-size: 1.5rem; - color: #09398b; - font-weight: 500; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource:first-of-type::after { + content: url("../images/pictos/noun_Arrow_3771902.svg"); + align-self: end; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-title a { + color: black; + font-size: 1.4rem; + font-weight: 600; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- { + font-weight: 800; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- p { + margin: 0; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-auteur-s- .field__label { + display: none; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition p { + margin: 0; } + .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-edition .field__label { + display: none; } .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images { width: 50%; } .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .node-type-ressource .field--name-field-images img { @@ -608,6 +622,33 @@ a { .field--name-field-partenaires a svg { display: none; } +.path-node.page-node-type-actualite .layout__region--top { + background-color: rgba(0, 158, 227, 0.2); } + .path-node.page-node-type-actualite .layout__region--top .block-region-top { + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; } + .path-node.page-node-type-actualite .layout__region--top .block-region-top .block-entity-fieldnodetitle { + grid-column: 2 /span 6; + margin: 0; } + .path-node.page-node-type-actualite .layout__region--top .block-region-top .block-entity-fieldnodetitle .field--name-title { + font-family: "Source Code Pro"; + font-size: 4rem; + font-weight: 500; } + .path-node.page-node-type-actualite .layout__region--top .block-region-top .block-entity-fieldnodefield-date { + grid-column: 2; + text-transform: uppercase; + color: #09398b; + font-size: 1.5rem; + font-weight: 800; } + +.path-node.page-node-type-actualite .block-region-second .block-entity-fieldnodebody { + width: 90%; } + .path-node.page-node-type-actualite .block-region-second .block-entity-fieldnodebody .panel-body #outputtext { + overflow-y: visible !important; } + +.path-node.page-node-type-actualite .layout__region--third .block-region-third { + max-width: 70%; } + .node-id-35 .region-content { background: url("../images/pictos/carre-contour-bleu_gouvernance.svg"); background-repeat: no-repeat; diff --git a/web/themes/custom/eql/scss/pages/_actualite.scss b/web/themes/custom/eql/scss/pages/_actualite.scss index e69de29..3f3acf7 100644 --- a/web/themes/custom/eql/scss/pages/_actualite.scss +++ b/web/themes/custom/eql/scss/pages/_actualite.scss @@ -0,0 +1,50 @@ +.path-node.page-node-type-actualite{ + + .layout__region--top{ + + background-color: $background-actus; + .block-region-top{ + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; + + .block-entity-fieldnodetitle{ + grid-column: 2 /span 6; + margin: 0; + .field--name-title{ + font-family: "Source Code Pro"; + font-size: 4rem; + font-weight: 500; + } + } + .block-entity-fieldnodefield-date{ + grid-column: 2; + text-transform: uppercase; + color: $blue-dark; + font-size: 1.5rem; + font-weight: 800; + + } + + } + } + .block-region-second{ + .block-entity-fieldnodebody{ + width: 90%; + .panel-body{ + #outputtext{ + overflow-y: visible !important; + } + } + } + + } + .layout__region--third{ + .block-region-third{ + max-width: 70%; + } + + } + +} + + diff --git a/web/themes/custom/eql/scss/pages/_home1 copy.scss b/web/themes/custom/eql/scss/pages/_home1 copy.scss deleted file mode 100644 index b20af6c..0000000 --- a/web/themes/custom/eql/scss/pages/_home1 copy.scss +++ /dev/null @@ -1,393 +0,0 @@ - - -.field--type-entity-reference-revisions{ - .paragraph-summary{ - font-family: $font-family-default; - font-size: 5rem; - font-weight: 600; - color: $black !important; - text-transform: capitalize; - - span:nth-of-type(2n){ - display: block; - font-size: 1rem; - } - } - .paragraph-summary:nth-of-type(2n) { - font-size: 2rem; - - } - -} - -// 1er bandeau - -.block-views-blockhome-nodes-block-1{ - background: url("../images/pictos/carre-contour-bleu_contact.svg"); - - .node-type-static{ - div:first-child{ - display: grid; - // flex-direction: column; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - grid-template-rows: repeat(4, auto); - .field--name-field-images{ - display: none; - // z-index: -99; - // filter: grayscale(100%); - // filter: brightness(0%); - // opacity: 0.5; - // // display: none; - // grid-column: 1 /span 10; - // grid-row: 1 / span 4; - // img{ - // width: 100vw; - // height: auto; - // } - } - .field--name-field-accroche{ - grid-column: 2 /span 3; - grid-row: 2 / span 2; - font-size: 5rem; - font-weight: 800; - color: $blue-light; - line-height: 6rem; - p{ - margin: 0; - } - margin: 0; - } - .field--name-title{ - grid-column: 4; - grid-row: 1; - margin-top: 2rem; - - h2{ - a{ - color: #e1000f; - font-weight: 900; - text-transform: uppercase; - } - } - } - .links.inline{ - grid-column: 2; - grid-row: 4; - max-width: 70%; - min-width: fit-content; - height: 1.5rem; - padding: 0.4rem 1rem; - font-size: 0.8rem; - margin-bottom: 2.5rem; - background-color: $white; - border: 2px solid $blue-light; - list-style: none; - text-align: center !important; - - a{ - display: inline-flex; - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - &:after{ - display: block; - content: url('data:image/svg+xml,'); - - } - } - } - } - } - -} - -// bouton déposer candidature -.block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ - display: grid; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - height: 0; - .field--type-link { - grid-column: 3; - // justify-self: end; - position: relative; - max-width: 70%; - min-width: fit-content; - height: 1.5rem; - padding: 0.4rem 1rem; - font-size: 0.8rem; - margin: 0; - background-color: $white; - border: 2px solid $blue-light; - list-style: none; - top: -200%; - text-align: center !important; - - a{ - display: inline-flex; - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - - } - a::after{ - content: url('data:image/svg+xml,'); - - } - } -} - -// bouton foire aux questions -.block-region-content{ - position: relative; -} -.block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ - position: relative; - width: 20%; - float: right; - margin-right: 13%; - bottom: -100%; - // grid-column: 5; - background-color: $blue-light; - .field--name-field-lien{ - &:before{ - margin-top: 1rem; - display: block; - content: url("../images/pictos/picto_faq.svg"); - } - text-align: center; - a{ - font-size: 0.8rem; - font-weight: 1000; - color: $blue-dark; - text-transform: uppercase; - } - } - .field--name-field-description{ - p{ - margin-top: 0; - margin-bottom: 0; - margin-left: 1.5rem; - margin-right: 1.5rem; - text-align: center; - a{ - font-weight: 800; - color: $white; - font-size: 1.3rem; - } - &:after{ - display: block; - content:url("../images/pictos/noun_Arrow_3771902.svg") - - } - } - } - - - // .field--name-field-description{ - // position: relative; - // bottom: +140%; - // grid-column: 5; - // background-color: $blue-light; - // p{ - // color: $white; - // font-size: 1.2rem; - // padding-left: 1rem; - // padding-right: 1rem; - // margin-top: 0; - // text-align: center; - // } - // } - } - - -// bandeau actus - -.block-views-blockactus-blocks-pages-block-1{ - clear: both; - border-bottom: 5px solid $blue-light; - border-top: 5px solid $blue-light; - .view-content{ - - display: grid; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - margin: auto; - padding-top: 2rem; - padding-bottom: 4rem; - .views-row:nth-of-type(1) { grid-column: 2; } - - .node-type-actualite{ - color: $black; - line-height: 1.5rem; - padding: 0.5rem; - div:first-child{ // block actu dans le bandeau - display: flex; - flex-direction: column; - :nth-child(1) { order: 1; } - :nth-child(4) { order: 2; } - :nth-child(5) { order: 3; } - } - .field--name-field-images { - .field__item img{ - max-width: 70%; - max-height: 130px; - object-fit: cover; - width: 100%; - padding-bottom: 1rem; - } - // &::after{ - // display: block; - // content:url('data:image/svg+xml, '); - // } - } - time{ - font-size: 0.9rem; - font-weight: 800; - padding-right: 1rem; - width: fit-content; - &:after{ - padding-left: 0.5rem; - content: "|";} - } - - .field:not(.field--name-field-images){ - width: 100%; - } - h2{ margin:0; } - a{ color: $black; } - - .inline.links{ - padding-top: none !important; - list-style: none; - width: fit-content; - align-self: flex-end; - padding-right: 1rem; - a{ - display: none; - } - // a{ - // content: url('data:image/svg+xml,'); - // } - } - .field--name-field-actu-type{ - padding-top: 1rem; - } - } - } -} - - - -// bouton voir toutes actus du bandeau bleu -// .layout--onecol{ -.block-block-content.block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2{ - display: grid; - grid-template-columns: 1fr repeat(8, 2fr) 1fr; - position: relative; - height: 0; - - .field--type-link { - grid-area: 8 / span 9; - justify-self: end; - position: relative; - top: -200%; - width: fit-content; - height: fit-content; - padding: 0.4rem 1rem; - font-size: 0.8rem; - margin: 0; - background-color: $white; - border: 2px solid $blue-light; - list-style: none; - - a{ - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - - } - a::after{ - content: url('data:image/svg+xml,'); - - } - } -} -// } - - -// boutons en savoir plus pour lien vers pages statiques -// présentation programme - -.view-display-id-block_2:is(.view-id-home_nodes){ - padding-top: 2rem; - // background: url('data:image/svg+xml,'); - background: url('../images/pictos/carre-contour-bleu.svg'); - // background-position-y: 50%; - background-repeat: no-repeat; - max-width: 100vw; - background-size: cover; - - - .node-type-static{ - width: 70%; - margin: auto; - div:first-child:not(.field__item):not(.field){ - display: flex; - flex-direction: row; - flex-wrap: wrap; - } - - .inline.links{ - align-self: flex-end; - width: fit-content; - height: fit-content; - padding: 0.4rem 1rem; - font-size: 0.8rem; - margin: 0; - background-color: $white; - border: 2px solid $blue-light; - list-style: none; - - a{ - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - &:after{ - // display: block; - content: url('data:image/svg+xml,'); - } - } - } - .field--name-field-images{ - // grid-column: 2 / 4; - .field__item{ - img{ - width: 15rem; - height: auto; - } - } - } - .field--name-title{ - display: none; - } - .field--name-field-accroche{ - flex: 1 1 50px; - // grid-column: 4 / 9; - padding-left: 1rem; - p{ - background-color: $white; - font-size: 1.5rem; - width: 110%; - margin-bottom: 2rem; - padding-bottom: 2rem; - margin-block-start: 0; - } - - } - .field--name-field-videos{ - flex: 0 0 80%; - margin: auto; - } - } - -} - diff --git a/web/themes/custom/eql/scss/pages/_static.scss b/web/themes/custom/eql/scss/pages/_static.scss index d323713..89c557e 100644 --- a/web/themes/custom/eql/scss/pages/_static.scss +++ b/web/themes/custom/eql/scss/pages/_static.scss @@ -45,8 +45,8 @@ } .layout__region--second{ // paragraphe texte - .block-entity-fieldnodefield-textes{ + background-color: $white; .field--name-field-titre{ font-size: 1.5rem; @@ -106,28 +106,18 @@ padding-right: 1rem; } a{ + hyphens: auto; display: inline-flex; align-items: center; color: $blue-light; font-weight: 800; + // max-width: 80px ; } } } .block-entity-fieldnodefield-liens{ - // height: fit-content; - // border: 2px solid $blue-light; - - // min-height: 4rem; - // // max-width: 75%; - // background: $white; - // color: $blue-light; - // padding-left: 1rem; - // padding-top: 1rem; - .field--name-field-liens{ - - .field__item{ margin: auto; height: fit-content; @@ -163,28 +153,52 @@ margin-top: 5rem; h2{ - font-size: 1rem; + font-size: 0.8rem; color: $black; + font-weight: 900; } .node-type-ressource{ display: flex; + flex-direction: column; border: 2px solid $blue-light; - padding-left: 1rem; - padding-bottom: 3rem; - + padding: 1rem; + height: fit-content; margin-bottom: 1rem; background-color: $white; &:first-of-type{ border-top: 1px solid $blue-light; padding-top: 1rem; + &::after{ + content: url("../images/pictos/noun_Arrow_3771902.svg"); + align-self: end; + } } - .field, a{ - line-height: 0.6rem; - font-size: 1.5rem; - color: $blue-dark; - font-weight: 500; + .field--name-title{ + a{ + color: $black; + font-size: 1.4rem; + font-weight: 600; + + } + } + .field--name-field-auteur-s-{ + font-weight: 800; + p{ + margin: 0; + } + .field__label{ + display:none; + } + } + .field--name-field-edition{ + p{ + margin: 0; + } + .field__label{ + display:none; + } } .field--name-field-images{ width: 50%;