diff options
author | 2018-11-24 20:15:39 +0100 | |
---|---|---|
committer | 2018-11-24 20:15:39 +0100 | |
commit | 4ea044ae6b2e27e48d45bc3be1c366f4882bbda5 (patch) | |
tree | d19064b7370cb66ef66407de082bedad4c3128d4 /src/styles/type-helper.scss | |
parent | disable import/prefer-default-export (diff) | |
download | ferdium-app-4ea044ae6b2e27e48d45bc3be1c366f4882bbda5.tar.gz ferdium-app-4ea044ae6b2e27e48d45bc3be1c366f4882bbda5.tar.zst ferdium-app-4ea044ae6b2e27e48d45bc3be1c366f4882bbda5.zip |
feat(App): Lay groundwork for general themeing support
Diffstat (limited to 'src/styles/type-helper.scss')
-rw-r--r-- | src/styles/type-helper.scss | 100 |
1 files changed, 100 insertions, 0 deletions
diff --git a/src/styles/type-helper.scss b/src/styles/type-helper.scss new file mode 100644 index 000000000..b1da394b5 --- /dev/null +++ b/src/styles/type-helper.scss | |||
@@ -0,0 +1,100 @@ | |||
1 | @function str-split($string, $separator) { | ||
2 | // empty array/list | ||
3 | $split-arr: (); | ||
4 | // first index of separator in string | ||
5 | $index : str-index($string, $separator); | ||
6 | // loop through string | ||
7 | @while $index != null { | ||
8 | // get the substring from the first character to the separator | ||
9 | $item: str-slice($string, 1, $index - 1); | ||
10 | // push item to array | ||
11 | $split-arr: append($split-arr, $item); | ||
12 | // remove item and separator from string | ||
13 | $string: str-slice($string, $index + 1); | ||
14 | // find new index of separator | ||
15 | $index : str-index($string, $separator); | ||
16 | } | ||
17 | // add the remaining string to list (the last item) | ||
18 | $split-arr: append($split-arr, $string); | ||
19 | |||
20 | @return $split-arr; | ||
21 | } | ||
22 | |||
23 | // ---- | ||
24 | // Sass (v3.4.13) | ||
25 | // Compass (v1.0.3) | ||
26 | // ---- | ||
27 | |||
28 | /// String to number converter | ||
29 | /// @author Hugo Giraudel | ||
30 | /// @access private | ||
31 | |||
32 | |||
33 | /// Casts a string into a number | ||
34 | /// | ||
35 | /// @param {String | Number} $value - Value to be parsed | ||
36 | /// | ||
37 | /// @return {Number} | ||
38 | |||
39 | @function to-number($value) { | ||
40 | @if type-of($value) == 'number' { | ||
41 | @return $value; | ||
42 | } @else if type-of($value) != 'string' { | ||
43 | $_: log('Value for `to-number` should be a number or a string.'); | ||
44 | } | ||
45 | |||
46 | $result: 0; | ||
47 | $digits: 0; | ||
48 | $minus: str-slice($value, 1, 1) == '-'; | ||
49 | $numbers: ('0': 0, '1': 1, '2': 2, '3': 3, '4': 4, '5': 5, '6': 6, '7': 7, '8': 8, '9': 9); | ||
50 | |||
51 | @for $i from if($minus, 2, 1) through str-length($value) { | ||
52 | $character: str-slice($value, $i, $i); | ||
53 | |||
54 | @if not (index(map-keys($numbers), $character) or $character == '.') { | ||
55 | @return to-length(if($minus, -$result, $result), str-slice($value, $i)) | ||
56 | } | ||
57 | |||
58 | @if $character == '.' { | ||
59 | $digits: 1; | ||
60 | } @else if $digits == 0 { | ||
61 | $result: $result * 10 + map-get($numbers, $character); | ||
62 | } @else { | ||
63 | $digits: $digits * 10; | ||
64 | $result: $result + map-get($numbers, $character) / $digits; | ||
65 | } | ||
66 | } | ||
67 | |||
68 | @return if($minus, -$result, $result);; | ||
69 | } | ||
70 | |||
71 | |||
72 | /// Add `$unit` to `$value` | ||
73 | /// | ||
74 | /// @param {Number} $value - Value to add unit to | ||
75 | /// @param {String} $unit - String representation of the unit | ||
76 | /// | ||
77 | /// @return {Number} - `$value` expressed in `$unit` | ||
78 | @function to-length($value, $unit) { | ||
79 | $units: ('px': 1px, 'cm': 1cm, 'mm': 1mm, '%': 1%, 'ch': 1ch, 'pc': 1pc, 'in': 1in, 'em': 1em, 'rem': 1rem, 'pt': 1pt, 'ex': 1ex, 'vw': 1vw, 'vh': 1vh, 'vmin': 1vmin, 'vmax': 1vmax); | ||
80 | |||
81 | @if not index(map-keys($units), $unit) { | ||
82 | $_: log('Invalid unit `#{$unit}`.'); | ||
83 | } | ||
84 | |||
85 | @return $value * map-get($units, $unit); | ||
86 | } | ||
87 | |||
88 | |||
89 | |||
90 | /// converts injectes rgb strings to sass colors | ||
91 | @function convert-rgb-string-to-color($string) { | ||
92 | $values: str-split($string, ','); | ||
93 | $colorList: (); | ||
94 | @each $value in $values { | ||
95 | $colorList: append($colorList, to-number($value)); | ||
96 | } | ||
97 | |||
98 | $rgbaColor: rgb(nth($colorList, 1), nth($colorList, 2), nth($colorList, 3)); | ||
99 | @return $rgbaColor; | ||
100 | } \ No newline at end of file | ||