Skip to content

Instantly share code, notes, and snippets.

@mirisuzanne
Created September 13, 2012 18:36
Show Gist options
  • Star 11 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save mirisuzanne/3716546 to your computer and use it in GitHub Desktop.
Save mirisuzanne/3716546 to your computer and use it in GitHub Desktop.
THE MOST POWERFUL SASS MIXIN EVAR.
// 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;
}
@cbfrance
Copy link

hahaha you forgot the aural properties like azimuth and voice-family, bro.

... Oh wait. They. are. all. there.

@mirisuzanne
Copy link
Author

I didn't really check it. I just copy/pasted from some website. :)

@damienmckenna
Copy link

yousa. must. be. pUNished.

@leopic
Copy link

leopic commented Sep 13, 2012

lacks cross-browser support, how about zoom ?

@mirisuzanne
Copy link
Author

I'll happily accept pull requests. Maybe I should turn it into a plugin...

@mirisuzanne
Copy link
Author

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.

@castastrophe
Copy link

Should the defaults be initial just for giggles? 😂🥰

@mirisuzanne
Copy link
Author

@castastrophe lol

, that customization is left as an exersize for the reader 😅

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment