Skip to content

Instantly share code, notes, and snippets.

@Oldenborg
Last active November 11, 2021 23:39
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Oldenborg/a443e3c7ac1333d6e00ef6dd42563876 to your computer and use it in GitHub Desktop.
Save Oldenborg/a443e3c7ac1333d6e00ef6dd42563876 to your computer and use it in GitHub Desktop.
=vendor($attribute, $value)
-webkit-#{$attribute}: #{$value}
-moz-#{$attribute}: #{$value}
-ms-#{$attribute}: #{$value}
-o-#{$attribute}: #{$value}
#{$attribute}: #{$value}
=rotate($deg)
display: inline-block
+vendor(transform, rotate(#{$deg}deg))
=e($name)
@at-root #{&}__#{$name}
@content
=has($name)
@at-root #{&}__#{$name}
@content
=m($name)
@at-root #{&}--#{$name}
@content
=when($name)
@at-root #{&}--#{$name}
@content
=if($modifiers)
@each $modifier in $modifiers
@at-root #{&}--#{$modifier}
@content
=then($elements)
@each $element in $elements
@at-root #{&} .#{$block}__#{$element}
@content
=on($modifiers)
@each $modifier in $modifiers
@at-root .#{$block}--#{$modifier} #{&}
@content
=component()
@at-root .#{$block}
@content
=circle()
+vendor('border-radius', '100%')
=screen-is-xs()
@media (max-width: 48em)
@content
=screen-is-sm()
@media (min-width: 48em)
@content
=screen-is-md()
@media (min-width: 64em)
@content
=screen-is-lg()
@media (min-width: 75em)
@content
=position($top, $right: $top, $bottom: $top, $left: $right)
position: absolute
top: $top
right: $right
bottom: $bottom
left: $left
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment