35bf07bab6
migrate the fontawesome to the latest library in the idea to use the last one (more complete) to use fontawesome icons instead of images. Font awesome 5.4.1 is leighter than the previous loaded version.
58 lines
1.2 KiB
Plaintext
58 lines
1.2 KiB
Plaintext
// Mixins
|
|
// --------------------------
|
|
|
|
.fa-icon() {
|
|
-moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
display: inline-block;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
font-weight: normal;
|
|
line-height: 1;
|
|
vertical-align: -.125em;
|
|
}
|
|
|
|
.fa-icon-rotate(@degrees, @rotation) {
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=@{rotation})";
|
|
transform: rotate(@degrees);
|
|
}
|
|
|
|
.fa-icon-flip(@horiz, @vert, @rotation) {
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=@{rotation}, mirror=1)";
|
|
transform: scale(@horiz, @vert);
|
|
}
|
|
|
|
|
|
// Only display content to screen readers. A la Bootstrap 4.
|
|
//
|
|
// See: http://a11yproject.com/posts/how-to-hide-content/
|
|
|
|
.sr-only() {
|
|
border: 0;
|
|
clip: rect(0,0,0,0);
|
|
height: 1px;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
padding: 0;
|
|
position: absolute;
|
|
width: 1px;
|
|
}
|
|
|
|
// Use in conjunction with .sr-only to only display content when it's focused.
|
|
//
|
|
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
|
|
//
|
|
// Credit: HTML5 Boilerplate
|
|
|
|
.sr-only-focusable() {
|
|
&:active,
|
|
&:focus {
|
|
clip: auto;
|
|
height: auto;
|
|
margin: 0;
|
|
overflow: visible;
|
|
position: static;
|
|
width: auto;
|
|
}
|
|
}
|