Using the placeholder selector, we weren't overwriting the rules in the mixin called with `@include` in some cases because in the generated CSS the placeholder selector appeared before the code generated by the calls to `@include`.
41 lines
647 B
SCSS
41 lines
647 B
SCSS
@mixin base-button {
|
|
font-size: $base-font-size;
|
|
|
|
&:focus,
|
|
&:hover {
|
|
text-decoration: none !important;
|
|
}
|
|
}
|
|
|
|
%button {
|
|
@include base-button;
|
|
}
|
|
|
|
@mixin regular-button($color: $brand) {
|
|
@include button($background: $color);
|
|
@include inverted-selection;
|
|
@include base-button;
|
|
}
|
|
|
|
@mixin hollow-button($color: $link) {
|
|
@include button($style: hollow, $background: $color);
|
|
@include normal-selection;
|
|
@include base-button;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
@mixin link {
|
|
color: $link;
|
|
cursor: pointer;
|
|
|
|
&:hover,
|
|
&:active {
|
|
color: $link-hover;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
&:focus {
|
|
outline: $outline-focus;
|
|
}
|
|
}
|