Use :where() for link styling

Bug: T376394
Bug: T376361
Bug: T376126
Bug: T376098
Bug: T376363
Bug: T367892
Bug: T375994
Change-Id: I91b34a1b2bffaf1bebe2d60abd8b44877182d45e
This commit is contained in:
Jdrewniak 2024-10-03 14:12:18 -04:00 committed by Jdlrobson
parent 678d02b1cd
commit faf428550b
2 changed files with 10 additions and 16 deletions

View file

@ -2,6 +2,15 @@
@import '../../../minerva.less/minerva.variables.less'; @import '../../../minerva.less/minerva.variables.less';
@import '../../../minerva.less/minerva.mixins.less'; @import '../../../minerva.less/minerva.mixins.less';
/* This not does apply to links with role button per discussion on T373989 */
a:where( :not( [ role='button' ] ) ) {
.cdx-mixin-link-base();
}
a:where( .new:not( [ role='button' ] ) ) {
.cdx-mixin-link-red();
}
/** /**
* Note that certain links may not have an href selector. * Note that certain links may not have an href selector.
* It is particularly important on wikis for example inside navbox's that these * It is particularly important on wikis for example inside navbox's that these
@ -18,22 +27,6 @@ a:not( [ href ] ) {
cursor: pointer; cursor: pointer;
} }
/* stylelint-disable selector-max-id */
footer,
.cdx-message,
.mw-body-content,
#mw-content-subtitle {
/* This not does apply to links with role button per discussion on T373989 */
a:not( [ role='button' ] ):not( .mw-selflink ):not( .cdx-card ) {
.cdx-mixin-link-base();
&.new {
.cdx-mixin-link-red();
}
}
}
/* stylelint-enable selector-max-id */
// External links // External links
// Use of `a` element selector due to its widespread usage and for limiting generic class scope. // Use of `a` element selector due to its widespread usage and for limiting generic class scope.
// `a.external` is for footer's “Creative Commons” license link only. // `a.external` is for footer's “Creative Commons” license link only.

View file

@ -19,6 +19,7 @@
.toggle-list-item__anchor:hover { .toggle-list-item__anchor:hover {
box-shadow: inset 4px 0 0 0 @box-shadow-color-progressive--focus; box-shadow: inset 4px 0 0 0 @box-shadow-color-progressive--focus;
text-decoration: none;
} }
.client-nojs & .skin-minerva-list-item-jsonly { .client-nojs & .skin-minerva-list-item-jsonly {