-
Notifications
You must be signed in to change notification settings - Fork 59
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Dart Sass Module support for 3.0 + added tests
- Loading branch information
1 parent
939f8e7
commit 3fac9ae
Showing
12 changed files
with
7,347 additions
and
148 deletions.
There are no files selected for viewing
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
node_modules/ | ||
npm-debug.log | ||
yarn-error.log |
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
.npmignore | ||
.gitignore | ||
|
||
node_modules/ | ||
npm-debug.log | ||
yarn.lock | ||
|
||
*.test.js | ||
.travis.yml |
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
language: node_js | ||
cache: yarn | ||
node_js: | ||
- stable |
This file contains 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
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,72 +1,73 @@ | ||
$rem-baseline: 16px !default; | ||
$rem-fallback: false !default; | ||
$rem-px-only: false !default; | ||
@use "sass:list"; | ||
@use "sass:map"; | ||
@use "sass:math"; | ||
@use "sass:meta"; | ||
|
||
@function rem-separator($list, $separator: false) { | ||
@if $separator == "comma" or $separator == "space" { | ||
@return append($list, null, $separator); | ||
} | ||
|
||
@if function-exists("list-separator") == true { | ||
@return list-separator($list); | ||
} | ||
$baseline: 16px !default; | ||
$fallback: false !default; | ||
$px-only: false !default; | ||
|
||
// list-separator polyfill by Hugo Giraudel (https://sass-compatibility.github.io/#list_separator_function) | ||
$test-list: (); | ||
@each $item in $list { | ||
$test-list: append($test-list, $item, space); | ||
// Dart Sass <1.33.0 compatibility | ||
@function _divide($a, $b) { | ||
@if map.has-key(meta.module-functions("math"), "div") { | ||
@return math.div($a, $b); | ||
} | ||
|
||
@return if($test-list == $list, space, comma); | ||
} | ||
|
||
@mixin rem-baseline($zoom: 100%) { | ||
font-size: $zoom / 16px * $rem-baseline; | ||
@return $a / $b; | ||
} | ||
|
||
@function rem-convert($to, $values...) { | ||
@function _convert($to, $values...) { | ||
$result: (); | ||
$separator: rem-separator($values); | ||
$separator: list.separator($values); | ||
|
||
@each $value in $values { | ||
@if type-of($value) == "number" and unit($value) == "rem" and $to == "px" { | ||
$result: append($result, $value / 1rem * $rem-baseline, $separator); | ||
} @else if type-of($value) == "number" and unit($value) == "px" and $to == "rem" { | ||
$result: append($result, $value / $rem-baseline * 1rem, $separator); | ||
} @else if type-of($value) == "list" { | ||
$value-separator: rem-separator($value); | ||
$value: rem-convert($to, $value...); | ||
$value: rem-separator($value, $value-separator); | ||
$result: append($result, $value, $separator); | ||
@if meta.type-of($value) == "number" and math.unit($value) == "rem" and $to == "px" { | ||
$result: list.append($result, _divide($value, 1rem) * $baseline, $separator); | ||
} @else if meta.type-of($value) == "number" and math.unit($value) == "px" and $to == "rem" { | ||
$result: list.append($result, _divide($value, $baseline) * 1rem, $separator); | ||
} @else if meta.type-of($value) == "list" { | ||
$result: list.append($result, _convert($to, $value...), $separator); | ||
} @else { | ||
$result: append($result, $value, $separator); | ||
$result: list.append($result, $value, $separator); | ||
} | ||
} | ||
|
||
@return if(length($result) == 1, nth($result, 1), $result); | ||
@return if(list.length($result) == 1, list.nth($result, 1), $result); | ||
} | ||
|
||
@function rem($values...) { | ||
@if $rem-px-only { | ||
@return rem-convert(px, $values...); | ||
@function convert($values...) { | ||
@if $px-only { | ||
@return _convert(px, $values...); | ||
} @else { | ||
@return rem-convert(rem, $values...); | ||
@return _convert(rem, $values...); | ||
} | ||
} | ||
|
||
@mixin rem($properties, $values...) { | ||
@if type-of($properties) == "map" { | ||
@each $property in map-keys($properties) { | ||
@include rem($property, map-get($properties, $property)); | ||
@mixin convert($properties, $values...) { | ||
@if meta.type-of($properties) == "map" { | ||
@each $property, $values in $properties { | ||
@include convert($property, $values); | ||
} | ||
} @else { | ||
@each $property in $properties { | ||
@if $rem-fallback or $rem-px-only { | ||
#{$property}: rem-convert(px, $values...); | ||
@if $fallback or $px-only { | ||
#{$property}: _convert(px, $values...); | ||
} | ||
@if not $rem-px-only { | ||
#{$property}: rem-convert(rem, $values...); | ||
@if not $px-only { | ||
#{$property}: _convert(rem, $values...); | ||
} | ||
} | ||
} | ||
} | ||
|
||
@function rem($values...) { | ||
@return convert($values...); | ||
} | ||
|
||
@mixin rem($properties, $values...) { | ||
@include convert($properties, $values...); | ||
} | ||
|
||
@mixin baseline($zoom: 100%) { | ||
font-size: _divide($zoom, 16px) * $baseline; | ||
} |
Oops, something went wrong.