diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index 8724b34..05e1bf3 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -263,78 +263,102 @@ a { .block-views-blockhome-nodes-block-1 .node-type-static div:first-child { display: grid; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; } + grid-template-columns: 1fr repeat(4, 2fr) 1fr; + grid-template-rows: repeat(4, auto); } .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images { - grid-column: 1 /span 10; } + z-index: -99; + filter: grayscale(100%); + filter: brightness(0%); + opacity: 0.5; + grid-column: 1 /span 10; + grid-row: 1 / span 4; } .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images img { + width: 100vw; height: auto; } - -.block-views-blockhome-nodes-block-1 .field--name-field-accroche { - display: none; } - -.block-views-blockhome-nodes-block-1 .field--name-title { - grid-column: 2; } - .block-views-blockhome-nodes-block-1 .field--name-title h2 { - grid-column: 2; } - .block-views-blockhome-nodes-block-1 .field--name-title h2 a { + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-accroche { + display: none; } + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-title { + grid-column: 2; + grid-row: 1; } + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-title h2 a { color: #009ee3; font-weight: 900; } + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .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 #009ee3; + list-style: none; + text-align: center !important; } + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .links.inline a { + display: inline-flex; + text-transform: uppercase; + font-weight: 700; + color: #009ee3; } + .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .links.inline a:after { + display: block; + content: url('data:image/svg+xml,'); } -.block-views-blockhome-nodes-block-1 .links.inline { - grid-column: 2; - 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 #009ee3; - list-style: none; } - .block-views-blockhome-nodes-block-1 .links.inline a { - text-transform: uppercase; - font-weight: 700; - color: #009ee3; } - .block-views-blockhome-nodes-block-1 .links.inline a:after { - content: url('data:image/svg+xml,'); } - -.block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link { - justify-self: end; - position: relative; - width: fit-content; - height: fit-content; - padding: 0.4rem 1rem; - font-size: 0.8rem; - margin: 0; - background-color: white; - border: 2px solid #009ee3; - list-style: none; } - .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link a { - text-transform: uppercase; - font-weight: 700; - color: #009ee3; } - .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link a::after { - content: url('data:image/svg+xml,'); } - -.block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 { - background-color: #009ee3; - width: 25%; - float: right; } - .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-lien.field--type-link { - align-self: flex-end; - width: fit-content; - height: fit-content; +.block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca { + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; } + .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link { + grid-column: 3; + 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 #009ee3; + list-style: none; + top: -200%; + text-align: center !important; } + .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link a { + display: inline-flex; + text-transform: uppercase; + font-weight: 700; + color: #009ee3; } + .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca .field--type-link a::after { + content: url('data:image/svg+xml,'); } + +.block-region-content { + position: relative; } + +.block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 { + position: relative; + background-color: #009ee3; + width: 20%; + float: right; + margin-right: 10%; } + .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-lien.field--type-link { + width: fit-content; + padding: 0.4rem 1rem; + font-size: 0.8rem; + margin: auto; list-style: none; } .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-lien.field--type-link a { text-transform: uppercase; font-weight: 700; color: black; } + .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 .field--name-field-lien.field--type-link a:before { + display: block; + content: url('data:image/svg+xml,'); } .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483 p { color: white; - font-size: 1.2rem; } + font-size: 1.2rem; + padding-left: 1rem; + padding-right: 1rem; + margin-top: 0; + text-align: center; } .block-views-blockactus-blocks-pages-block-1 { clear: both; diff --git a/web/themes/custom/eql/images/Logement_sociaux_6_1.jpg b/web/themes/custom/eql/images/Logement_sociaux_6_1.jpg new file mode 100644 index 0000000..b975624 Binary files /dev/null and b/web/themes/custom/eql/images/Logement_sociaux_6_1.jpg differ diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss index eae04c3..83102a3 100644 --- a/web/themes/custom/eql/scss/pages/_home.scss +++ b/web/themes/custom/eql/scss/pages/_home.scss @@ -23,71 +23,92 @@ // 1er bandeau .block-views-blockhome-nodes-block-1{ + .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{ + 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{ + display: none; + } + .field--name-title{ + grid-column: 2; + grid-row: 1; + h2{ + a{ + color: $blue-light; + font-weight: 900; + } + } + } + .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; - } - } - .field--name-field-accroche{ - display: none; - } - .field--name-title{ - grid-column: 2; - h2{ - grid-column: 2; - a{ - color: $blue-light; - font-weight: 900; - + a{ + display: inline-flex; + text-transform: uppercase; + font-weight: 700; + color: $blue-light; + &:after{ + display: block; + content: url('data:image/svg+xml,'); + + } + } } } + } - } - .links.inline{ - grid-column: 2; - 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,'); - } - } - } } + +// bouton déposer candidature .block-block-content.block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; .field--type-link { - justify-self: end; + grid-column: 3; + // justify-self: end; position: relative; - width: fit-content; - height: fit-content; + 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; @@ -101,33 +122,44 @@ } // bouton foire aux questions - +.block-region-content{ + position: relative; +} .block-block-content.block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ + position: relative; background-color: $blue-light; - width: 25%; + width: 20%; float: right; + + // display: flex; + // flex-direction: column; + margin-right: 10%; .field--name-field-lien.field--type-link{ - align-self: flex-end; + // align-self: flex-end; width: fit-content; - height: fit-content; + // height: fit-content; padding: 0.4rem 1rem; font-size: 0.8rem; - margin: 0; + margin: auto; list-style: none; a{ text-transform: uppercase; font-weight: 700; color: $black; - // &:after{ - // // display: block; - // content: url('data:image/svg+xml,'); - // } + &:before{ + display: block; + content: url('data:image/svg+xml,'); + } } } p{ color: $white; font-size: 1.2rem; + padding-left: 1rem; + padding-right: 1rem; + margin-top: 0; + text-align: center; } }