Font-Awesome/scss/_mixins.scss
Macdonald, Zak cd77695e1b SASS refactor, changes outlined below:
**functions.scss**
- added convenience functions
  - `fudge` fudge a number from 0-6 decimal places
  - `unitless` simple hack to parse a number from a unit

**icons.scss**
- removed explicit definitions in favor of a loop iterating `$fa-var-glyphs`

**mixins.scss**
- removed requirement to pass `$rotation` to `@fa-icon-rotate`, it is now calculated
  - calculation required since `$fa-rotation-increment` is configurable, meaning not every rotation may adhere to 90 degree increments requiring $rotation

**rotated-flipped.scss**
- rotations are now calculated by a loop iterating `$fa-rotation-increment`
- the ie fix is now calculated using a loop iterating only the rotation selectors requiring intervention
  - this is required now that `$fa-rotation-increment` eists

**sizes.scss**
- sizes are now calculated by a loop iterating `$fa-var-scales`
  - this new method supports the existing `.fa-lg` selector, as well as introducing: `.fa-xsm` (33%), `.fa-sm` (66%x), `.fa-default` (100%), `.fa-xlg` (166%)
- multipliers are now calculated by a loop iterating `$fa-var-multipliers`
  - this new method supports all existing multipliers (`.fa-2x`, `.fa-3x`, `.fa-4x`, `.fa-5x`)

**variables.scss**
- added variables:
  - deprecated explicit icon variables in favor of an array value (`$fa-var-glyphs`)
  - `$fa-rotation-increment`
  - `$fa-var-scales`
  - `$fa-var-multipliers`

**font-awesome.scss**
- added `functions.scss`

**misc.**
- minor code cleanup
2015-06-28 18:26:27 -07:00

32 lines
1.1 KiB
SCSS

// Mixins
// --------------------------
@mixin fa-icon() {
display: inline-block;
font: normal normal normal #{$fa-font-size-base}/1 FontAwesome; // shortening font declaration
font-size: inherit; // can't have font-size inherit on line above, so need to override
text-rendering: auto; // optimizelegibility throws things off #1094
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0); // ensures no half-pixel rendering in firefox
}
@mixin fa-icon-rotate($degrees) {
// check if this ie fix is necessary
@if $degrees % 90 == 0 {
$rotation: $degrees / 90;
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation});
}
-webkit-transform: rotate(#{$degrees}deg);
-ms-transform: rotate(#{$degrees}deg);
transform: rotate(#{$degrees}deg);
}
@mixin fa-icon-flip($horiz, $vert, $rotation) {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation});
-webkit-transform: scale($horiz, $vert);
-ms-transform: scale($horiz, $vert);
transform: scale($horiz, $vert);
}