From fcf19590b6c29c9a25757d483fb54406414f7c25 Mon Sep 17 00:00:00 2001 From: ouidade Date: Mon, 22 Nov 2021 13:36:34 +0100 Subject: [PATCH] header fixe --- web/themes/custom/eql/css-compiled/styles.css | 7 +- web/themes/custom/eql/scss/pages/_home.scss | 5 +- .../eql/scss/partials/_header copy.scss | 154 ------------------ .../custom/eql/scss/partials/_header.scss | 9 +- 4 files changed, 10 insertions(+), 165 deletions(-) delete mode 100644 web/themes/custom/eql/scss/partials/_header copy.scss diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index ca36690..1905590 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -260,7 +260,6 @@ a { .layout--onecol .field--type-link { grid-area: 8 / span 9; - grid-row: 0; justify-self: end; position: relative; top: -200%; @@ -387,8 +386,9 @@ a { position: relative; } header { - display: block; - position: sticky; } + width: 100%; + position: fixed; + z-index: 99; } #header-top { height: 7rem; @@ -398,7 +398,6 @@ header { flex-direction: row; justify-content: space-between; color: black; - position: sticky; top: 0%; } #header-top .region-header-top-left { display: flex; diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss index f04942b..7d09b7e 100644 --- a/web/themes/custom/eql/scss/pages/_home.scss +++ b/web/themes/custom/eql/scss/pages/_home.scss @@ -37,7 +37,7 @@ color: $white; line-height: 1.5rem; padding: 0.5rem; - div:first-child{ // block actu dans le bandeau + div:first-child{ // block actu dans le bandeau display: flex; flex-direction: column; :nth-child(1) { order: 1; } @@ -74,12 +74,9 @@ } .field--type-link { grid-area: 8 / span 9; - grid-row: 0; justify-self: end; position: relative; top: -200%; - // display: block; - // float: right; width: fit-content; height: fit-content; padding: 0.4rem 1rem; diff --git a/web/themes/custom/eql/scss/partials/_header copy.scss b/web/themes/custom/eql/scss/partials/_header copy.scss deleted file mode 100644 index 21282c4..0000000 --- a/web/themes/custom/eql/scss/partials/_header copy.scss +++ /dev/null @@ -1,154 +0,0 @@ - -.layout-container{ - position: relative; -} -header{ - display: block; - position: sticky; // sticky marche pas :( - -} - -#header-top { - height: 7rem; - background-color: $white; - box-shadow: 1px 0px 8px $black; - display: flex; - flex-direction: row; - justify-content: space-between; - color: $black; - position: sticky; - top:0%; - - - .region-header-top-left { // logo + menu déroulant - display:flex; - flex-direction: row; - padding: 1rem; - align-items:start; - color: $black; - font-weight: 800; - - #block-logogouv{ - display: flex; - height: 100%; - align-items: center; - } - - ul{ - // position: absolute; - list-style: none; - display: flex; - flex-direction: column; - li { - padding-right: 1rem; - - a { - color: $black; - // font-weight: 800; - - } - .is-active { - color: $blue-light; - } - - } - .ul2{ - flex-direction: column; - display: none; - } - :hover{ - color: $blue-light; - } - } - - li:not(ul):not(.ul2){ - display: block; - position: relative; - } - - // .ul:not(:-moz-first-node){ - // display: none; - // } - :hover { - .ul2{ - display: block; - background-color: $white; - padding: 1rem; - } - } - - } - - li .ul1 { - display: flex; - flex-direction: column; - - } - - - #block-burger { // menu burger à droite - z-index: 1; - background-color: $blue-light; - font-size: 0.7rem; - color: $white; - display: block; - width: 7rem; - height: 100%; - margin-top: 0; - :hover{ - cursor: pointer; - } - h2{ - padding-top: 1rem; - } - h2:after{ - display: block; - margin:auto; - height: 60px; - content:url('data:image/svg+xml, '); - } - - #block-burger-menu{ - display: block; - margin: 0; - align-self: center; - text-align: center; - height:7rem; - } - - .ul1:not(.sous-liste){ - width: 300%; - position: relative; - right: 260px; - margin: 0; - padding-top: 2rem; - z-index: 99; - - } - ul { - display: none; - background-color: $blue-light; - line-height: 2rem; - list-style: none; - - .ul1 .sous-liste{ - a{ - opacity: 1; - } - } - a{ - opacity: 0.6; - color: $white; - font-weight: 800; - font-size: 1rem; - } - } - &.opened ul { - display: block; - - } - } - - -} - diff --git a/web/themes/custom/eql/scss/partials/_header.scss b/web/themes/custom/eql/scss/partials/_header.scss index 2ff60ed..1551e5e 100644 --- a/web/themes/custom/eql/scss/partials/_header.scss +++ b/web/themes/custom/eql/scss/partials/_header.scss @@ -3,8 +3,11 @@ position: relative; } header{ - display: block; - position: sticky; // sticky marche pas :( + // display: block; + width: 100%; + position: fixed; + z-index: 99; + } @@ -16,7 +19,7 @@ header{ flex-direction: row; justify-content: space-between; color: $black; - position: sticky; + // position: fixed; top:0%;