@simple-reporting/base 1.0.23 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cli.js +5 -1
- package/dev/index.html +1 -1
- package/dev/livingdocs.config.json +6 -6
- package/dev/package.json +6 -1
- package/dev/src/Dialog.vue +3 -0
- package/dev/src/assets/scss/word.scss +44 -1
- package/livingdocs/010.Titles/010.title-h1/scss/word.scss +3 -0
- package/livingdocs/010.Titles/020.title-h2/scss/word.scss +10 -0
- package/livingdocs/010.Titles/030.title-h3/scss/word.scss +10 -0
- package/livingdocs/010.Titles/040.title-h4/scss/word.scss +10 -0
- package/livingdocs/010.Titles/050.title-h5/scss/word.scss +5 -0
- package/livingdocs/010.Titles/060.title-h6/scss/word.scss +5 -0
- package/livingdocs/020.Text/010.lead/scss/word.scss +5 -0
- package/livingdocs/020.Text/020.paragraph/scss/word.scss +5 -0
- package/livingdocs/020.Text/030.paragraph-strong/scss/word.scss +6 -0
- package/livingdocs/020.Text/040.link/scss/word.scss +5 -0
- package/livingdocs/020.Text/050.quote/scss/word.scss +7 -0
- package/livingdocs/020.Text/060.quote-with-portrait/scss/word.scss +7 -0
- package/livingdocs/020.Text/080.footnote-item/scss/word.scss +6 -0
- package/livingdocs/030.Lists/010.unordered-list/scss/general.scss +0 -5
- package/livingdocs/030.Lists/010.unordered-list/scss/word.scss +6 -0
- package/livingdocs/030.Lists/020.ordered-list/scss/word.scss +9 -0
- package/livingdocs/030.Lists/030.alphanumeric-list/scss/word.scss +9 -0
- package/livingdocs/030.Lists/040.list-item/scss/pdf.scss +2 -2
- package/livingdocs/030.Lists/040.list-item/scss/word.scss +19 -0
- package/livingdocs/040.Media/010.table/scss/general.scss +22 -17
- package/livingdocs/040.Media/010.table/scss/word.scss +21 -0
- package/livingdocs/040.Media/020.image/scss/word.scss +5 -0
- package/livingdocs/040.Media/030.video/scss/word.scss +5 -0
- package/livingdocs/040.Media/030.video/video.html +2 -2
- package/livingdocs/060.Buttons/020.button/scss/word.scss +6 -1
- package/livingdocs/080.CV/010.cv/cv.html +7 -7
- package/livingdocs/090.Signatures/010.signature-container/scss/word.scss +5 -0
- package/livingdocs/090.Signatures/020.signature-item/scss/word.scss +6 -0
- package/livingdocs/100.Misc/010.anchor/anchor.html +2 -1
- package/livingdocs/110.PDF/010.pdf-pagebreak/pdf-pagebreak.html +1 -1
- package/livingdocs/110.PDF/010.pdf-pagebreak/scss/word.scss +5 -0
- package/livingdocs/110.PDF/030.pdf-publication-title/pdf-publication-title.html +1 -0
- package/livingdocs/110.PDF/040.pdf-chapter-title/pdf-chapter-title.html +1 -0
- package/livingdocs/110.PDF/050.pdf-chapter-navigation-container/pdf-chapter-navigation.html +1 -0
- package/livingdocs/110.PDF/070.pdf-cover/pdf-cover.html +1 -1
- package/livingdocs/110.PDF/080.pdf-toc-page/pdf-toc-page.html +2 -2
- package/livingdocs/110.PDF/080.pdf-toc-page/scss/editor.scss +2 -2
- package/livingdocs/110.PDF/100.pdf-toc-item/pdf-toc-item.html +3 -3
- package/package.json +2 -1
- package/scripts/beaver.js +14 -18
- package/scripts/build/variables.d.ts +6 -0
- package/scripts/build/variables.js +6 -0
- package/scripts/build.d.ts +1 -1
- package/scripts/build.js +227 -99
- package/scripts/dotenv.d.ts +1 -0
- package/scripts/dotenv.js +8 -0
- package/scripts/init.js +1 -1
- package/scripts/ldd/mapLdd.js +2 -2
- package/scripts/utils.d.ts +1 -0
- package/scripts/utils.js +22 -0
- package/scss/colors/functions.scss +2 -10
- package/scss/colors/mixins.scss +0 -18
- package/scss/colors/root.scss +10 -0
- package/scss/core-styles.scss +4 -1
- package/scss/fonts/root.scss +4 -0
- package/scss/grid/functions.scss +8 -6
- package/scss/grid/mixins.scss +0 -77
- package/scss/grid/root.scss +80 -0
- package/scss/helpers/root.scss +4 -0
- package/scss/init-root.scss +12 -0
- package/scss/meta/root.scss +4 -0
- package/scss/spacer/functions.scss +2 -1
- package/scss/spacer/mixins.scss +0 -52
- package/scss/spacer/root.scss +55 -0
- package/scss/system/functions.scss +70 -5
- package/scss/system/root.scss +0 -3
- package/scss/system/variables.scss +1 -0
- package/scss/typography/functions.scss +12 -12
- package/scss/typography/mixins.scss +0 -221
- package/scss/typography/root.scss +226 -0
- package/srl/.srl/components/Srl/Article/Dialog/Button.vue +18 -20
- package/srl/.srl/components/Srl/Article/Root.vue +4 -3
- package/srl/.srl/components/Srl/Page/Dialog.vue +17 -19
- package/srl/.srl/types/nswow.d.ts +3 -0
- package/srl/.srl/utils/pageState.ts +2 -2
- package/srl/srl/pdf.scss +0 -2
package/scripts/ldd/mapLdd.js
CHANGED
|
@@ -141,7 +141,7 @@ async function mapComponents(lddJson) {
|
|
|
141
141
|
components.forEach((component) => {
|
|
142
142
|
// ldd static component
|
|
143
143
|
try {
|
|
144
|
-
const htmlFile = globSync(join(groupPath, component, '*.html'));
|
|
144
|
+
const htmlFile = globSync(join(groupPath, component, '*.html'), { posix: true });
|
|
145
145
|
if (htmlFile.length) {
|
|
146
146
|
const htmlPath = htmlFile[0];
|
|
147
147
|
const ldConfPath = join(groupPath, component, `ld-conf.json`);
|
|
@@ -164,7 +164,7 @@ async function mapComponents(lddJson) {
|
|
|
164
164
|
|
|
165
165
|
// vue async component
|
|
166
166
|
try {
|
|
167
|
-
const vueFiles = globSync(join(groupPath, component, '*.vue'));
|
|
167
|
+
const vueFiles = globSync(join(groupPath, component, '*.vue'), { posix: true });
|
|
168
168
|
if (vueFiles.length) {
|
|
169
169
|
vueFiles.forEach( c => {
|
|
170
170
|
const vueFile = c.split('/').pop();
|
package/scripts/utils.d.ts
CHANGED
|
@@ -61,4 +61,5 @@ export function camelCase(str: string): string;
|
|
|
61
61
|
* @returns {Promise<string>} The package version.
|
|
62
62
|
*/
|
|
63
63
|
export function getPackageVersion(packageName: string): Promise<string>;
|
|
64
|
+
export function deepAssign(target: any, ...sources: any[]): any;
|
|
64
65
|
export { writeJson };
|
package/scripts/utils.js
CHANGED
|
@@ -146,6 +146,27 @@ function getPackageVersion(packageName) {
|
|
|
146
146
|
});
|
|
147
147
|
}
|
|
148
148
|
|
|
149
|
+
function deepAssign(target, ...sources) {
|
|
150
|
+
for (const source of sources) {
|
|
151
|
+
if (typeof source !== 'object' || source === null) continue;
|
|
152
|
+
for (const key of Object.keys(source)) {
|
|
153
|
+
if (
|
|
154
|
+
typeof source[key] === 'object' &&
|
|
155
|
+
source[key] !== null &&
|
|
156
|
+
!Array.isArray(source[key])
|
|
157
|
+
) {
|
|
158
|
+
if (!target[key] || typeof target[key] !== 'object') {
|
|
159
|
+
target[key] = {};
|
|
160
|
+
}
|
|
161
|
+
deepAssign(target[key], source[key]);
|
|
162
|
+
} else {
|
|
163
|
+
target[key] = source[key];
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
return target;
|
|
168
|
+
}
|
|
169
|
+
|
|
149
170
|
export {
|
|
150
171
|
writeJson,
|
|
151
172
|
lddGroupNames,
|
|
@@ -160,4 +181,5 @@ export {
|
|
|
160
181
|
writeNsWowJson,
|
|
161
182
|
camelCase,
|
|
162
183
|
getPackageVersion,
|
|
184
|
+
deepAssign,
|
|
163
185
|
};
|
|
@@ -2,17 +2,9 @@
|
|
|
2
2
|
@use 'variables';
|
|
3
3
|
@use '../system';
|
|
4
4
|
|
|
5
|
-
@function get($colorName
|
|
5
|
+
@function get($colorName) {
|
|
6
6
|
@if not map.has-key(variables.$colors, $colorName) {
|
|
7
7
|
@error "Invalid color \"#{$colorName}\" specified! Choose one of #{map.keys(variables.$colors)}";
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
@if $media {
|
|
11
|
-
@return var(
|
|
12
|
-
--#{variables.$variable-prefix}color-#{$colorName}-#{$media},
|
|
13
|
-
var(--#{variables.$variable-prefix}color-#{$colorName})
|
|
14
|
-
);
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
@return var(--#{variables.$variable-prefix}color-#{$colorName});
|
|
9
|
+
@return system.root-style(#{variables.$variable-prefix}color-#{$colorName});
|
|
18
10
|
}
|
package/scss/colors/mixins.scss
CHANGED
|
@@ -4,24 +4,6 @@
|
|
|
4
4
|
@use 'functions';
|
|
5
5
|
@use '../system';
|
|
6
6
|
|
|
7
|
-
@mixin set($colorName, $value, $media: false) {
|
|
8
|
-
@if not map.has-key(variables.$colors, $colorName) {
|
|
9
|
-
@error "Invalid color \"#{$colorName}\" specified! Choose one of #{map.keys(variables.$colors)}";
|
|
10
|
-
}
|
|
11
|
-
@if $media {
|
|
12
|
-
--#{variables.$variable-prefix}color-#{"" + $colorName}-#{$media}: #{$value};
|
|
13
|
-
} @else {
|
|
14
|
-
--#{variables.$variable-prefix}color-#{"" + $colorName}: #{$value};
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
@each $colorName, $colors in variables.$colors {
|
|
19
|
-
@include system.add-root-style(
|
|
20
|
-
#{variables.$variable-prefix}color-#{'' + $colorName},
|
|
21
|
-
map.get($colors, color)
|
|
22
|
-
);
|
|
23
|
-
}
|
|
24
|
-
|
|
25
7
|
@mixin core-styles {
|
|
26
8
|
@at-root {
|
|
27
9
|
@each $colorName, $colors in variables.$colors {
|
package/scss/core-styles.scss
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
@use 'config';
|
|
2
2
|
@use 'index';
|
|
3
3
|
@use 'system/root';
|
|
4
|
+
@use "system/variables";
|
|
4
5
|
|
|
5
6
|
@use 'modern-css-reset';
|
|
6
7
|
|
|
@@ -12,7 +13,9 @@ li {
|
|
|
12
13
|
margin: 0;
|
|
13
14
|
}
|
|
14
15
|
|
|
15
|
-
@
|
|
16
|
+
@if variables.$build != word {
|
|
17
|
+
@include root.core-styles;
|
|
18
|
+
}
|
|
16
19
|
@include index.core-styles;
|
|
17
20
|
@include index.system-core-styles;
|
|
18
21
|
@include index.fonts-core-styles;
|
package/scss/grid/functions.scss
CHANGED
|
@@ -1,31 +1,33 @@
|
|
|
1
1
|
@use 'sass:map';
|
|
2
2
|
@use 'variables';
|
|
3
|
+
@use '../system';
|
|
4
|
+
|
|
3
5
|
|
|
4
6
|
@function get-container-max-width() {
|
|
5
|
-
@return
|
|
7
|
+
@return system.root-style(#{variables.$variable-prefix}container-max-width, 0);
|
|
6
8
|
}
|
|
7
9
|
|
|
8
10
|
@function get-container-padding() {
|
|
9
|
-
@return
|
|
11
|
+
@return system.root-style(#{variables.$variable-prefix}container-padding, 0);
|
|
10
12
|
}
|
|
11
13
|
|
|
12
14
|
@function get-breakpoint($breakpoint) {
|
|
13
15
|
@if not map.has-key(variables.$breakpoints, $breakpoint) {
|
|
14
16
|
@error "Invalid breakpoint for container specified! Choose one of #{map.keys(variables.$breakpoints)}";
|
|
15
17
|
}
|
|
16
|
-
@return
|
|
18
|
+
@return system.root-style(#{variables.$variable-prefix}-breakpoint-#{$breakpoint});
|
|
17
19
|
}
|
|
18
20
|
|
|
19
21
|
@function get-gutter-columns() {
|
|
20
|
-
@return
|
|
22
|
+
@return system.root-style(#{variables.$variable-prefix}gutter-columns);
|
|
21
23
|
}
|
|
22
24
|
|
|
23
25
|
@function get-gutter-row-gap() {
|
|
24
|
-
@return
|
|
26
|
+
@return system.root-style(#{variables.$variable-prefix}gutter-row-gap);
|
|
25
27
|
}
|
|
26
28
|
|
|
27
29
|
@function get-gutter-column-gap() {
|
|
28
|
-
@return
|
|
30
|
+
@return system.root-style(#{variables.$variable-prefix}gutter-column-gap);
|
|
29
31
|
}
|
|
30
32
|
|
|
31
33
|
@function calculate-pdf-col-span-minus-one-gutter($span) {
|
package/scss/grid/mixins.scss
CHANGED
|
@@ -160,83 +160,6 @@
|
|
|
160
160
|
}
|
|
161
161
|
}
|
|
162
162
|
|
|
163
|
-
@each $breakpoint, $min-width in variables.$breakpoints {
|
|
164
|
-
$size-unit: false;
|
|
165
|
-
@if $breakpoint == print {
|
|
166
|
-
$size-unit: in;
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
@include system.add-root-style(
|
|
170
|
-
#{variables.$variable-prefix}breakpoint-#{$breakpoint},
|
|
171
|
-
system.size-unit($min-width, $size-unit)
|
|
172
|
-
);
|
|
173
|
-
|
|
174
|
-
$container: map.get(variables.$containers, $breakpoint);
|
|
175
|
-
|
|
176
|
-
$container-max-width: map.get($container, max-width);
|
|
177
|
-
@if not $container-max-width {
|
|
178
|
-
$container-max-width: unset;
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
@include system.add-root-style(
|
|
182
|
-
#{variables.$variable-prefix}container-max-width,
|
|
183
|
-
system.size-unit($container-max-width, $size-unit),
|
|
184
|
-
$breakpoint
|
|
185
|
-
);
|
|
186
|
-
|
|
187
|
-
$container-padding: map.get($container, padding);
|
|
188
|
-
@if not $container-padding {
|
|
189
|
-
$container-padding: unset;
|
|
190
|
-
}
|
|
191
|
-
|
|
192
|
-
@include system.add-root-style(
|
|
193
|
-
#{variables.$variable-prefix}container-padding,
|
|
194
|
-
system.size-unit($container-padding, $size-unit),
|
|
195
|
-
$breakpoint
|
|
196
|
-
);
|
|
197
|
-
|
|
198
|
-
$gutter: map.get(variables.$gutter, $breakpoint);
|
|
199
|
-
@if not $gutter {
|
|
200
|
-
$gutter: (
|
|
201
|
-
columns: 1,
|
|
202
|
-
);
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
$columns: map.get(variables.$columns, $breakpoint);
|
|
206
|
-
|
|
207
|
-
$gap: map.get($gutter, gap);
|
|
208
|
-
$row-gap: unset;
|
|
209
|
-
$column-gap: unset;
|
|
210
|
-
@if $gap {
|
|
211
|
-
$row-gap: $gap;
|
|
212
|
-
$column-gap: $gap;
|
|
213
|
-
} @else {
|
|
214
|
-
@if map.has-key($gutter, row-gap) {
|
|
215
|
-
$row-gap: map.get($gutter, row-gap);
|
|
216
|
-
}
|
|
217
|
-
@if map.has-key($gutter, column-gap) {
|
|
218
|
-
$column-gap: map.get($gutter, column-gap);
|
|
219
|
-
}
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
@include system.add-root-style(
|
|
223
|
-
#{variables.$variable-prefix}gutter-columns,
|
|
224
|
-
$columns,
|
|
225
|
-
$breakpoint
|
|
226
|
-
);
|
|
227
|
-
@include system.add-root-style(
|
|
228
|
-
#{variables.$variable-prefix}gutter-row-gap,
|
|
229
|
-
system.size-unit($row-gap, $size-unit),
|
|
230
|
-
$breakpoint
|
|
231
|
-
);
|
|
232
|
-
|
|
233
|
-
@include system.add-root-style(
|
|
234
|
-
#{variables.$variable-prefix}gutter-column-gap,
|
|
235
|
-
system.size-unit($column-gap, $size-unit),
|
|
236
|
-
$breakpoint
|
|
237
|
-
);
|
|
238
|
-
}
|
|
239
|
-
|
|
240
163
|
@mixin pdf-flex-col($span) {
|
|
241
164
|
width: functions.calculate-pdf-col-span-minus-one-gutter($span);
|
|
242
165
|
}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
@use "variables";
|
|
2
|
+
@use "../system";
|
|
3
|
+
@use "sass:map";
|
|
4
|
+
|
|
5
|
+
@each $breakpoint, $min-width in variables.$breakpoints {
|
|
6
|
+
$size-unit: false;
|
|
7
|
+
@if $breakpoint == print {
|
|
8
|
+
$size-unit: in;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
@include system.add-root-style(
|
|
12
|
+
#{variables.$variable-prefix}breakpoint-#{$breakpoint},
|
|
13
|
+
system.size-unit($min-width, $size-unit)
|
|
14
|
+
);
|
|
15
|
+
|
|
16
|
+
$container: map.get(variables.$containers, $breakpoint);
|
|
17
|
+
|
|
18
|
+
$container-max-width: map.get($container, max-width);
|
|
19
|
+
@if not $container-max-width {
|
|
20
|
+
$container-max-width: unset;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
@include system.add-root-style(
|
|
24
|
+
#{variables.$variable-prefix}container-max-width,
|
|
25
|
+
system.size-unit($container-max-width, $size-unit),
|
|
26
|
+
$breakpoint
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
$container-padding: map.get($container, padding);
|
|
30
|
+
@if not $container-padding {
|
|
31
|
+
$container-padding: unset;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
@include system.add-root-style(
|
|
35
|
+
#{variables.$variable-prefix}container-padding,
|
|
36
|
+
system.size-unit($container-padding, $size-unit),
|
|
37
|
+
$breakpoint
|
|
38
|
+
);
|
|
39
|
+
|
|
40
|
+
$gutter: map.get(variables.$gutter, $breakpoint);
|
|
41
|
+
@if not $gutter {
|
|
42
|
+
$gutter: (
|
|
43
|
+
columns: 1,
|
|
44
|
+
);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
$columns: map.get(variables.$columns, $breakpoint);
|
|
48
|
+
|
|
49
|
+
$gap: map.get($gutter, gap);
|
|
50
|
+
$row-gap: unset;
|
|
51
|
+
$column-gap: unset;
|
|
52
|
+
@if $gap {
|
|
53
|
+
$row-gap: $gap;
|
|
54
|
+
$column-gap: $gap;
|
|
55
|
+
} @else {
|
|
56
|
+
@if map.has-key($gutter, row-gap) {
|
|
57
|
+
$row-gap: map.get($gutter, row-gap);
|
|
58
|
+
}
|
|
59
|
+
@if map.has-key($gutter, column-gap) {
|
|
60
|
+
$column-gap: map.get($gutter, column-gap);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
@include system.add-root-style(
|
|
65
|
+
#{variables.$variable-prefix}gutter-columns,
|
|
66
|
+
$columns,
|
|
67
|
+
$breakpoint
|
|
68
|
+
);
|
|
69
|
+
@include system.add-root-style(
|
|
70
|
+
#{variables.$variable-prefix}gutter-row-gap,
|
|
71
|
+
system.size-unit($row-gap, $size-unit),
|
|
72
|
+
$breakpoint
|
|
73
|
+
);
|
|
74
|
+
|
|
75
|
+
@include system.add-root-style(
|
|
76
|
+
#{variables.$variable-prefix}gutter-column-gap,
|
|
77
|
+
system.size-unit($column-gap, $size-unit),
|
|
78
|
+
$breakpoint
|
|
79
|
+
);
|
|
80
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
@use "./colors/root" as *;
|
|
2
|
+
@use "./fonts/root" as *;
|
|
3
|
+
@use "./grid/root" as *;
|
|
4
|
+
@use "./helpers/root" as *;
|
|
5
|
+
@use "./meta/root" as *;
|
|
6
|
+
@use "./spacer/root" as *;
|
|
7
|
+
@use "./typography/root" as *;
|
|
8
|
+
@use "./system";
|
|
9
|
+
|
|
10
|
+
@each $key, $value in system.$root-styles {
|
|
11
|
+
@include system.add-root-style($key, $value);
|
|
12
|
+
}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
@use 'variables';
|
|
2
2
|
@use 'sass:map';
|
|
3
|
+
@use "../system";
|
|
3
4
|
|
|
4
5
|
@function get($spacer) {
|
|
5
6
|
@if not map.has-key(variables.$spacer, $spacer) {
|
|
6
7
|
@error "Invalid column-gap "#{$spacer}" specified! Choose one of #{map.keys(variables.$spacer)}";
|
|
7
8
|
}
|
|
8
|
-
@return
|
|
9
|
+
@return system.root-style(#{variables.$variable-prefix}spacer-#{$spacer});
|
|
9
10
|
}
|
package/scss/spacer/mixins.scss
CHANGED
|
@@ -72,58 +72,6 @@
|
|
|
72
72
|
column-gap: functions.get($spacer);
|
|
73
73
|
}
|
|
74
74
|
|
|
75
|
-
@each $spacer, $spacerValue in variables.$spacer {
|
|
76
|
-
$varName: #{variables.$variable-prefix}spacer-#{$spacer};
|
|
77
|
-
@include system.add-root-style(
|
|
78
|
-
$varName,
|
|
79
|
-
system.size-unit(map.get($spacerValue, size))
|
|
80
|
-
);
|
|
81
|
-
|
|
82
|
-
@if not (map.has-key($spacerValue, media) and map.has-key(map.get($spacerValue, media), print)) {
|
|
83
|
-
@include system.add-root-style(
|
|
84
|
-
$varName,
|
|
85
|
-
system.size-unit(map.get($spacerValue, size)),
|
|
86
|
-
print
|
|
87
|
-
);
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
@if map.has-key($spacerValue, media) {
|
|
91
|
-
@each $breakpoint, $breakpointValue in map.get($spacerValue, media) {
|
|
92
|
-
@if $breakpoint == print {
|
|
93
|
-
@include system.add-root-style(
|
|
94
|
-
$varName,
|
|
95
|
-
system.size-unit(map.get($breakpointValue, size)),
|
|
96
|
-
print
|
|
97
|
-
);
|
|
98
|
-
} @else if $breakpoint == up {
|
|
99
|
-
@each $upBreakpoint, $upBreakpointValue in $breakpointValue {
|
|
100
|
-
@include system.add-root-style(
|
|
101
|
-
$varName,
|
|
102
|
-
system.size-unit($upBreakpointValue),
|
|
103
|
-
$upBreakpoint,
|
|
104
|
-
up
|
|
105
|
-
);
|
|
106
|
-
}
|
|
107
|
-
} @else if $breakpoint == down {
|
|
108
|
-
@each $downBreakpoint, $downBreakpointValue in $breakpointValue {
|
|
109
|
-
@include system.add-root-style(
|
|
110
|
-
$varName,
|
|
111
|
-
system.size-unit($downBreakpointValue),
|
|
112
|
-
$downBreakpoint,
|
|
113
|
-
down
|
|
114
|
-
);
|
|
115
|
-
}
|
|
116
|
-
} @else {
|
|
117
|
-
@include system.add-root-style(
|
|
118
|
-
$varName,
|
|
119
|
-
system.size-unit($breakpointValue),
|
|
120
|
-
$breakpoint
|
|
121
|
-
);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
|
|
127
75
|
@mixin core-styles {
|
|
128
76
|
@at-root {
|
|
129
77
|
@each $spacer, $spacerValue in variables.$spacer {
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
@use "variables";
|
|
2
|
+
@use "../system";
|
|
3
|
+
@use "sass:map";
|
|
4
|
+
|
|
5
|
+
@each $spacer, $spacerValue in variables.$spacer {
|
|
6
|
+
$varName: #{variables.$variable-prefix}spacer-#{$spacer};
|
|
7
|
+
@include system.add-root-style(
|
|
8
|
+
$varName,
|
|
9
|
+
system.size-unit(map.get($spacerValue, size))
|
|
10
|
+
);
|
|
11
|
+
|
|
12
|
+
@if not (map.has-key($spacerValue, media) and map.has-key(map.get($spacerValue, media), print)) {
|
|
13
|
+
@include system.add-root-style(
|
|
14
|
+
$varName,
|
|
15
|
+
system.size-unit(map.get($spacerValue, size)),
|
|
16
|
+
print
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@if map.has-key($spacerValue, media) {
|
|
21
|
+
@each $breakpoint, $breakpointValue in map.get($spacerValue, media) {
|
|
22
|
+
@if $breakpoint == print {
|
|
23
|
+
@include system.add-root-style(
|
|
24
|
+
$varName,
|
|
25
|
+
system.size-unit(map.get($breakpointValue, size)),
|
|
26
|
+
print
|
|
27
|
+
);
|
|
28
|
+
} @else if $breakpoint == up {
|
|
29
|
+
@each $upBreakpoint, $upBreakpointValue in $breakpointValue {
|
|
30
|
+
@include system.add-root-style(
|
|
31
|
+
$varName,
|
|
32
|
+
system.size-unit($upBreakpointValue),
|
|
33
|
+
$upBreakpoint,
|
|
34
|
+
up
|
|
35
|
+
);
|
|
36
|
+
}
|
|
37
|
+
} @else if $breakpoint == down {
|
|
38
|
+
@each $downBreakpoint, $downBreakpointValue in $breakpointValue {
|
|
39
|
+
@include system.add-root-style(
|
|
40
|
+
$varName,
|
|
41
|
+
system.size-unit($downBreakpointValue),
|
|
42
|
+
$downBreakpoint,
|
|
43
|
+
down
|
|
44
|
+
);
|
|
45
|
+
}
|
|
46
|
+
} @else {
|
|
47
|
+
@include system.add-root-style(
|
|
48
|
+
$varName,
|
|
49
|
+
system.size-unit($breakpointValue),
|
|
50
|
+
$breakpoint
|
|
51
|
+
);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@use 'variables';
|
|
2
|
+
@use "mixins";
|
|
2
3
|
@use 'sass:map';
|
|
3
4
|
@use 'sass:list';
|
|
4
5
|
@use 'sass:math';
|
|
@@ -44,6 +45,11 @@
|
|
|
44
45
|
@return $fallback;
|
|
45
46
|
}
|
|
46
47
|
|
|
48
|
+
@function unit-to-number($unit) {
|
|
49
|
+
// $unit z.B. "em" oder "pt"
|
|
50
|
+
@return 1#{$unit}; // ergibt 1em / 1pt als Number mit Einheit
|
|
51
|
+
}
|
|
52
|
+
|
|
47
53
|
@function size-unit($size, $size-unit: false) {
|
|
48
54
|
@if not $size-unit {
|
|
49
55
|
$size-unit: variables.$size-unit;
|
|
@@ -51,11 +57,21 @@
|
|
|
51
57
|
@if meta.type-of($size) == 'number' and math.is-unitless($size) and $size != 0
|
|
52
58
|
{
|
|
53
59
|
@if $size-unit == 'rem' {
|
|
54
|
-
@return math.div($size, variables.$root-size)
|
|
60
|
+
@return math.div($size, variables.$root-size) * 1rem;
|
|
55
61
|
} @else if $size-unit == 'in' {
|
|
56
|
-
@return math.div($size, variables.$dpi)
|
|
62
|
+
@return math.div($size, variables.$dpi) * 1in;
|
|
57
63
|
} @else if $size-unit == 'pt' {
|
|
58
|
-
@return ($size * variables.$point)
|
|
64
|
+
@return ($size * variables.$point) * 1pt;
|
|
65
|
+
} @else if $size-unit == 'px' {
|
|
66
|
+
@return $size * 1px;
|
|
67
|
+
} @else if $size-unit == 'cm' {
|
|
68
|
+
@return math.div($size, variables.$dpi) * 2.54cm;
|
|
69
|
+
} @else if $size-unit == 'mm' {
|
|
70
|
+
@return math.div($size, variables.$dpi) * 25.4mm;
|
|
71
|
+
} @else if $size-unit == 'pc' {
|
|
72
|
+
@return math.div($size, variables.$dpi) * 6pc;
|
|
73
|
+
} @else if $size-unit == 'Q' {
|
|
74
|
+
@return math.div($size, variables.$dpi) * 101.6Q;
|
|
59
75
|
} @else {
|
|
60
76
|
@return $size + $size-unit;
|
|
61
77
|
}
|
|
@@ -64,7 +80,7 @@
|
|
|
64
80
|
} @else if $size == null {
|
|
65
81
|
@return unset;
|
|
66
82
|
} @else {
|
|
67
|
-
@return
|
|
83
|
+
@return $size;
|
|
68
84
|
}
|
|
69
85
|
}
|
|
70
86
|
|
|
@@ -72,6 +88,55 @@
|
|
|
72
88
|
@if meta.type-of($number) == 'number' and not math.is-unitless($number) {
|
|
73
89
|
@return math.div($number, ($number * 0 + 1));
|
|
74
90
|
}
|
|
75
|
-
|
|
76
91
|
@return $number;
|
|
77
92
|
}
|
|
93
|
+
|
|
94
|
+
@function number-to-unit($number, $unit) {
|
|
95
|
+
@if $unit == 'rem' {
|
|
96
|
+
@return $number * 1rem;
|
|
97
|
+
} @else if $unit == 'in' {
|
|
98
|
+
@return $number * 1in;
|
|
99
|
+
} @else if $unit == 'pt' {
|
|
100
|
+
@return $number * 1pt;
|
|
101
|
+
} @else if $unit == 'px' {
|
|
102
|
+
@return $number * 1px;
|
|
103
|
+
} @else if $unit == 'cm' {
|
|
104
|
+
@return $number * 1cm;
|
|
105
|
+
} @else if $unit == 'mm' {
|
|
106
|
+
@return $number * 1mm;
|
|
107
|
+
} @else if $unit == 'pc' {
|
|
108
|
+
@return $number * 1pc;
|
|
109
|
+
} @else if $unit == 'Q' {
|
|
110
|
+
@return $number * 1Q;
|
|
111
|
+
} @else {
|
|
112
|
+
@return $number + $unit;
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
@function round-if-unit($value) {
|
|
117
|
+
@if meta.type-of($value) == 'number' and not math.is-unitless($value) {
|
|
118
|
+
$unit: math.unit($value);
|
|
119
|
+
@return number-to-unit(math.round(strip-unit($value)), $unit);
|
|
120
|
+
}
|
|
121
|
+
@return $value;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
@function root-style($varname, $default: unset) {
|
|
125
|
+
@if variables.$build == 'word' {
|
|
126
|
+
$res: map.get(mixins.$stylesOnly, print, $varname);
|
|
127
|
+
@if $res == null {
|
|
128
|
+
$res: map.get(mixins.$stylesUp, print, $varname);
|
|
129
|
+
}
|
|
130
|
+
@if $res == null {
|
|
131
|
+
$res: map.get(mixins.$styles, $varname);
|
|
132
|
+
}
|
|
133
|
+
@if meta.type-of($res) == 'number' and math.unit($res) == 'pt' {
|
|
134
|
+
$res: round-if-unit($res);
|
|
135
|
+
}
|
|
136
|
+
@if $res == null {
|
|
137
|
+
$res: $default;
|
|
138
|
+
}
|
|
139
|
+
@return $res;
|
|
140
|
+
}
|
|
141
|
+
@return var(--#{$varname}, #{$default});
|
|
142
|
+
}
|
package/scss/system/root.scss
CHANGED