diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index 637a09f..19141b6 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -398,181 +398,95 @@ a { font-weight: 800; vertical-align: middle; } -.path-frontpage .block-region-content { - display: grid; - grid-template-areas: "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "actus actus actus actus actus actus" "actus actus actus actus actus actus" "programme programme programme programme programme programme" "programme programme programme programme programme programme" "programme programme programme programme programme programme"; - grid-template-rows: auto auto auto; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - min-height: 100vh; } - .path-frontpage .block-region-content .block-config-pages-block { - grid-area: presentation; - width: 100%; - height: 78vh; - background: url("../images/pictos/rosace_coupee.svg"); - background-position-y: top; - background-position-x: center; - background-repeat: no-repeat; - background-size: cover; } - @media (max-width: 428px) { - .path-frontpage .block-region-content .block-config-pages-block { - height: 66vh; - background-size: cover; - background-position-y: top; - background-position-x: left; } } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front { - width: 400px; - height: 340px; - min-height: fit-content; - margin: auto; - background-color: white; - margin-top: 5rem; - margin-left: 22%; - padding: 4rem 2rem 4rem 2rem; } - @media (max-width: 428px) { - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front { - width: 300px; - height: 200px; - margin-left: 10%; - padding: 3rem 5% 4rem 5%; - margin-top: 5rem; } } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-titre { - color: #e1000f; - font-weight: 900; - font-size: 1.5rem; - text-transform: uppercase; - font-family: "Source Code Pro"; } - @media (max-width: 428px) { - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-titre { - font-size: 1.2rem; } } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-sous-titre { - font-size: 3rem; - font-weight: 900; - color: #009ee3; - line-height: 4rem; - margin-top: 3rem; - margin-bottom: 2rem; - width: fit-content; } - @media (max-width: 428px) { - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-sous-titre { - font-size: 2.5rem; - line-height: 3rem; - margin-top: 1rem; } } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-punchline { - color: #009ee3; - font-weight: 900; - font-size: 1.5rem; - text-transform: uppercase; - font-family: "Source Code Pro"; - padding-bottom: 3rem; } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-lien { - position: relative; - background-color: white; - border: 2px solid #009ee3; - width: fit-content; - height: 1.5rem; - padding: 0.4rem 1rem; - text-align: center !important; - float: right; - bottom: 0; } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-lien a { - display: inline-flex; - text-transform: uppercase; - font-weight: 700; - color: #009ee3; - align-items: center; } - .path-frontpage .block-region-content .block-config-pages-block .config_pages--type--home-front .field--name-field-lien a:after { - display: block; - content: url('data:image/svg+xml,'); } - .path-frontpage .block-region-content .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca { - display: none; } - .path-frontpage .block-region-content .block-block-content1bb9024b-d95f-4137-894c-362abf10a483 { - display: none; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 { - grid-area: actus; - width: 100vw; - border-bottom: 5px solid #009ee3; - border-top: 5px solid #009ee3; - background: rgba(0, 158, 227, 0.2); } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content { - display: grid; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - margin: auto; - padding-top: 2rem; - padding-bottom: 4rem; } - @media (max-width: 479px) { - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content { - display: flex; - flex-direction: column; - width: 80%; } } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .views-row:nth-of-type(1) { - grid-column: 2; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite { - color: black; - line-height: 1.5rem; - padding: 0.5rem; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite div:first-child { - display: flex; - flex-direction: column; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-images { - order: 1; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-images .field__item img { - max-width: 95%; - max-height: 150px; - object-fit: cover; - width: 100%; - padding-bottom: 1rem; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date { - order: 2; - display: flex; - flex-direction: row; - justify-content: flex-start; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date:not(:last-child):after { - padding-right: 1rem; - content: "|"; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date time { - font-size: 0.9rem; - font-weight: 800; - padding-right: 1rem; - width: fit-content; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-title { - order: 3; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-sous-titre { - order: 4; - margin-top: 0.3rem; - font-weight: 800; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field:not(.field--name-field-images) { - width: 100%; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite h2 { - margin: 0; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite a { - color: black; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .inline.links { - padding-top: none !important; - list-style: none; - width: fit-content; - align-self: flex-end; - padding-right: 1rem; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .inline.links a { - display: none; } - .path-frontpage .block-region-content .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-actu-type { - order: 5; - padding-top: 1rem; } - .path-frontpage .block-region-content .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 { - grid-area: actus; - grid-row: 6; - grid-column: 5 / span 6; - max-width: 50%; - min-width: fit-content; - margin-bottom: 2rem; - align-self: flex-end; } +.path-frontpage .block-views-blockactus-blocks-pages-block-1 { + width: 100vw; + border-bottom: 5px solid #009ee3; + background: rgba(0, 158, 227, 0.2); } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content { + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; + margin: auto; + padding-top: 2rem; + padding-bottom: 4rem; } @media (max-width: 479px) { - .path-frontpage .block-region-content .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 { - grid-column: 2 / span 4; - max-width: 80%; - margin: auto; - margin-top: 1rem; - margin-bottom: 1.5rem; } } - .path-frontpage .block-region-content .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 .field--type-link { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content { + display: flex; + flex-direction: column; + width: 80%; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .views-row:nth-of-type(1) { + grid-column: 2; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite { + color: black; + line-height: 1.5rem; + padding: 0.5rem; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite div:first-child { + display: flex; + flex-direction: column; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-images { + order: 1; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-images .field__item img { + max-width: 95%; + max-height: 150px; + object-fit: cover; + width: 100%; + padding-bottom: 1rem; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date { + order: 2; + display: flex; + flex-direction: row; + justify-content: flex-start; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date:not(:last-child):after { + padding-right: 1rem; + content: "|"; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-date time { + font-size: 0.9rem; + font-weight: 800; + padding-right: 1rem; + width: fit-content; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-title { + order: 3; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-sous-titre { + order: 4; + margin-top: 0.3rem; + font-weight: 800; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field:not(.field--name-field-images) { + width: 100%; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite h2 { + margin: 0; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite a { + color: black; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .inline.links { + padding-top: none !important; + list-style: none; + width: fit-content; + align-self: flex-end; + padding-right: 1rem; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .inline.links a { + display: none; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 .view-actus-blocks-pages .view-content .node-type-actualite .field--name-field-actu-type { + order: 5; + padding-top: 1rem; } + +.path-frontpage .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 { + visibility: hidden; } + +.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) { + padding-top: 2rem; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static { + width: 70%; + margin: auto; } + @media (max-width: 479px) { + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static { + width: 80%; } } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static div:first-child:not(.field__item):not(.field) { + display: flex; + flex-direction: row; + flex-wrap: wrap; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static div:first-child:not(.field__item):not(.field) :nth-child(4) { + order: 3; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links { + z-index: 95; + align-self: flex-end; width: fit-content; height: fit-content; padding: 0.4rem 1rem; @@ -580,86 +494,50 @@ a { margin: 0; background-color: white; border: 2px solid #009ee3; - list-style: none; - display: inline-flex; } - .path-frontpage .block-region-content .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 .field--type-link a { + list-style: none; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a { text-transform: uppercase; font-weight: 700; color: #009ee3; display: inline-flex; align-items: center; } - .path-frontpage .block-region-content .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 .field--type-link a::after { - content: url('data:image/svg+xml,'); } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 { - grid-area: programme; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) { - padding-top: 2rem; - background: url("../images/pictos/carre-contour-bleu.svg"); - background-repeat: no-repeat; - max-width: 100vw; - background-size: cover; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static { - width: 70%; - margin: auto; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a:after { + content: url('data:image/svg+xml,'); } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-images .field__item img { + width: 15rem; + height: auto; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-title { + display: none; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { + flex: 1 1 50px; + padding-left: 1rem; } + @media (max-width: 479px) { + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { + padding-left: 0em; } } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche p { + background-color: white; + font-size: 1.5rem; + width: 110%; + padding-bottom: 2rem; + margin-block-start: 0; + text-align: start !important; } @media (max-width: 479px) { - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static { - width: 80%; } } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static div:first-child:not(.field__item):not(.field) { - display: flex; - flex-direction: row; - flex-wrap: wrap; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static div:first-child:not(.field__item):not(.field) :nth-child(4) { - order: 3; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links { - z-index: 95; - 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; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a { - text-transform: uppercase; - font-weight: 700; - color: #009ee3; - display: inline-flex; - align-items: center; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a:after { - content: url('data:image/svg+xml,'); } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-images .field__item img { - width: 15rem; - height: auto; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-title { - display: none; } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { - flex: 1 1 50px; - padding-left: 1rem; } - @media (max-width: 479px) { - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { - padding-left: 0em; } } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche p { - background-color: white; - font-size: 1.5rem; - width: 110%; - padding-bottom: 2rem; - margin-block-start: 0; - text-align: start !important; } - @media (max-width: 479px) { - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche p { - font-size: 1.2rem; - width: 100%; } } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos { - flex: 0 0 80%; - padding-top: 4rem; - margin: auto; } - @media (max-width: 479px) { - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos { - flex: 0 0 100%; } } - .path-frontpage .block-region-content .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos .field__items .field__item:nth-of-type(1) { - display: none; } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche p { + font-size: 1.2rem; + width: 100%; } } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos { + flex: 0 0 80%; + padding-top: 4rem; + margin: auto; } + @media (max-width: 479px) { + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos { + flex: 0 0 100%; } } + .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-videos .field__items .field__item:nth-of-type(1) { + display: none; } + +.path-frontpage .block-views-blockprojets-block-4 { + border-top: 5px solid #009ee3; + background: rgba(0, 158, 227, 0.2); } .node-id-20 { background: url("../images/pictos/carre-contour-bleu_partenaire.svg"); diff --git a/web/themes/custom/eql/scss/pages/_home-old.scss b/web/themes/custom/eql/scss/pages/_home-old.scss new file mode 100644 index 0000000..e187b18 --- /dev/null +++ b/web/themes/custom/eql/scss/pages/_home-old.scss @@ -0,0 +1,396 @@ +.path-frontpage{ + .block-region-content{ + display: grid; + grid-template-areas: "presentation presentation presentation presentation presentation presentation" + "presentation presentation presentation presentation presentation presentation" + "presentation presentation presentation presentation presentation presentation" + "presentation presentation presentation presentation presentation presentation" + "actus actus actus actus actus actus" + "actus actus actus actus actus actus" + "programme programme programme programme programme programme" + "programme programme programme programme programme programme" + "programme programme programme programme programme programme"; + grid-template-rows: auto auto auto; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; + min-height: 100vh; + + + // 1er bandeau home + .block-config-pages-block{ + grid-area: presentation; + width: 100%; + height: 78vh; + background: url("../images/pictos/rosace_coupee.svg"); + // background: url("../images/carre_site.mp4"); + background-position-y: top; + background-position-x: center; + background-repeat: no-repeat; + background-size: cover; + // padding-bottom: 3rem; + + @media (max-width: 428px){ + height: 66vh; + background-size: cover; + background-position-y: top; + background-position-x: left; + + } + + + .config_pages--type--home-front{ + // width:20vw; + // min-width: fit-content; + // height: 20vw; + width: 400px; + height: 340px; + min-height: fit-content; + margin: auto; + background-color: white; + margin-top: 5rem; + margin-left: 22%; + // margin-bottom: 5rem; + padding: 4rem 2rem 4rem 2rem; + // padding-left: 5%; + // padding-right: 5%; + // padding-bottom: 4rem; + // padding-top: 4rem; + @media (max-width: 428px){ + width: 300px; + height: 200px; + margin-left: 10%; + padding: 3rem 5% 4rem 5%; + margin-top: 5rem; + } + + .field--name-field-titre{ + // font-size: 5rem; + // font-weight: 900; + // color: $blue-light; + // line-height: 5.7rem; + // margin-top: 4rem; + // margin-bottom: 2rem; + // width: fit-content; + + color: #e1000f; + font-weight: 900; + font-size: 1.5rem; + text-transform: uppercase; + font-family: "Source Code Pro"; + @media (max-width: 428px){ + font-size: 1.2rem;; + } + + + } + .field--name-field-sous-titre{ + // color: #e1000f; + // font-weight: 900; + // font-size: 1.8rem; + // text-transform: uppercase; + // font-family: "Source Code Pro"; + font-size: 3rem; + font-weight: 900; + color: $blue-light; + line-height: 4rem; + margin-top: 3rem; + margin-bottom: 2rem; + width: fit-content; + @media (max-width: 428px){ + font-size: 2.5rem; + line-height: 3rem; + margin-top: 1rem; + } + } + .field--name-field-punchline{ + color: $blue-light; + font-weight: 900; + font-size: 1.5rem; + text-transform: uppercase; + font-family: "Source Code Pro"; + padding-bottom: 3rem; + } + .field--name-field-lien{ + position: relative; + background-color: $white; + border: 2px solid $blue-light; + width: fit-content; + height: 1.5rem; + padding: 0.4rem 1rem; + text-align: center !important; + float: right; + bottom: 0; + a{ + display: inline-flex; + text-transform: uppercase; + font-weight: 700; + color: $blue-light; + align-items: center; + + &:after{ + display: block; + content: url('data:image/svg+xml,'); + + } + } + } + } + } + + .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ + display: none; + } + .block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ + display: none; + } + + + // bandeau actus + .block-views-blockactus-blocks-pages-block-1{ + grid-area: actus; + width: 100vw; + border-bottom: 5px solid $blue-light; + border-top: 5px solid $blue-light; + background: $background-actus; + .view-actus-blocks-pages{ + .view-content{ + + display: grid; + grid-template-columns: 1fr repeat(4, 2fr) 1fr; + margin: auto; + padding-top: 2rem; + padding-bottom: 4rem; + @media (max-width: 479px){ + display: flex; + flex-direction: column; + // padding-left: 1rem; + width: 80%; + } + .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 { + order: 1; + .field__item img{ + max-width: 95%; + max-height: 150px; + object-fit: cover; + width: 100%; + padding-bottom: 1rem; + } + } + + .field--name-field-date{ + order: 2; + display: flex; + flex-direction: row; + justify-content: flex-start; + &:not(:last-child):after{ + padding-right: 1rem; + content: "|"; + } + time{ + font-size: 0.9rem; + font-weight: 800; + padding-right: 1rem; + width: fit-content; + // :not(:last-child):after{ + // padding-left: 0.5rem; + // content: "|"; + // } + + + } + } + .field--name-title{ + order:3; + } + .field--name-field-sous-titre{ + order:4; + margin-top: 0.3rem; + font-weight: 800; + } + + .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; + } + } + .field--name-field-actu-type{ + order:5; + padding-top: 1rem; + } + } + } + } + } + + // bouton voir toutes actus du bandeau bleu + .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2{ + grid-area: actus; + grid-row: 6; + grid-column: 5 / span 6; + max-width: 50%; + min-width: fit-content; + margin-bottom: 2rem; + align-self: flex-end; + @media (max-width: 479px){ + grid-column: 2 / span 4; + max-width: 80%; + margin: auto; + margin-top: 1rem; + margin-bottom: 1.5rem; + } + + .field--type-link { + 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; + display: inline-flex; + + a{ + text-transform: uppercase; + font-weight: 700; + color: $blue-light; + display: inline-flex; + align-items: center; + + } + a::after{ + content: url('data:image/svg+xml,'); + + } + } + } + + // présentation programme + .block-views-blockhome-nodes-block-2{ + grid-area: 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; + @media (max-width: 479px) { + width: 80%; + } + div:first-child:not(.field__item):not(.field){ + display: flex; + flex-direction: row; + flex-wrap: wrap; + :nth-child(4) { order: 3; } + } + + .inline.links{ + z-index: 95; + 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; + display: inline-flex; + align-items: center; + &: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; + @media (max-width: 479px){ + padding-left: 0em; + + } + p{ + background-color: $white; + font-size: 1.5rem; + width: 110%; + padding-bottom: 2rem; + margin-block-start: 0; + text-align: start !important; + @media (max-width: 479px){ + font-size: 1.2rem; + width: 100%; + } + } + + } + .field--name-field-videos{ + flex: 0 0 80%; + padding-top: 4rem; + margin: auto; + @media (max-width: 479px){ + flex: 0 0 100%; + } + + .field__items { + .field__item:nth-of-type(1){ + display: none; + } + } + } + } + + } + } + } +} \ No newline at end of file diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss index e187b18..33a492e 100644 --- a/web/themes/custom/eql/scss/pages/_home.scss +++ b/web/themes/custom/eql/scss/pages/_home.scss @@ -1,155 +1,12 @@ +// home juin 2023 + .path-frontpage{ - .block-region-content{ - display: grid; - grid-template-areas: "presentation presentation presentation presentation presentation presentation" - "presentation presentation presentation presentation presentation presentation" - "presentation presentation presentation presentation presentation presentation" - "presentation presentation presentation presentation presentation presentation" - "actus actus actus actus actus actus" - "actus actus actus actus actus actus" - "programme programme programme programme programme programme" - "programme programme programme programme programme programme" - "programme programme programme programme programme programme"; - grid-template-rows: auto auto auto; - grid-template-columns: 1fr repeat(4, 2fr) 1fr; - min-height: 100vh; - - - // 1er bandeau home - .block-config-pages-block{ - grid-area: presentation; - width: 100%; - height: 78vh; - background: url("../images/pictos/rosace_coupee.svg"); - // background: url("../images/carre_site.mp4"); - background-position-y: top; - background-position-x: center; - background-repeat: no-repeat; - background-size: cover; - // padding-bottom: 3rem; - - @media (max-width: 428px){ - height: 66vh; - background-size: cover; - background-position-y: top; - background-position-x: left; - - } - - - .config_pages--type--home-front{ - // width:20vw; - // min-width: fit-content; - // height: 20vw; - width: 400px; - height: 340px; - min-height: fit-content; - margin: auto; - background-color: white; - margin-top: 5rem; - margin-left: 22%; - // margin-bottom: 5rem; - padding: 4rem 2rem 4rem 2rem; - // padding-left: 5%; - // padding-right: 5%; - // padding-bottom: 4rem; - // padding-top: 4rem; - @media (max-width: 428px){ - width: 300px; - height: 200px; - margin-left: 10%; - padding: 3rem 5% 4rem 5%; - margin-top: 5rem; - } - - .field--name-field-titre{ - // font-size: 5rem; - // font-weight: 900; - // color: $blue-light; - // line-height: 5.7rem; - // margin-top: 4rem; - // margin-bottom: 2rem; - // width: fit-content; - - color: #e1000f; - font-weight: 900; - font-size: 1.5rem; - text-transform: uppercase; - font-family: "Source Code Pro"; - @media (max-width: 428px){ - font-size: 1.2rem;; - } - - - } - .field--name-field-sous-titre{ - // color: #e1000f; - // font-weight: 900; - // font-size: 1.8rem; - // text-transform: uppercase; - // font-family: "Source Code Pro"; - font-size: 3rem; - font-weight: 900; - color: $blue-light; - line-height: 4rem; - margin-top: 3rem; - margin-bottom: 2rem; - width: fit-content; - @media (max-width: 428px){ - font-size: 2.5rem; - line-height: 3rem; - margin-top: 1rem; - } - } - .field--name-field-punchline{ - color: $blue-light; - font-weight: 900; - font-size: 1.5rem; - text-transform: uppercase; - font-family: "Source Code Pro"; - padding-bottom: 3rem; - } - .field--name-field-lien{ - position: relative; - background-color: $white; - border: 2px solid $blue-light; - width: fit-content; - height: 1.5rem; - padding: 0.4rem 1rem; - text-align: center !important; - float: right; - bottom: 0; - a{ - display: inline-flex; - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - align-items: center; - - &:after{ - display: block; - content: url('data:image/svg+xml,'); - - } - } - } - } - } - - .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ - display: none; - } - .block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ - display: none; - } - - // bandeau actus .block-views-blockactus-blocks-pages-block-1{ - grid-area: actus; + // grid-area: actus; width: 100vw; border-bottom: 5px solid $blue-light; - border-top: 5px solid $blue-light; + // border-top: 5px solid $blue-light; background: $background-actus; .view-actus-blocks-pages{ .view-content{ @@ -187,7 +44,7 @@ padding-bottom: 1rem; } } - + .field--name-field-date{ order: 2; display: flex; @@ -206,7 +63,7 @@ // padding-left: 0.5rem; // content: "|"; // } - + } } @@ -243,62 +100,63 @@ } } } - // bouton voir toutes actus du bandeau bleu .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2{ - grid-area: actus; - grid-row: 6; - grid-column: 5 / span 6; - max-width: 50%; - min-width: fit-content; - margin-bottom: 2rem; - align-self: flex-end; - @media (max-width: 479px){ - grid-column: 2 / span 4; - max-width: 80%; - margin: auto; - margin-top: 1rem; - margin-bottom: 1.5rem; - } + visibility: hidden; + // grid-area: actus; + // grid-row: 6; + // grid-column: 5 / span 6; + // max-width: 50%; + // min-width: fit-content; + // margin-bottom: 2rem; + // align-self: flex-end; + // @media (max-width: 479px){ + // grid-column: 2 / span 4; + // max-width: 80%; + // margin: auto; + // margin-top: 1rem; + // margin-bottom: 1.5rem; + // } - .field--type-link { - 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; - display: inline-flex; + // .field--type-link { + // 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; + // display: inline-flex; - a{ - text-transform: uppercase; - font-weight: 700; - color: $blue-light; - display: inline-flex; - align-items: center; + // a{ + // text-transform: uppercase; + // font-weight: 700; + // color: $blue-light; + // display: inline-flex; + // align-items: center; - } - a::after{ - content: url('data:image/svg+xml,'); + // } + // a::after{ + // content: url('data:image/svg+xml,'); - } - } + // } + // } } + // présentation programme .block-views-blockhome-nodes-block-2{ - grid-area: programme; + // grid-area: 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; + // // 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{ @@ -312,7 +170,7 @@ flex-direction: row; flex-wrap: wrap; :nth-child(4) { order: 3; } - } + } .inline.links{ z-index: 95; @@ -392,5 +250,13 @@ } } - } + + + // Zoom sur les projets + .block-views-blockprojets-block-4{ + border-top: 5px solid $blue-light; + background: $background-actus; + + } + } \ No newline at end of file