Remove :has CSS selectors (#62)

nationalarchives · Dec 7, 2023 · e2d68b2 · e2d68b2
1 parent a7b471f
commit e2d68b2
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Chip colours and icons in chip lists fixed
 - Better support for `<dl class="tna-dl">` elements
+- Removed some `:has` CSS selectors for better support with Firefox
 
 ### Security
 

diff --git a/src/nationalarchives/components/button/button.scss b/src/nationalarchives/components/button/button.scss
@@ -128,22 +128,22 @@
     }
   }
 
-  &--icon-only:has(.fa-solid, .fa-brands) {
+  &--icon-only {
     @include icon-only;
   }
 
-  &--small#{&}--icon-only:has(.fa-solid, .fa-brands),
-  &-group--small &--icon-only:has(.fa-solid, .fa-brands) {
+  &--small#{&}--icon-only,
+  &-group--small &--icon-only {
     @include icon-only-small;
   }
 
   @include media.on-mobile {
-    &--icon-only-mobile:has(.fa-solid, .fa-brands) {
+    &--icon-only-mobile {
       @include icon-only;
     }
 
-    &--small#{&}--icon-only-mobile:has(.fa-solid, .fa-brands),
-    &-group--small &--icon-only-mobile:has(.fa-solid, .fa-brands) {
+    &--small#{&}--icon-only-mobile,
+    &-group--small &--icon-only-mobile {
       @include icon-only-small;
     }
   }

diff --git a/src/nationalarchives/components/footer/footer.scss b/src/nationalarchives/components/footer/footer.scss
@@ -70,11 +70,8 @@
         &-text {
         }
 
-        &:has(.fa-solid),
-        &:has(.fa-brands) {
-          &:hover {
-            @include colour.colour-border("link", 4px, solid, bottom);
-          }
+        &:hover {
+          @include colour.colour-border("link", 4px, solid, bottom);
         }
       }
     }