X-Git-Url: https://git.heureux-cyclage.org/?a=blobdiff_plain;f=resources%2Fsrc%2Fmediawiki.ui%2Fcomponents%2Fanchors.less;h=f0fb7b95b326f6c305a8162527caf77de380f385;hb=73a1b801e6627d5be2d01804674f8b21abb31806;hp=1a58170308a1da7e619da85a6541abdaef99b428;hpb=bba96259fc3a745f94cd1b8f8b6cef30133686dd;p=lhc%2Fweb%2Fwiklou.git
diff --git a/resources/src/mediawiki.ui/components/anchors.less b/resources/src/mediawiki.ui/components/anchors.less
index 1a58170308..f0fb7b95b3 100644
--- a/resources/src/mediawiki.ui/components/anchors.less
+++ b/resources/src/mediawiki.ui/components/anchors.less
@@ -22,18 +22,6 @@
}
}
-.mixin-mw-ui-anchor-styles-quiet( @mainColor ) {
- color: @colorTextLight;
- text-decoration: none;
-
- &:hover {
- color: @mainColor;
- }
- &:focus, &:active {
- color: darken( @mainColor, @colorDarkenPercentage );
- }
-}
-
/*
Anchors
@@ -42,16 +30,16 @@ having to assign it as a button type. mw-ui-anchor only changes the text color,
with other base classes, such as mw-ui-button.
Markup:
-Progressive
-Constructive
-Destructive
+Progressive
+Constructive
+Destructive
.mw-ui-quiet - Quiet until interaction.
Styleguide 6.2.
*/
-// Setup compound anchor selectors (such as .mw-ui-anchor.my-ui-progressive)
+// Setup compound anchor selectors (such as .mw-ui-anchor.mw-ui-progressive)
.mw-ui-anchor {
&.mw-ui-progressive {
.mixin-mw-ui-anchor-styles( @colorProgressive );
@@ -65,3 +53,28 @@ Styleguide 6.2.
.mixin-mw-ui-anchor-styles( @colorDestructive );
}
}
+
+/*
+Quiet anchors
+
+Use quiet anchors when they are less important and alongside other progressive/destructive/progressive
+anchors. Use of quiet anchors is not recommended on mobile/tablet due to lack of hover state.
+
+Markup:
+Progressive
+Constructive
+Destructive
+
+Styleguide 6.2.1.
+*/
+.mixin-mw-ui-anchor-styles-quiet( @mainColor ) {
+ color: @colorTextLight;
+ text-decoration: none;
+
+ &:hover {
+ color: @mainColor;
+ }
+ &:focus, &:active {
+ color: darken( @mainColor, @colorDarkenPercentage );
+ }
+}