diff --git a/assets/sass/_theme/design-system/header.sass b/assets/sass/_theme/design-system/header.sass
index d79a366ebd3af3607dbf0244208289bdcb116e3b..b59b57796586d215aa2c3a9c72c669f67c3bec2a 100644
--- a/assets/sass/_theme/design-system/header.sass
+++ b/assets/sass/_theme/design-system/header.sass
@@ -1,5 +1,6 @@
header[role="banner"]
background: $header-background
+ color: $header-color
position: fixed
left: 0
transition: transform $header-sticky-transition, background $header-sticky-transition
@@ -16,9 +17,7 @@ header[role="banner"]
height: 1px
left: 0
position: absolute
- -o-transition: background-color .4s
- -moz-transition: background-color .4s
- transition: background-color .4s
+ transition: background-color $header-sticky-transition
width: 100%
.dropdown-menu
transition: background $header-sticky-transition
@@ -55,3 +54,71 @@ header[role="banner"]
transition: filter $header-sticky-transition
@include media-breakpoint-up(md)
height: $header-logo-height-md
+
+// TODO : Est-ce au bon endroit ?
+body
+ &::after
+ @include inset(0)
+ background-color: $body-overlay-color
+ content: ""
+ pointer-events: none
+ position: fixed
+ opacity: 0
+ transition: opacity $header-transition
+ z-index: $zindex-body-overlay
+
+ html.has-menu-opened &,
+ html.has-offcanvas-opened &
+ &::after
+ display: block
+ opacity: 1
+ pointer-events: inherit
+ html.has-offcanvas-opened &
+ &::after
+ z-index: $zindex-header + 1
+ html.is-animating:not(.has-menu-opened) &
+ &::after
+ display: block
+ opacity: 0
+
+header[role="banner"]
+ nav[role="navigation"]
+ padding-bottom: $header-nav-padding-y
+ padding-top: $header-nav-padding-y
+ .container
+ align-items: center
+ display: flex
+ flex-wrap: wrap
+ justify-content: space-between
+ button[type="button"]
+ @include button-reset
+ display: none
+ border: 0
+ color: inherit
+ padding: 0
+ position: relative
+ @include media-breakpoint-down(md)
+ display: flex
+ align-items: center
+ &:focus
+ box-shadow: none
+ &:focus-visible
+ outline-color: gray
+ outline-offset: 5px
+ outline-style: dashed
+ outline-width: 1px
+ span:first-of-type
+ @include meta
+ span:last-of-type
+ @include icon("burger", before)
+ background: none
+ height: calc(1.063rem + .3125rem * 2)
+ padding: px2rem(5) 0 px2rem(5) px2rem(5)
+ width: calc(1.5rem + .3125rem)
+ &::before
+ font-size: px2rem(17)
+ vertical-align: top
+ &[aria-expanded="true"]
+ span:last-of-type
+ &::before
+ content: map-get($icons, "close")
diff --git a/assets/sass/_theme/design-system/nav.sass b/assets/sass/_theme/design-system/nav.sass
index 77ca19f446bd45a98c377cc780d22556fcfb7978..c3c53ee9e335044c27b5208df828ddcd06baaf1c 100644
--- a/assets/sass/_theme/design-system/nav.sass
+++ b/assets/sass/_theme/design-system/nav.sass
@@ -156,74 +156,6 @@
> .has-children + .has-children
margin-top: $spacing1
-// TODO : Est-ce au bon endroit ?
-body
- &::after
- @include inset(0)
- background-color: $body-overlay-color
- content: ""
- pointer-events: none
- position: fixed
- opacity: 0
- transition: opacity $header-transition
- z-index: $zindex-body-overlay
-
- html.has-menu-opened &,
- html.has-offcanvas-opened &
- &::after
- display: block
- opacity: 1
- pointer-events: inherit
- html.has-offcanvas-opened &
- &::after
- z-index: $zindex-header + 1
- html.is-animating:not(.has-menu-opened) &
- &::after
- display: block
- opacity: 0
-
-header[role="banner"]
- nav[role="navigation"]
- padding-bottom: $header-nav-padding-y
- padding-top: $header-nav-padding-y
- .container
- align-items: center
- display: flex
- flex-wrap: wrap
- justify-content: space-between
- button[type="button"]
- @include button-reset
- display: none
- border: 0
- color: $body-color
- padding: 0
- position: relative
- @include media-breakpoint-down(md)
- display: flex
- align-items: center
- &:focus
- box-shadow: none
- &:focus-visible
- outline-color: gray
- outline-offset: 5px
- outline-style: dashed
- outline-width: 1px
- span:first-of-type
- @include meta
- span:last-of-type
- @include icon("burger", before)
- background: none
- height: calc(1.063rem + .3125rem * 2)
- padding: px2rem(5) 0 px2rem(5) px2rem(5)
- width: calc(1.5rem + .3125rem)
- &::before
- font-size: px2rem(17)
- vertical-align: top
- &[aria-expanded="true"]
- span:last-of-type
- &::before
- content: map-get($icons, "close")
-
.share
display: flex
list-style: none
diff --git a/layouts/partials/toc/cta.html b/layouts/partials/toc/cta.html
index b1eed88d4199ac21471ec0569a3f2db80cc75307..3605f7b2ee548698618ebef8bf1e6b8877d97230 100644
--- a/layouts/partials/toc/cta.html
+++ b/layouts/partials/toc/cta.html
@@ -1,5 +1,5 @@
<div class="toc-cta">
- <button class="toc-cta-title" aria-label="{{ i18n "commons.toc" }}" id="toc-title">
+ <button class="toc-cta-title" aria-label="{{ i18n "commons.toc" }}">
<span data-default="{{ i18n "commons.toc" }}">{{ i18n "commons.toc" }}</span>
</button>
</div>