Skip to content

Commit

Permalink
unquote() is depreciated in future versions of Sass -- update to fu…
Browse files Browse the repository at this point in the history 
…ture proof
  • Loading branch information
@nicetransition
nicetransition committed Jul 30, 2015
1 parent 22736bb commit fef8ed9
Show file tree
Hide file tree
Showing 2 changed files with 64 additions and 65 deletions.
1 change: 1 addition & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -198,6 +198,7 @@ Each variation (including defaults) have a %placeholder selector that aligns wit
+ 2.1.0: Variables moved into "spacing.scss" and removal of "_variables.scss"
+ 2.2.0: Revert back to have variables in "spacing.scss" to "_variables.scss"
+ 3.0.0: Complete rewrite to include Sass 3.3 functionality and more flexibility for RWD projects
+ 3.0.1: Removal of `unquote()` for future proofing (`unquote` is being deprecated)

---

Expand Down
128 changes: 63 additions & 65 deletions unit-space.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,106 +3,105 @@
// * Demo: http://kevinmack18.github.io/SASS-Margin-and-Padding-Starter/
// * Released under the MIT license
// * https://github.com/kevinmack18/SASS-Margin-and-Padding-Starter/blob/master/LICENSE
// * Version: v3.0.0
// * Date: 2015-04-30
// * Version: v3.0.1
// * Date: 2015-07-30

@import "unit_space__variables";


@if ( $units__include-box-sizing ) {
*, *:before, *:after {
box-sizing: border-box;
}
}

@mixin generateUnits($property: padding, $version: default, $variation: base ) {
$versions: map-get($units, $property);
$values: map-get($versions, $version);
$unit: if(map-has-key($values, "unit"),map-get($values, "unit"),$default-unit);
$selector-base: if(map-has-key($values, "selector-name"),map-get($values, "selector-name"),$property);
$variations: map-get($values, "variations");
$selector-suffix: if(map-has-key($values, "suffix"),map-get($values, "suffix"),"");
$media-query-min: if(map-has-key($values, "media-query-min"),map-get($values, "media-query-min"),false);
$unit--media-query-min: if(map-has-key($values, "unit--media-query-min"),map-get($values, "unit--media-query-min"),$unit);
$media-query-max: if(map-has-key($values, "media-query-max"),map-get($values, "media-query-max"),false);
$unit--media-query-max: if(map-has-key($values, "unit--media-query-max"),map-get($values, "unit--media-query-max"),$unit);
$units-are-controlled-by-breakpoints: ($media-query-min != false and $media-query-max != false);

$versions: map-get($units, $property);
$values: map-get($versions, $version);
$unit: if(map-has-key($values, "unit"),map-get($values, "unit"),$default-unit);
$selector-base: if(map-has-key($values, "selector-name"),map-get($values, "selector-name"),$property);
$variations: map-get($values, "variations");
$selector-suffix: if(map-has-key($values, "suffix"),map-get($values, "suffix"),"");
$media-query-min: if(map-has-key($values, "media-query-min"),map-get($values, "media-query-min"),false);
$unit--media-query-min: if(map-has-key($values, "unit--media-query-min"),map-get($values, "unit--media-query-min"),$unit);
$media-query-max: if(map-has-key($values, "media-query-max"),map-get($values, "media-query-max"),false);
$unit--media-query-max: if(map-has-key($values, "unit--media-query-max"),map-get($values, "unit--media-query-max"),$unit);
$units-are-controlled-by-breakpoints: ($media-query-min != false and $media-query-max != false);

@each $variation, $boolean in $variations {

@each $variation, $boolean in $variations {
@if( $variation != "base" ) {

@if( $variation != "base" ) {
// create custom placeholder selector for versioning each group in @extend
$id: if($version == "default", "", $version);

// create custom placeholder selector for versioning each group in @extend
$id: if($version == "default", "", $version);
// Check to see if both have breakpoints
@if ($units-are-controlled-by-breakpoints == false) {
%#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} {
#{$property}-#{$variation}: $unit;
}
}

// Check to see if both have breakpoints
@if ($units-are-controlled-by-breakpoints == false) {
%#{$selector-base}#{$selector-suffix} {
@if (map-get($variations, "base") == true and (map-get($variations, "base") != "short") ) {
@extend %#{$selector-base}-#{$variation}#{$selector-suffix}#{$id};
}
}

@if ($media-query-min) {
@media screen and (min-width: $media-query-min) {
%#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} {
#{$property}-#{$variation}: $unit;
#{$property}-#{$variation}: $unit--media-query-min;
}
}
}
@if ($media-query-max) {
@media screen and (max-width: $media-query-max) {
%#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} {
#{$property}-#{$variation}: $unit--media-query-max;
}
}
}
}

@if( $variation == "base" ) {
@if (map-get($variations, "base") == "short") {
%#{$selector-base}#{$selector-suffix} {
@if (map-get($variations, "base") == true and (map-get($variations, "base") != "short") ) {
@extend %#{$selector-base}-#{$variation}#{$selector-suffix}#{$id};
}
#{$property}: $unit;
}

@if ($media-query-min) {
@media screen and (min-width: $media-query-min) {
%#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} {
#{$property}-#{$variation}: $unit--media-query-min;
%#{$selector-base}#{$selector-suffix} {
#{$property}: $unit--media-query-min;
}
}
}
@if ($media-query-max) {
@media screen and (max-width: $media-query-max) {
%#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} {
#{$property}-#{$variation}: $unit--media-query-max;
%#{$selector-base}#{$selector-suffix} {
#{$property}: $unit--media-query-max;
}
}
}
}

