Skip to content

Instantly share code, notes, and snippets.

@mmintel
Created May 23, 2014 15:59
Show Gist options
  • Save mmintel/8de379ae7f2a7ca38958 to your computer and use it in GitHub Desktop.
Save mmintel/8de379ae7f2a7ca38958 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----
$elementSeparator: '__';
$modifierSeparator: '--';
$listBullets: (
'.list--bullets': (
list-style: none,
border-bottom: 1px solid gray
)
);
$listLines: '.list--lines';
$listItems: '.list__items';
@mixin modifier($modifier) {
//$selector: $modifier;
//@if type-of($modifier) == map {
$selector: map-key($modifier, 1);
//}
$separatorPosition: str-index($selector, $modifierSeparator);
//$block: str-slice($selector, 1, ($separatorPosition - 1));
@at-root {
#{unquote($selector)} {
//@extend #{unquote($block)} !optional;
@if type-of($modifier) == map {
//@each $property, $value in map-get($modifier, 1) {
// #{$property}: #{$value};
//}
}
@content;
}
}
}
@mixin element($element) {
$separatorPosition: str-index($element, $elementSeparator);
$block: str-slice($element, 1, ($separatorPosition - 1));
#{unquote($element)} {
@content;
}
}
@mixin prototype($prototype) {
@each $attr in $prototype {
#{map-get($attr, $prototype)}: #fff;
}
}
.list {
color: #fff;
}
@include modifier($listBullets) {
background: gray;
}
@include modifier($listLines) {
background: yellow;
}
@include element($listItems) {
border-bottom: 1px solid #fff;
}
(".list--bullets": ((list-style: none, border-bottom: 1px solid gray))) isn't a valid CSS value.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment