-
-
Save mirisuzanne/3716546 to your computer and use it in GitHub Desktop.
// Apply any css property/value pair. | |
@mixin css( | |
$azimuth: null, | |
$background: null, | |
$background-attachment: null, | |
$background-color: null, | |
$background-image: null, | |
$background-position: null, | |
$background-repeat: null, | |
$border: null, | |
$border-collapse: null, | |
$border-color: null, | |
$border-spacing: null, | |
$border-style: null, | |
$border-top: null, | |
$border-right: null, | |
$border-bottom: null, | |
$border-left: null, | |
$border-top-color: null, | |
$border-right-color: null, | |
$border-bottom-color: null, | |
$border-left-color: null, | |
$border-top-style: null, | |
$border-right-style: null, | |
$border-bottom-style: null, | |
$border-left-style: null, | |
$border-top-width: null, | |
$border-right-width: null, | |
$border-bottom-width: null, | |
$border-left-width: null, | |
$border-width: null, | |
$bottom: null, | |
$caption-side: null, | |
$clear: null, | |
$clip: null, | |
$color: null, | |
$content: null, | |
$counter-increment: null, | |
$counter-reset: null, | |
$cue: null, | |
$cue-after: null, | |
$cue-before: null, | |
$cursor: null, | |
$direction: null, | |
$display: null, | |
$elevation: null, | |
$empty-cells: null, | |
$float: null, | |
$font: null, | |
$font-family: null, | |
$font-size: null, | |
$font-size-adjust: null, | |
$font-stretch: null, | |
$font-style: null, | |
$font-variant: null, | |
$font-weight: null, | |
$height: null, | |
$left: null, | |
$letter-spacing: null, | |
$line-height: null, | |
$list-style: null, | |
$list-style-image: null, | |
$list-style-position: null, | |
$list-style-type: null, | |
$margin: null, | |
$margin-top: null, | |
$margin-right: null, | |
$margin-bottom: null, | |
$margin-left: null, | |
$marker-offset: null, | |
$marks: null, | |
$max-height: null, | |
$max-width: null, | |
$min-height: null, | |
$min-width: null, | |
$orphans: null, | |
$outline: null, | |
$outline-color: null, | |
$outline-style: null, | |
$outline-width: null, | |
$overflow: null, | |
$padding: null, | |
$padding-top: null, | |
$padding-right: null, | |
$padding-bottom: null, | |
$padding-left: null, | |
$page: null, | |
$page-break-after: null, | |
$page-break-before: null, | |
$page-break-inside: null, | |
$pause: null, | |
$pause-after: null, | |
$pause-before: null, | |
$pitch: null, | |
$pitch-range: null, | |
$play-during: null, | |
$position: null, | |
$quotes: null, | |
$richness: null, | |
$right: null, | |
$size: null, | |
$speak: null, | |
$speak-header: null, | |
$speak-numeral: null, | |
$speak-punctuation: null, | |
$speech-rate: null, | |
$stress: null, | |
$table-layout: null, | |
$text-align: null, | |
$text-decoration: null, | |
$text-indent: null, | |
$text-shadow: null, | |
$text-transform: null, | |
$top: null, | |
$unicode-bidi: null, | |
$vertical-align: null, | |
$visibility: null, | |
$voice-family: null, | |
$volume: null, | |
$white-space: null, | |
$widows: null, | |
$width: null, | |
$word-spacing: null, | |
$z-index: null | |
) { | |
azimuth: $azimuth; | |
background: $background; | |
background-attachment: $background-attachment; | |
background-color: $background-color; | |
background-image: $background-image; | |
background-position: $background-position; | |
background-repeat: $background-repeat; | |
border: $border; | |
border-collapse: $border-collapse; | |
border-color: $border-color; | |
border-spacing: $border-spacing; | |
border-style: $border-style; | |
border-top: $border-top; | |
border-right: $border-right; | |
border-bottom: $border-bottom; | |
border-left: $border-left; | |
border-top-color: $border-top-color; | |
border-right-color: $border-right-color; | |
border-bottom-color: $border-bottom-color; | |
border-left-color: $border-left-color; | |
border-top-style: $border-top-style; | |
border-right-style: $border-right-style; | |
border-bottom-style: $border-bottom-style; | |
border-left-style: $border-left-style; | |
border-top-width: $border-top-width; | |
border-right-width: $border-right-width; | |
border-bottom-width: $border-bottom-width; | |
border-left-width: $border-left-width; | |
border-width: $border-width; | |
bottom: $bottom; | |
caption-side: $caption-side; | |
clear: $clear; | |
clip: $clip; | |
color: $color; | |
content: $content; | |
counter-increment: $counter-increment; | |
counter-reset: $counter-reset; | |
cue: $cue; | |
cue-after: $cue-after; | |
cue-before: $cue-before; | |
cursor: $cursor; | |
direction: $direction; | |
display: $display; | |
elevation: $elevation; | |
empty-cells: $empty-cells; | |
float: $float; | |
font: $font; | |
font-family: $font-family; | |
font-size: $font-size; | |
font-size-adjust: $font-size-adjust; | |
font-stretch: $font-stretch; | |
font-style: $font-style; | |
font-variant: $font-variant; | |
font-weight: $font-weight; | |
height: $height; | |
left: $left; | |
letter-spacing: $letter-spacing; | |
line-height: $line-height; | |
list-style: $list-style; | |
list-style-image: $list-style-image; | |
list-style-position: $list-style-position; | |
list-style-type: $list-style-type; | |
margin: $margin; | |
margin-top: $margin-top; | |
margin-right: $margin-right; | |
margin-bottom: $margin-bottom; | |
margin-left: $margin-left; | |
marker-offset: $marker-offset; | |
marks: $marks; | |
max-height: $max-height; | |
max-width: $max-width; | |
min-height: $min-height; | |
min-width: $min-width; | |
orphans: $orphans; | |
outline: $outline; | |
outline-color: $outline-color; | |
outline-style: $outline-style; | |
outline-width: $outline-width; | |
overflow: $overflow; | |
padding: $padding; | |
padding-top: $padding-top; | |
padding-right: $padding-right; | |
padding-bottom: $padding-bottom; | |
padding-left: $padding-left; | |
page: $page; | |
page-break-after: $page-break-after; | |
page-break-before: $page-break-before; | |
page-break-inside: $page-break-inside; | |
pause: $pause; | |
pause-after: $pause-after; | |
pause-before: $pause-before; | |
pitch: $pitch; | |
pitch-range: $pitch-range; | |
play-during: $play-during; | |
position: $position; | |
quotes: $quotes; | |
richness: $richness; | |
right: $right; | |
size: $size; | |
speak: $speak; | |
speak-header: $speak-header; | |
speak-numeral: $speak-numeral; | |
speak-punctuation: $speak-punctuation; | |
speech-rate: $speech-rate; | |
stress: $stress; | |
table-layout: $table-layout; | |
text-align: $text-align; | |
text-decoration: $text-decoration; | |
text-indent: $text-indent; | |
text-shadow: $text-shadow; | |
text-transform: $text-transform; | |
top: $top; | |
unicode-bidi: $unicode-bidi; | |
vertical-align: $vertical-align; | |
visibility: $visibility; | |
voice-family: $voice-family; | |
volume: $volume; | |
white-space: $white-space; | |
widows: $widows; | |
width: $width; | |
word-spacing: $word-spacing; | |
z-index: $z-index; | |
} |
I didn't really check it. I just copy/pasted from some website. :)
yousa. must. be. pUNished.
lacks cross-browser support, how about zoom ?
I'll happily accept pull requests. Maybe I should turn it into a plugin...
Next: Write a mixin that can be used to design any website completely, using one single include. I'm thinking a combination of lists and listargs should make it possible. each listarg is a selector string followed by any number of property/value pairs. We could even check those pairs against compass to add cross-browser support. Because, if you're going to misuse Sass, you should make sure to misuse it the same in every browser.
Should the defaults be initial just for giggles? 😂🥰
@castastrophe lol
, that customization is left as an exersize for the reader 😅
hahaha you forgot the aural properties like azimuth and voice-family, bro.
... Oh wait. They. are. all. there.