diff --git a/assets/sass/_theme/_configuration.sass b/assets/sass/_theme/_configuration.sass index da7ff68910feb5b74a4fcae19ee9635a5b5b4d8b..ca6c35be04c66404edee08d98c1f23127ee435da 100644 --- a/assets/sass/_theme/_configuration.sass +++ b/assets/sass/_theme/_configuration.sass @@ -152,7 +152,7 @@ $zindex-body-overlay: 51 !default $zindex-toc: 60 !default $zindex-toc-cta: 49 !default $zindex-aside: 48 !default -$zindex-footer: 70 !default +$zindex-footer: 50 !default // Header $header-color: $color-text !default diff --git a/assets/sass/_theme/_utils.sass b/assets/sass/_theme/_utils.sass index e00c827b6b4c5043b8c3b4ae404432884ff5851e..35172dc770443a9c79dc953827628ec2062e45a2 100644 --- a/assets/sass/_theme/_utils.sass +++ b/assets/sass/_theme/_utils.sass @@ -368,6 +368,15 @@ @include media-breakpoint-up(desktop) &:before padding-right: 0 + @include media-breakpoint-down(desktop) + position: relative + background: $color-background + &::before + background: transparent + p + display: block + background: transparent + position: relative &:hover figcaption p diff --git a/assets/sass/_theme/blocks/video.sass b/assets/sass/_theme/blocks/video.sass index 4052c1745aa36aaced47235e3fefa4cdc276b6db..79806ff4e8f783efc00c7388c77d6a5228f030d2 100644 --- a/assets/sass/_theme/blocks/video.sass +++ b/assets/sass/_theme/blocks/video.sass @@ -6,10 +6,11 @@ min-height: 400px iframe background: black - @include in-page-without-sidebar - .transcription - width: col(7) - margin-left: auto + @include media-breakpoint-up(desktop) + @include in-page-without-sidebar + .transcription + width: col(7) + margin-left: auto @include media-breakpoint-down(desktop) .video margin-left: half(-$grid-gutter-sm) diff --git a/assets/sass/_theme/design-system/header.sass b/assets/sass/_theme/design-system/header.sass index d13d1f23922b64c949886e84a721ee8419d251cd..06af0f8a78e85baa49b973882c21f156063da7d9 100644 --- a/assets/sass/_theme/design-system/header.sass +++ b/assets/sass/_theme/design-system/header.sass @@ -63,6 +63,9 @@ body html.has-menu-opened &, html.has-offcanvas-opened & + overflow: hidden + height: 100% + min-height: -webkit-fill-available &::after display: block opacity: 1 diff --git a/assets/sass/_theme/design-system/hero.sass b/assets/sass/_theme/design-system/hero.sass index 6ca0cf94f5c3cdc7ead0732ea33caea4981eec3b..28833f74a895687e32394e82c660311c4b10ce8f 100644 --- a/assets/sass/_theme/design-system/hero.sass +++ b/assets/sass/_theme/design-system/hero.sass @@ -48,9 +48,10 @@ > h1, > hgroup margin-bottom: $spacing2 &--image-landscape - figure - margin-left: half(-$grid-gutter-sm) - margin-right: half(-$grid-gutter-sm) + .content + figure + margin-left: half(-$grid-gutter-sm) + margin-right: half(-$grid-gutter-sm) &--image-portrait, &--image-square .container display: flex diff --git a/assets/sass/_theme/design-system/nav.sass b/assets/sass/_theme/design-system/nav.sass index 157958a15c8b1323d8d0c43f818e55f7894272ed..104527e036e960a8f95ffec4601eb789fdc6336f 100644 --- a/assets/sass/_theme/design-system/nav.sass +++ b/assets/sass/_theme/design-system/nav.sass @@ -12,7 +12,7 @@ display: none flex-basis: 100vw margin-top: $spacing1 - max-height: calc(100vh - var(--header-height) - #{$spacing1}) + max-height: calc(100vh - var(--header-height) - #{$spacing4}) overflow: auto a, a:focus, @@ -54,9 +54,10 @@ padding: $spacing1 position: absolute max-height: calc(100vh - var(--header-height)) + max-height: calc(-webkit-fill-available - var(--header-height)) overflow: auto a - color: $header-dropdown-color + color: $header-dropdown-color &:hover, &:focus text-decoration-color: $header-dropdown-color diff --git a/layouts/partials/header/hero.html b/layouts/partials/header/hero.html index df099f4fa7ce3d9fc466ba83f21493cfafb1e403..cb14b4bce0bb5c8b80ab2d2a34cc33cf94f0ab3d 100644 --- a/layouts/partials/header/hero.html +++ b/layouts/partials/header/hero.html @@ -33,7 +33,7 @@ "sizes" ( .sizes | default site.Params.image_sizes.design_system.hero ) "lazy" false ) }} - {{ if .image.credit }} + {{ if partial "GetTextFromHTML" .image.credit }} <figcaption tabindex="0"> <p> {{- partial "GetTextFromHTML" .image.credit -}}