From 76df7f31f750a0e3c66f346195adc838aa6358fb Mon Sep 17 00:00:00 2001 From: Andrew Hosgood Date: Mon, 5 Feb 2024 18:07:22 +0000 Subject: [PATCH 1/2] Change hero image size --- CHANGELOG.md | 1 + src/nationalarchives/components/hero/hero.scss | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index cf7d30e3..15d55f7c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Added more space between the text and chevron in a heading link - Split out Font Awesome into a separate CSS file - Change the default `htmlLang` from `en-GB` to `en` +- Changed the aspect ratio of the hero image to be closer to a 3:1 ### Deprecated ### Removed diff --git a/src/nationalarchives/components/hero/hero.scss b/src/nationalarchives/components/hero/hero.scss index a29c9b26..40e42db0 100644 --- a/src/nationalarchives/components/hero/hero.scss +++ b/src/nationalarchives/components/hero/hero.scss @@ -8,7 +8,7 @@ @include colour.contrast-on-mobile; &__figure { - min-height: min(35vw, 480px); + min-height: clamp(12rem, calc(33vw - 12rem), 50vh); margin: 0; padding-top: 8rem; padding-bottom: 4rem; @@ -194,6 +194,7 @@ @include media.on-mobile { &__figure { + min-height: auto; padding: 0; flex-direction: column; From a8fe35d4d32f02c14d370090bce4ff98c29034e2 Mon Sep 17 00:00:00 2001 From: Andrew Hosgood Date: Mon, 5 Feb 2024 18:10:29 +0000 Subject: [PATCH 2/2] Change hero image size --- src/nationalarchives/components/hero/hero.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/nationalarchives/components/hero/hero.scss b/src/nationalarchives/components/hero/hero.scss index 40e42db0..ecb4acc3 100644 --- a/src/nationalarchives/components/hero/hero.scss +++ b/src/nationalarchives/components/hero/hero.scss @@ -8,7 +8,7 @@ @include colour.contrast-on-mobile; &__figure { - min-height: clamp(12rem, calc(33vw - 12rem), 50vh); + min-height: clamp(12rem, calc(33vw - 12rem), 63rem); margin: 0; padding-top: 8rem; padding-bottom: 4rem;