@if( $variation == "base" ) {
@if (map-get($variations, "base") == "short") {
%#{$selector-base}#{$selector-suffix} {
#{$property}: $unit;
}

@if ($media-query-min) {
@media screen and (min-width: $media-query-min) {
%#{$selector-base}#{$selector-suffix} {
#{$property}: $unit--media-query-min;
}
}
}
@if ($media-query-max) {
@media screen and (max-width: $media-query-max) {
%#{$selector-base}#{$selector-suffix} {
#{$property}: $unit--media-query-max;
}
}
}
}

.#{$selector-base}#{$selector-suffix} {
@extend %#{$selector-base}#{$selector-suffix} !optional;
}
.#{$selector-base}#{$selector-suffix} {
@extend %#{$selector-base}#{$selector-suffix} !optional;
}
}

@if( $variation != "base" and (map-get($variations, $variation) == true) ) {
$id: if($version == "default", "", $version);
@if( $variation != "base" and (map-get($variations, $variation) == true) ) {
$id: if($version == "default", "", $version);

.#{$selector-base}-#{$variation}#{$selector-suffix} {
@extend %#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} !optional;
}
.#{$selector-base}-#{$variation}#{$selector-suffix} {
@extend %#{$selector-base}-#{$variation}#{$selector-suffix}#{$id} !optional;
}
}
}
}


// output specific properites only
@mixin units($property: "padding", $version: "default", $variation: (base: true, top: true, right: true, bottom: true, left: true)) {
$variation-controls: $variation;
Expand All @@ -128,29 +127,28 @@

@if ($units-are-controlled-by-breakpoints == false) {
@if ($baseDoesNotOveride) {
#{$property}-#{$variation}: unquote($unit);
#{$property}-#{$variation}: $unit;
} @else if ($isBase) {
#{$property}: unquote($unit);
#{$property}: $unit;
}
}

@if ($media-query-min) {
@media screen and (min-width: $media-query-min) {
@if ( $baseDoesNotOveride ) {
#{$property}-#{$variation}: unquote($unit--media-query-min);
#{$property}-#{$variation}: $unit--media-query-min;
} @else if ($isBase) {
#{$property}: unquote($unit--media-query-min);
#{$property}: $unit--media-query-min;
}
}
}


@if ($media-query-max) {
@media screen and (max-width: $media-query-max) {
@if ( $baseDoesNotOveride ) {
#{$property}-#{$variation}: unquote($unit--media-query-max);
#{$property}-#{$variation}: $unit--media-query-max;
} @else if ($isBase) {
#{$property}: unquote($unit--media-query-max);
#{$property}: $unit--media-query-max;
}
}
}
Expand Down

0 comments on commit fef8ed9

Please sign in to comment.