From 24384d551de78965b9bbee8be676e62afb8eb3a7 Mon Sep 17 00:00:00 2001
From: Andrew Hosgood <andrew.hosgood@nationalarchives.gov.uk>
Date: Mon, 14 Oct 2024 18:14:02 +0100
Subject: [PATCH] Fix layout of horizontal cards with no images

---
 CHANGELOG.md                                   | 1 +
 src/nationalarchives/components/card/card.scss | 8 ++++++++
 2 files changed, 9 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 79e977a8..a756ed73 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
 - Updated deprecated `color.red()`, `color.green()` and `color.blue()` SASS functions
 - Fixed layout issues for fullscreen gallery components when viewed in landscape
 - Removed list marker colour on yellow accented blocks
+- Fixed layout of horizontal cards with no images
 
 ### Security
 
diff --git a/src/nationalarchives/components/card/card.scss b/src/nationalarchives/components/card/card.scss
index 480f9f60..3d694ac4 100644
--- a/src/nationalarchives/components/card/card.scss
+++ b/src/nationalarchives/components/card/card.scss
@@ -31,6 +31,10 @@
     }
   }
 
+  &#{$modifierClass}:not(:has(&__image-container)) {
+    grid-template-columns: 0 100%;
+  }
+
   &#{$modifierClass}#{&}--flipped {
     grid-template-areas:
       "header image"
@@ -38,6 +42,10 @@
       "footer image";
   }
 
+  &#{$modifierClass}#{&}--flipped:not(:has(&__image-container)) {
+    grid-template-columns: 100% 0;
+  }
+
   &#{$modifierClass} &__heading,
   &#{$modifierClass} &__body {
     padding-right: spacing.space($innerPaddingAmount);