diff --git a/changes/16133-icons b/changes/16133-icons new file mode 100644 index 0000000000..27202b9e1a --- /dev/null +++ b/changes/16133-icons @@ -0,0 +1 @@ +* Fix visual display of chevron right icons on Chrome diff --git a/frontend/components/buttons/Button/_styles.scss b/frontend/components/buttons/Button/_styles.scss index c8d842efca..c2e78a9b81 100644 --- a/frontend/components/buttons/Button/_styles.scss +++ b/frontend/components/buttons/Button/_styles.scss @@ -245,9 +245,12 @@ $base-class: "button"; } } - // These buttons use stroke color instead of fill color to darken + // The SVG icons in these buttons contain a `stroke` instead of a `fill`, + // so we need to modify that property instead. Adding a custom `fill` + // could make these icons render incorrectly. &.input-field__copy-value-button, - &.windows-details-button { + &.windows-details-button, + [data-testid="chevron-right-icon"] { svg { path { fill: none;