Reduce specicifity of some CSS selectors for card elements

nationalarchives · Oct 23, 2024 · 9da595e · 9da595e
1 parent 72f9af9
commit 9da595e
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Updated header and global header HTML to allow adornable logos
+- Reduced specicifity of some CSS selectors for card elements
 
 ### Deprecated
 ### Removed

diff --git a/src/nationalarchives/components/card/card.scss b/src/nationalarchives/components/card/card.scss
@@ -201,23 +201,23 @@
   @include media.on-larger-than-mobile {
     @include horizontal-card-layout("--horizontal", 2);
 
-    &--horizontal#{&}--horizontal-small-image {
+    &--horizontal-small-image {
       grid-template-columns: max(10rem, 25%) 1fr;
     }
 
-    &--horizontal#{&}--horizontal-small-image#{&}--flipped {
+    &--horizontal-small-image#{&}--flipped {
       grid-template-columns: 1fr max(10rem, 25%);
     }
   }
 
   @include media.on-small {
     @include horizontal-card-layout("--horizontal-on-small", 1);
 
-    &--horizontal-on-small#{&}--horizontal-small-image {
+    &--horizontal-small-image {
       grid-template-columns: max(10rem, 25%) 1fr;
     }
 
-    &--horizontal-on-small#{&}--horizontal-small-image#{&}--flipped {
+    &--horizontal-small-image#{&}--flipped {
       grid-template-columns: 1fr max(10rem, 25%);
     }
   }