Move component .js-enabled styling to .govuk-frontend-supported

This closes the support gap for browsers without ES module support still loading JavaScript-only styles
alphagov · Jun 12, 2023 · 73c692f · 73c692f
1 parent b9a4649
commit 73c692f
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 10 deletions.
diff --git a/packages/govuk-frontend/src/govuk/components/accordion/_index.scss b/packages/govuk-frontend/src/govuk/components/accordion/_index.scss
@@ -35,8 +35,8 @@
     margin-bottom: 0;
   }
 
-  // JavaScript enabled
-  .js-enabled {
+  // GOV.UK Frontend JavaScript enabled
+  .govuk-frontend-supported {
     .govuk-accordion {
       // Border at the bottom of the whole accordion
       border-bottom: $govuk-accordion-bottom-border-width solid $govuk-border-colour;

diff --git a/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss b/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss
@@ -134,7 +134,7 @@
 
   .govuk-checkboxes__input:disabled + .govuk-checkboxes__label,
   .govuk-checkboxes__input:disabled ~ .govuk-hint {
-    opacity: .5;
+    opacity: 0.5;
   }
 
   // =========================================================
@@ -170,7 +170,7 @@
     padding-left: $conditional-padding-left;
     border-left: $conditional-border-width solid $govuk-border-colour;
 
-    .js-enabled &--hidden {
+    .govuk-frontend-supported &--hidden {
       display: none;
     }
 

diff --git a/packages/govuk-frontend/src/govuk/components/header/_index.scss b/packages/govuk-frontend/src/govuk/components/header/_index.scss
@@ -202,12 +202,12 @@
       top: govuk-spacing(3);
     }
 
-    .js-enabled & {
+    .govuk-frontend-supported & {
       display: block;
     }
 
     &[hidden],
-    .js-enabled &[hidden] {
+    .govuk-frontend-supported &[hidden] {
       display: none;
     }
   }

diff --git a/packages/govuk-frontend/src/govuk/components/radios/_index.scss b/packages/govuk-frontend/src/govuk/components/radios/_index.scss
@@ -134,7 +134,7 @@
 
   .govuk-radios__input:disabled + .govuk-radios__label,
   .govuk-radios__input:disabled ~ .govuk-hint {
-    opacity: .5;
+    opacity: 0.5;
   }
 
   // =========================================================
@@ -186,7 +186,7 @@
     padding-left: $conditional-padding-left;
     border-left: $conditional-border-width solid $govuk-border-colour;
 
-    .js-enabled &--hidden {
+    .govuk-frontend-supported &--hidden {
       display: none;
     }
 

diff --git a/packages/govuk-frontend/src/govuk/components/tabs/_index.scss b/packages/govuk-frontend/src/govuk/components/tabs/_index.scss
@@ -41,8 +41,8 @@
     @include govuk-responsive-margin(8, "bottom");
   }
 
-  // JavaScript enabled
-  .js-enabled {
+  // GOV.UK Frontend JavaScript enabled
+  .govuk-frontend-supported {
 
     @include govuk-media-query($from: tablet) {
       .govuk-tabs__list {