diff options
author | Volpeon <git@volpeon.ink> | 2022-02-07 10:56:11 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-02-07 10:56:11 +0100 |
commit | cad79b949b060cd360582c2d208b37a51578e778 (patch) | |
tree | a32f05975ce6b0c557a2c9b7d57772ad0e18e40e /src/_functions.scss | |
parent | Added status indicator and avatar (diff) | |
download | iro-design-cad79b949b060cd360582c2d208b37a51578e778.tar.gz iro-design-cad79b949b060cd360582c2d208b37a51578e778.tar.bz2 iro-design-cad79b949b060cd360582c2d208b37a51578e778.zip |
Improved font handling
Diffstat (limited to 'src/_functions.scss')
-rw-r--r-- | src/_functions.scss | 122 |
1 files changed, 116 insertions, 6 deletions
diff --git a/src/_functions.scss b/src/_functions.scss index a11d5f4..9f6a789 100644 --- a/src/_functions.scss +++ b/src/_functions.scss | |||
@@ -10,9 +10,7 @@ | |||
10 | } | 10 | } |
11 | 11 | ||
12 | @function foreign-color($foreign-key, $key, $tree: 'colors', $default: null, $global: true) { | 12 | @function foreign-color($foreign-key, $key, $tree: 'colors', $default: null, $global: true) { |
13 | $key: iro.fn-list-prepend($key, --colors); | 13 | @return iro.props-get(join($foreign-key --colors, $key), $tree, $default, $global); |
14 | $key: iro.fn-list-prepend($key, $foreign-key); | ||
15 | @return iro.props-get($key, $tree, $default, $global); | ||
16 | } | 14 | } |
17 | 15 | ||
18 | @function dim($key, $tree: 'dims', $default: null, $global: false) { | 16 | @function dim($key, $tree: 'dims', $default: null, $global: false) { |
@@ -25,7 +23,119 @@ | |||
25 | } | 23 | } |
26 | 24 | ||
27 | @function foreign-dim($foreign-key, $key, $tree: 'dims', $default: null, $global: true) { | 25 | @function foreign-dim($foreign-key, $key, $tree: 'dims', $default: null, $global: true) { |
28 | $key: iro.fn-list-prepend($key, --dims); | 26 | @return iro.props-get(join($foreign-key --dims, $key), $tree, $default, $global); |
29 | $key: iro.fn-list-prepend($key, $foreign-key); | 27 | } |
30 | @return iro.props-get($key, $tree, $default, $global); | 28 | |
29 | @function set-font($key, $overrides: ()) { | ||
30 | $font: iro.props-get-static(join(--dims --font, $key), 'dims', $global: true); | ||
31 | |||
32 | $map: (); | ||
33 | |||
34 | @if (map-has-key($overrides, --family)) { | ||
35 | $map: map-merge( | ||
36 | $map, ( | ||
37 | font-family: map-get($overrides, --family) | ||
38 | ) | ||
39 | ); | ||
40 | } @else if (map-has-key($font, --family)) { | ||
41 | $map: map-merge( | ||
42 | $map, ( | ||
43 | font-family: global-dim(--font $key --family) | ||
44 | ) | ||
45 | ); | ||
46 | } | ||
47 | |||
48 | @if (map-has-key($overrides, --size)) { | ||
49 | $map: map-merge( | ||
50 | $map, ( | ||
51 | font-size: map-get($overrides, --size) | ||
52 | ) | ||
53 | ); | ||
54 | } @else if (map-has-key($font, --size)) { | ||
55 | $map: map-merge( | ||
56 | $map, ( | ||
57 | font-size: global-dim(--font $key --size) | ||
58 | ) | ||
59 | ); | ||
60 | } | ||
61 | |||
62 | @if (map-has-key($overrides, --weight)) { | ||
63 | $map: map-merge( | ||
64 | $map, ( | ||
65 | font-weight: map-get($overrides, --weight) | ||
66 | ) | ||
67 | ); | ||
68 | } @else if (map-has-key($font, --weight)) { | ||
69 | $map: map-merge( | ||
70 | $map, ( | ||
71 | font-weight: global-dim(--font $key --weight) | ||
72 | ) | ||
73 | ); | ||
74 | } | ||
75 | |||
76 | @if (map-has-key($overrides, --style)) { | ||
77 | $map: map-merge( | ||
78 | $map, ( | ||
79 | font-style: map-get($overrides, --style) | ||
80 | ) | ||
81 | ); | ||
82 | } @else if (map-has-key($font, --style)) { | ||
83 | $map: map-merge( | ||
84 | $map, ( | ||
85 | font-style: global-dim(--font $key --style) | ||
86 | ) | ||
87 | ); | ||
88 | } | ||
89 | |||
90 | @if (map-has-key($overrides, --line-height)) { | ||
91 | $map: map-merge( | ||
92 | $map, ( | ||
93 | line-height: map-get($overrides, --line-height) | ||
94 | ) | ||
95 | ); | ||
96 | } @else if (map-has-key($font, --line-height)) { | ||
97 | $map: map-merge( | ||
98 | $map, ( | ||
99 | line-height: global-dim(--font $key --line-height) | ||
100 | ) | ||
101 | ); | ||
102 | } | ||
103 | |||
104 | @if (map-has-key($overrides, --transform)) { | ||
105 | $map: map-merge( | ||
106 | $map, ( | ||
107 | text-transform: map-get($overrides, --transform) | ||
108 | ) | ||
109 | ); | ||
110 | } @else if (map-has-key($font, --transform)) { | ||
111 | $map: map-merge( | ||
112 | $map, ( | ||
113 | text-transform: global-dim(--font $key --transform) | ||
114 | ) | ||
115 | ); | ||
116 | } | ||
117 | |||
118 | @if (map-has-key($overrides, --variant-alternates)) { | ||
119 | $map: map-merge( | ||
120 | $map, ( | ||
121 | font-variant-alternates: map-get($overrides, --variant-alternates) | ||
122 | ) | ||
123 | ); | ||
124 | } @else if (map-has-key($font, --variant-alternates)) { | ||
125 | $map: map-merge( | ||
126 | $map, ( | ||
127 | font-variant-alternates: global-dim(--font $key --variant-alternates) | ||
128 | ) | ||
129 | ); | ||
130 | } | ||
131 | |||
132 | @return $map; | ||
133 | } | ||
134 | |||
135 | @mixin set-font($basis, $values: ()) { | ||
136 | $values: set-font($basis, $values); | ||
137 | |||
138 | @each $prop, $value in $values { | ||
139 | #{$prop}: $value; | ||
140 | } | ||
31 | } | 141 | } |