Use max() to enforce a minimum chevron size

alphagov · Nov 28, 2022 · f721773 · f721773
1 parent f09e9f4
commit f721773
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 0 deletions.
diff --git a/src/govuk/components/back-link/_index.scss b/src/govuk/components/back-link/_index.scss
@@ -61,6 +61,9 @@
 
     @supports (border-width: unquote("max(0px)")) {
       border-width: unquote("max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})") 0 0;
+
+      // Ensure that the chevron never gets smaller than 16px
+      font-size: unquote("max(#{$font-size * 1px}, 1em)");
     }
 
     // Fall back to a less than sign for IE8

diff --git a/src/govuk/components/breadcrumbs/_index.scss b/src/govuk/components/breadcrumbs/_index.scss
@@ -83,6 +83,9 @@
 
       @supports (border-width: unquote("max(0px)")) {
         border-width: unquote("max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})") 0 0;
+
+        // Ensure that the chevron never gets smaller than 16px
+        font-size: unquote("max(#{$font-size * 1px}, 1em)");
       }
 
       // Fall back to a greater than sign for IE8