@mixin font-smoothing($value: on)
@if $value == on
-webkit-font-smoothing: antialiased
-moz-osx-font-smoothing: grayscale
@else
-webkit-font-smoothing: subpixel-antialiased
-moz-osx-font-smoothing: auto
@mixin font-size($sizeValue: 1.6)
font-size: ($sizeValue * 10) + px
font-size: $sizeValue + rem
@mixin aspect-ratio($width, $height)
position: relative
&:before
display: block
content: ""
width: 100%
padding-top: ($height / $width) * 100%
> .content
position: absolute
top: 0
left: 0
right: 0
bottom: 0
@mixin vertical-align($position: relative)
position: $position
top: 50%
-webkit-transform: translateY(-50%)
-ms-transform: translateY(-50%)
transform: translateY(-50%)
Helpful list of SASS mixins that I use with almost every project.
1 Response
Write a comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.