diff --git a/assets/sass/_theme/_configuration.sass b/assets/sass/_theme/_configuration.sass index 546df910919353baa2a37d5ceaad9452fadf499f..9d9bfe09c990ab54a7d0097790965d88ef360924 100644 --- a/assets/sass/_theme/_configuration.sass +++ b/assets/sass/_theme/_configuration.sass @@ -290,6 +290,10 @@ $block-key_figures-number-font-size-xxl: px2rem(80) !default // Block gallery $block-gallery-carousel-background: $color-background-alt +// Block image +$block-image-max-height-with-sidebar: calc(100vh - var(--header-height)) !default +$block-image-max-height-without-sidebar: none !default + // Sections $article-title-size: $h4-size !default $article-title-size-md: $h4-size-md !default diff --git a/assets/sass/_theme/blocks/image.sass b/assets/sass/_theme/blocks/image.sass index d665ef01f981b36fd08067b382a84868e5abec4e..9e8342e38779f1a38da60928390283e6fdfb36f2 100644 --- a/assets/sass/_theme/blocks/image.sass +++ b/assets/sass/_theme/blocks/image.sass @@ -18,14 +18,13 @@ margin-left: calc(-#{$grid-gutter-sm} / 2) margin-right: calc(-#{$grid-gutter-sm} / 2) - @include in-page-with-sidebar @include media-breakpoint-up(md) picture margin-left: 0 margin-right: -$grid-gutter img - max-height: calc(100vh - var(--header-height)) + max-height: $block-image-max-height-with-sidebar width: auto @include in-page-without-sidebar @include media-breakpoint-up(md) @@ -44,10 +43,9 @@ order: 2 picture margin-left: 0 - margin-right: -$grid-gutter - // text-align: right - // img - // display: inline + margin-right: -$grid-gutterxz + img + max-height: $block-image-max-height-without-sidebar figcaption width: calc(#{col(5)} + #{$grid-gutter} / 2) order: 1 diff --git a/assets/sass/_theme/blocks/video.sass b/assets/sass/_theme/blocks/video.sass index 83ca5396c458f1064903993ef224db5d160bd578..283532620d271c7dec82c62c47d355cb7de4cfde 100644 --- a/assets/sass/_theme/blocks/video.sass +++ b/assets/sass/_theme/blocks/video.sass @@ -1,5 +1,3 @@ -/* TODO : https://developer.mozilla.org/fr/docs/Web/HTML/Element/details */ - .block-video .video @include aspect-ratio(16/9, 'iframe') @@ -13,4 +11,3 @@ .video margin-left: calc(-#{$grid-gutter-sm} / 2) margin-right: calc(-#{$grid-gutter-sm} / 2) - diff --git a/layouts/partials/blocks/templates/image.html b/layouts/partials/blocks/templates/image.html index 52b1b8a10bbb0d8937cafcd3ff71bdee2395e619..0d1532f4977eb0b582a8cc7edc78ac9b67e4339b 100644 --- a/layouts/partials/blocks/templates/image.html +++ b/layouts/partials/blocks/templates/image.html @@ -36,7 +36,7 @@ "alt" .alt "mobile" "480x850" "tablet" "768x1360" - "desktop" "1024x1820" + "desktop" "1400x1820" )}} </a> <figcaption>