Created
July 8, 2014 14:56
-
-
Save KittyGiraudel/89ae20d8d1928dfe7f06 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // Sass (v3.3.9) | |
| // Compass (v1.0.0.alpha.20) | |
| // ---- | |
| /** | |
| * Base font size | |
| * | |
| * @type Number | |
| */ | |
| $base-font-size: 16px !default; | |
| /** | |
| * Base spacing unit | |
| * | |
| * @type Number | |
| */ | |
| $base-spacing-unit: 1rem !default; | |
| /** | |
| * Shortcut for half the base spacing unit | |
| * | |
| * @requires {variable} base-spacing-unit | |
| * | |
| * @type Number | |
| */ | |
| $half-spacing-unit: $base-spacing-unit / 2; | |
| /** | |
| * Defines whether rem values should have a px fallback. | |
| * | |
| * @type Bool | |
| */ | |
| $rem-fallback: true !default; | |
| /** | |
| * Spacing mixin | |
| * | |
| * @access private | |
| * | |
| * @requires {variable} rem-fallback | |
| * @requires {variable} base-font-size | |
| * | |
| * @type Number | |
| */ | |
| @mixin spacing($spacing-type, $args) { | |
| @if $rem-fallback { | |
| $fallback: (); | |
| $regular: (); | |
| @each $value in $args { | |
| @if type-of($value) == "number" and unit($value) == "px" { | |
| $fallback: append($fallback, $value); | |
| $regular: append($regular, $value / $base-font-size * 1rem); | |
| } | |
| @else if type-of($value) == "number" and unit($value) == "rem" { | |
| $fallback: append($fallback, $value / 1rem * $base-font-size); | |
| $regular: append($regular, $value); | |
| } | |
| @else { | |
| $fallback: append($fallback, $value); | |
| $regular: append($regular, $value); | |
| } | |
| } | |
| #{$spacing-type}: $fallback; | |
| #{$spacing-type}: $regular; | |
| } | |
| @else { | |
| #{$spacing-type}: $args; | |
| } | |
| } | |
| /** | |
| * Short cut for `spacing(padding, ...)` | |
| * | |
| * @requires {mixin} spacing | |
| */ | |
| @mixin padding($args) { | |
| @include spacing(padding, $args); | |
| } | |
| /** | |
| * Short cut for `spacing(margin, ...)` | |
| * | |
| * @requires {mixin} spacing | |
| */ | |
| @mixin margin($args) { | |
| @include spacing(margin, $args); | |
| } | |
| // Demo | |
| el { | |
| @include padding(0 $half-spacing-unit auto); | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Base font size | |
| * | |
| * @type Number | |
| */ | |
| /** | |
| * Base spacing unit | |
| * | |
| * @type Number | |
| */ | |
| /** | |
| * Shortcut for half the base spacing unit | |
| * | |
| * @requires {variable} base-spacing-unit | |
| * | |
| * @type Number | |
| */ | |
| /** | |
| * Defines whether rem values should have a px fallback. | |
| * | |
| * @type Bool | |
| */ | |
| /** | |
| * Spacing mixin | |
| * | |
| * @access private | |
| * | |
| * @requires {variable} rem-fallback | |
| * @requires {variable} base-font-size | |
| * | |
| * @type Number | |
| */ | |
| /** | |
| * Short cut for `spacing(padding, ...)` | |
| * | |
| * @requires {mixin} spacing | |
| */ | |
| /** | |
| * Short cut for `spacing(margin, ...)` | |
| * | |
| * @requires {mixin} spacing | |
| */ | |
| el { | |
| padding: 0 8px auto; | |
| padding: 0 0.5rem auto; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment