Project

General

Profile

Download (1.24 KB) Statistics
| Branch: | Tag: | Revision:
1
// Mixins
2
// --------------------------
3

    
4
@mixin fa-icon {
5
  -webkit-font-smoothing: antialiased;
6
  -moz-osx-font-smoothing: grayscale;
7
  display: inline-block;
8
  font-style: normal;
9
  font-variant: normal;
10
  font-weight: normal;
11
  line-height: 1;
12
}
13

    
14
@mixin fa-icon-rotate($degrees, $rotation) {
15
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})";
16
  transform: rotate($degrees);
17
}
18

    
19
@mixin fa-icon-flip($horiz, $vert, $rotation) {
20
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)";
21
  transform: scale($horiz, $vert);
22
}
23

    
24

    
25
// Only display content to screen readers. A la Bootstrap 4.
26
//
27
// See: http://a11yproject.com/posts/how-to-hide-content/
28

    
29
@mixin sr-only {
30
  border: 0;
31
  clip: rect(0, 0, 0, 0);
32
  height: 1px;
33
  margin: -1px;
34
  overflow: hidden;
35
  padding: 0;
36
  position: absolute;
37
  width: 1px;
38
}
39

    
40
// Use in conjunction with .sr-only to only display content when it's focused.
41
//
42
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
43
//
44
// Credit: HTML5 Boilerplate
45

    
46
@mixin sr-only-focusable {
47
  &:active,
48
  &:focus {
49
    clip: auto;
50
    height: auto;
51
    margin: 0;
52
    overflow: visible;
53
    position: static;
54
    width: auto;
55
  }
56
}
(8-8/18)