Extract selector for admin menu icon

This way we'll be able to apply it to the SDG icon, which is not
included in font-awesome.

Note we're adding a font-icon selector so it's defined before the
admin-menu-icon selector and so in case of conflicting rules the ones in
the admin-menu-icon selector are used.
This commit is contained in:
Javi Martín
2020-12-02 12:34:13 +01:00
parent 428644cd3e
commit 2b6c9914dd
2 changed files with 15 additions and 7 deletions

View File

@@ -17,9 +17,7 @@
@include has-fa-icon($name, $style);
&::before {
font-size: rem-calc(20);
margin-left: rem-calc(8);
margin-right: rem-calc(10);
@extend %admin-menu-icon;
}
}

View File

@@ -141,6 +141,13 @@
}
}
%font-icon {
@extend %fa-icon;
font-family: "Font Awesome 5 Free";
margin-right: rem-calc(4);
vertical-align: middle;
}
%svg-icon {
background: currentcolor;
content: "";
@@ -150,14 +157,17 @@
width: 1em;
}
%admin-menu-icon {
font-size: rem-calc(20);
margin-left: rem-calc(8);
margin-right: rem-calc(10);
}
@mixin has-fa-icon($icon, $style) {
@extend .fa-#{$icon};
&::before {
@extend %fa-icon;
font-family: "Font Awesome 5 Free";
margin-right: rem-calc(4);
vertical-align: middle;
@extend %font-icon;
@if $style == "regular" {
font-weight: normal;