diff --git a/lib/css/components/_stacks-buttons.less b/lib/css/components/_stacks-buttons.less index e54d492c65..d96a982211 100644 --- a/lib/css/components/_stacks-buttons.less +++ b/lib/css/components/_stacks-buttons.less @@ -34,7 +34,13 @@ cursor: pointer; user-select: none; - .highcontrast-mode({ border-color: currentColor; }); + .highcontrast-mode({ + border-color: currentColor; + + &:not(.s-btn__link):not(.s-btn__unset) { + text-decoration: none; + } + }); button &, button[type="submit"] &, diff --git a/lib/css/components/_stacks-cards.less b/lib/css/components/_stacks-cards.less index bff619edb3..63f95fa893 100644 --- a/lib/css/components/_stacks-cards.less +++ b/lib/css/components/_stacks-cards.less @@ -24,17 +24,6 @@ } } -// ============================================================================ -// $ LINKED CARDS -// ---------------------------------------------------------------------------- -a.s-card:not(.s-card__muted) { - &:hover, - &:focus, - &:active { - border-color: var(--bc-darker); - } -} - // ============================================================================ // $ MODIFIERS // ---------------------------------------------------------------------------- @@ -46,3 +35,10 @@ a.s-card:not(.s-card__muted) { opacity: 0.65; } } + +// ============================================================================ +// $ LINKED CARDS +// ---------------------------------------------------------------------------- +a.s-card { + text-decoration: none !important; +} diff --git a/lib/css/components/_stacks-link-previews.less b/lib/css/components/_stacks-link-previews.less index c6ceb8552e..d127e13300 100644 --- a/lib/css/components/_stacks-link-previews.less +++ b/lib/css/components/_stacks-link-previews.less @@ -44,6 +44,8 @@ a.s-link-preview--title { &.s-link__visited:visited { color: var(--theme-link-color); text-decoration: none; + + .highcontrast-mode({ text-decoration: underline; }); } &:hover, @@ -52,6 +54,8 @@ a.s-link-preview--title { &.s-link__visited:active { color: var(--theme-link-color-hover); text-decoration: none; + + .highcontrast-mode({ text-decoration: underline; }); } } diff --git a/lib/css/components/_stacks-links.less b/lib/css/components/_stacks-links.less index 36c705390f..739decaf20 100644 --- a/lib/css/components/_stacks-links.less +++ b/lib/css/components/_stacks-links.less @@ -21,9 +21,12 @@ a, cursor: pointer; user-select: auto; + .highcontrast-mode({ + text-decoration: underline; + }); + &.s-link__visited:visited { color: var(--theme-link-color-visited); - text-decoration: none; } &:hover, @@ -31,7 +34,6 @@ a, &:active, &.s-link__visited:active { color: var(--theme-link-color-hover); - text-decoration: none; } &.s-link__grayscale { diff --git a/lib/css/components/_stacks-navigation.less b/lib/css/components/_stacks-navigation.less index af14547479..ccf999f3e3 100644 --- a/lib/css/components/_stacks-navigation.less +++ b/lib/css/components/_stacks-navigation.less @@ -56,6 +56,14 @@ &.is-selected { background: var(--theme-primary-color); color: var(--white); + + .highcontrast-mode({ text-decoration: none; }); + + &:hover, + &:active { + background: var(--theme-primary-600); + color: var(--white); + } } &.s-navigation--item__dropdown { diff --git a/lib/css/components/_stacks-pagination.less b/lib/css/components/_stacks-pagination.less index 1732e843c2..28bf349527 100644 --- a/lib/css/components/_stacks-pagination.less +++ b/lib/css/components/_stacks-pagination.less @@ -30,6 +30,8 @@ line-height: @lh-xl; color: var(--fc-medium); + .highcontrast-mode({ text-decoration: none; }); + &:hover { border-color: var(--bc-darker); background-color: var(--black-100); diff --git a/lib/css/components/_stacks-tags.less b/lib/css/components/_stacks-tags.less index e9031f9d44..c5c5d99ab0 100644 --- a/lib/css/components/_stacks-tags.less +++ b/lib/css/components/_stacks-tags.less @@ -84,6 +84,8 @@ .s-tag-styles(@tags-border, @tags-background, @tags-color); + .highcontrast-mode({ text-decoration: none; }); + &.is-selected { .s-tag-selected-styles(@tags-selected-border, @tags-selected-background, @tags-selected-color); }