Merge pull request #16390 from craftcms/bugfix/style-tweaks

focus ring & var style tweaks for 5.6
craftcms · Jan 6, 2025 · d7f328e · d7f328e
2 parents c47aed7 + 013392e
commit d7f328e
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 6 deletions.
diff --git a/src/web/assets/cp/dist/css/cp.css b/src/web/assets/cp/dist/css/cp.css
diff --git a/src/web/assets/cp/dist/css/cp.css.map b/src/web/assets/cp/dist/css/cp.css.map
diff --git a/src/web/assets/cp/src/css/_main.scss b/src/web/assets/cp/src/css/_main.scss
@@ -62,6 +62,9 @@
   --light-focus-hsl: #{color.hue(mixins.$lightFocusColor)},
     #{color.saturation(mixins.$lightFocusColor)},
     #{color.lightness(mixins.$lightFocusColor)};
+  --dark-focus-hsl: #{color.hue(mixins.$darkFocusColor)},
+    #{color.saturation(mixins.$darkFocusColor)},
+    #{color.lightness(mixins.$darkFocusColor)};
   --focus-ring: 0 0 0 2px var(--focus-ring-color),
     0 0 5px 1px
       hsl(from var(--focus-ring-color) h s l / var(--focus-ring-alpha));

diff --git a/src/web/assets/craftsupport/dist/css/CraftSupportWidget.css b/src/web/assets/craftsupport/dist/css/CraftSupportWidget.css
diff --git a/src/web/assets/craftsupport/dist/css/CraftSupportWidget.css.map b/src/web/assets/craftsupport/dist/css/CraftSupportWidget.css.map
diff --git a/src/web/assets/craftsupport/src/CraftSupportWidget.scss b/src/web/assets/craftsupport/src/CraftSupportWidget.scss
@@ -30,8 +30,8 @@
 
       .cs-screen-home {
         .cs-opt {
-          --focus-ring: inset 0 0 0 1px hsl(var(--dark-focus-hsl)),
-            inset 0 0 0 3px hsl(var(--dark-focus-hsl) 0.7);
+          --focus-ring: inset 0 0 0 1px var(--focus-ring-color),
+            inset 0 0 0 3px var(--focus-ring-color);
           display: block;
           padding: 24px;
           text-align: center;