diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index 89fcd0c..8f520b3 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -426,9 +426,12 @@ a { .path-frontpage .block-views-blockactus-blocks-pages-block-1 { width: 100vw; - height: 600px; + height: 550px; border-bottom: 5px solid #009ee3; background: rgba(0, 158, 227, 0.2); } + @media (max-width: 810px) { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 { + height: 580px; } } @media (max-width: 792px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 { max-height: fit-content; } } @@ -438,124 +441,121 @@ a { @media (max-width: 479px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 { max-height: fit-content; } } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div { - height: 100%; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages { - height: 100%; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content { - height: 90%; } - @media (max-width: 810px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list { - width: 100vw !important; - height: fit-content !important; } } - @media (max-width: 479px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list { - height: fit-content !important; - width: 100vw !important; } } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list.draggable { - padding-left: 0px !important; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content { + height: 90%; } + @media (max-width: 810px) { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list { + width: 100vw !important; + height: fit-content !important; } } + @media (max-width: 479px) { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list { + height: fit-content !important; + width: 100vw !important; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .slick-list.draggable { + padding-left: 0px !important; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite { + color: black; + line-height: 1.5rem; + width: 80%; + height: 456px; + margin: auto; } + @media (max-width: 810px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite { - color: black; - line-height: 1.5rem; - width: 80%; - height: 600px; - margin: auto; } - @media (max-width: 810px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite { - width: 65%; - height: fit-content; } } + width: 65%; + height: fit-content; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child { + display: grid; + grid-template-columns: 1fr repeat(9, 1fr) 1fr; + column-gap: 30px; } + @media (max-width: 810px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child { - display: grid; - grid-template-columns: 1fr repeat(9, 1fr) 1fr; } - @media (max-width: 810px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child { - display: flex; - flex-direction: column; - height: fit-content; } } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images { - order: 1; - grid-column: 1 /span 9; - grid-row: 1 / span 6; } + display: flex; + flex-direction: column; + height: fit-content; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images { + order: 1; + grid-column: 1 /span 8; + grid-row: 1 / span 6; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item { + display: flex; + max-height: 420px; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { + width: 100%; + object-fit: cover; + object-position: center; } + @media (max-width: 852px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { - width: 100%; - max-height: 550px; + max-height: 310px; + max-width: 100%; object-fit: cover; - padding-left: 1rem; } - @media (max-width: 852px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { - max-height: 310px; - max-width: 100%; - object-fit: cover; - padding-left: 0; - margin-bottom: 1rem; } } - @media (max-width: 724px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { - max-height: 400px; } } - @media (max-width: 680px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { - height: 200px; - object-fit: cover; - max-width: 70vw; - margin: auto; - padding-left: 0; - padding-bottom: 1rem; } } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date { - grid-column: 9 / span 9; - grid-row: 2; - order: 2; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date div { - display: flex !important; - flex-direction: row; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date time { - display: flex; - flex-direction: row; - font-size: 0.9rem; - font-weight: 800; - padding-right: 1rem; - width: fit-content; } + padding-left: 0; + margin-bottom: 1rem; } } + @media (max-width: 724px) { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { + max-height: 400px; } } + @media (max-width: 680px) { + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { + height: 200px; + object-fit: cover; + max-width: 70vw; + margin: auto; + padding-left: 0; + padding-bottom: 1rem; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date { + grid-column: 9 / span 9; + grid-row: 2; + order: 2; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date div { + display: flex !important; + flex-direction: row; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date time { + display: flex; + flex-direction: row; + font-size: 0.9rem; + font-weight: 800; + padding-right: 1rem; + width: fit-content; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu { + grid-column: 9 / span 9; + grid-row: 3; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu .field__label { + display: none; } + @media (max-width: 810px) { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu { - grid-column: 9 / span 9; - grid-row: 3; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu .field__label { - display: none; } - @media (max-width: 810px) { - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu { - display: inline-flex; - order: 3; } } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title { display: inline-flex; - grid-column: 9 / span 9; - grid-row: 4; - order: 4; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title h2 a { - color: #009ee3 !important; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-sous-titre { - display: inline-block; - grid-column: 9 / span 9; - grid-row: 5; - order: 5; - margin-top: 0.3rem; - font-weight: 800; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field:not(.field--name-field-images) { - width: 100%; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child h2 { - margin: 0; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child a { - color: black; - grid-column: 1/span 8; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .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 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .inline.links a { - display: none; } - .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-actu-type { - display: inline-block; - grid-column: 9 / span 7; - grid-row: 6; - order: 6; } + order: 3; } } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title { + display: inline-flex; + grid-column: 9 / span 9; + grid-row: 4; + order: 4; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title h2 a { + color: #009ee3 !important; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-sous-titre { + grid-column: 9 / span 9; + grid-row: 5; + order: 5; + margin-top: 0.3rem; + font-weight: 800; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field:not(.field--name-field-images) { + width: 100%; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child h2 { + margin: 0; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child a { + color: black; + grid-column: 1/span 8; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .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 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .inline.links a { + display: none; } + .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-actu-type { + grid-column: 9 / span 7; + grid-row: 6; + order: 6; } .path-frontpage .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2 { visibility: hidden; } @@ -4493,6 +4493,13 @@ a { padding-right: 1rem; padding-bottom: 1rem; } +.slick-prev { + color: #009ee3; + left: 25px; } + +.slick-dots { + bottom: -40px !important; } + /* Slider */ .slick-slider { position: relative; diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss index 1e4fb2d..f639f1c 100644 --- a/web/themes/custom/eql/scss/pages/_home.scss +++ b/web/themes/custom/eql/scss/pages/_home.scss @@ -6,12 +6,12 @@ .block-views-blockactus-blocks-pages-block-1{ // grid-area: actus; width: 100vw; - height: 600px; + height: 550px; border-bottom: 5px solid $blue-light; background: $background-actus; - // @media(max-width: 810px){ - // max-height: fit-content; - // } + @media(max-width: 810px){ + height: 580px; + } @media(max-width:792px){ max-height: fit-content; } @@ -23,9 +23,9 @@ } div{ - height: 100%; + // height: 100%; .view-actus-blocks-pages{ - height: 100%; + // height: 100%; .view-content{ height: 90%; .slick-list{ @@ -46,7 +46,7 @@ color: $black; line-height: 1.5rem; width: 80%; - height: 600px; + height: 456px; margin: auto; @media (max-width: 810px){ width: 65%; @@ -56,6 +56,8 @@ div:first-child{ // block actu dans le bandeau display: grid; grid-template-columns: 1fr repeat(9, 1fr) 1fr; + // grid-template-rows: repeat(6, 1fr); + column-gap: 30px; @media (max-width: 810px){ display: flex; flex-direction: column; @@ -63,14 +65,18 @@ } .field--name-field-images { order: 1; - grid-column: 1 /span 9; + grid-column: 1 /span 8; grid-row: 1 / span 6; - + .field__item{ + display: flex; + max-height: 420px; + } .field__item img{ width: 100%; - max-height: 550px; + // max-height: 456px; object-fit: cover; - padding-left: 1rem; + object-position: center; + // padding-left: 1rem; @media(max-width:852px){ max-height: 310px; max-width: 100%; @@ -147,7 +153,7 @@ } } .field--name-field-sous-titre{ - display: inline-block; + // display: inline-block; grid-column: 9 / span 9; grid-row: 5; order:5; @@ -177,7 +183,7 @@ } } .field--name-field-actu-type{ - display: inline-block; + // display: inline-block; grid-column: 9 / span 7; grid-row: 6; diff --git a/web/themes/custom/eql/scss/partials/_slick_custom.scss b/web/themes/custom/eql/scss/partials/_slick_custom.scss index d78fa60..a0d9acb 100644 --- a/web/themes/custom/eql/scss/partials/_slick_custom.scss +++ b/web/themes/custom/eql/scss/partials/_slick_custom.scss @@ -3,3 +3,6 @@ left: 25px; } +.slick-dots { + bottom: -40px !important; +} \ No newline at end of file diff --git a/web/themes/custom/eql/scss/styles.scss b/web/themes/custom/eql/scss/styles.scss index 8fbdb7b..d02aed4 100644 --- a/web/themes/custom/eql/scss/styles.scss +++ b/web/themes/custom/eql/scss/styles.scss @@ -58,7 +58,7 @@ /*partials*/ @import "partials/_header"; @import "partials/_footer"; -// @import "partials/_slick_custom.scss"; +@import "partials/_slick_custom.scss"; @import "partials/_slick"; @import "partials/_slick-theme"; // @import "partials/_block_third_ressources_liees";