-
Notifications
You must be signed in to change notification settings - Fork 6.7k
/
test-css-variables-theme.scss
102 lines (98 loc) · 3.85 KB
/
test-css-variables-theme.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
@use 'sass:map';
@use 'sass:meta';
@use '../all-theme';
@use '../palette';
@use '../theming';
@use '../../core-theme';
@use '../../../autocomplete/autocomplete-theme';
@use '../../../badge/badge-theme';
@use '../../../bottom-sheet/bottom-sheet-theme';
@use '../../../button/button-theme';
@use '../../../button-toggle/button-toggle-theme';
@use '../../../checkbox/checkbox-theme';
@use '../../../chips/chips-theme';
@use '../../../table/table-theme';
@use '../../../datepicker/datepicker-theme';
@use '../../../dialog/dialog-theme';
@use '../../../divider/divider-theme';
@use '../../../expansion/expansion-theme';
@use '../../../grid-list/grid-list-theme';
@use '../../../icon/icon-theme';
@use '../../../input/input-theme';
@use '../../../list/list-theme';
@use '../../../menu/menu-theme';
@use '../../../paginator/paginator-theme';
@use '../../../progress-spinner/progress-spinner-theme';
@use '../../../radio/radio-theme';
@use '../../../select/select-theme';
@use '../../../sidenav/sidenav-theme';
@use '../../../slide-toggle/slide-toggle-theme';
@use '../../../slider/slider-theme';
@use '../../../stepper/stepper-theme';
@use '../../../sort/sort-theme';
@use '../../../tabs/tabs-theme';
@use '../../../toolbar/toolbar-theme';
@use '../../../tooltip/tooltip-theme';
@use '../../../tree/tree-theme';
@use '../../../snack-bar/snack-bar-theme';
@use '../../../form-field/form-field-theme';
@use '../../../legacy-core/theming/all-theme' as legacy-all-theme;
// Recursively replaces all of the values inside a Sass map with a different value.
@function replace-all-values($palette, $replacement) {
$output: ();
@each $key, $value in $palette {
@if (meta.type-of($value) == 'map') {
$output: map.merge(($key: replace-all-values($value, $replacement)), $output);
}
@else {
$output: map.merge(($key: $replacement), $output);
}
}
@return $output;
}
// Theme used to test that our themes would compile if the colors were specified as CSS variables.
._demo-css-variables-theme {
$palette: theming.define-palette(palette.$blue-grey-palette);
$theme: theming.define-dark-theme((
color: (
primary: $palette,
accent: $palette,
warn: $palette
)
));
$css-var-theme: replace-all-values($theme, var(--test-var));
@include core-theme.theme($css-var-theme);
@include autocomplete-theme.theme($css-var-theme);
@include badge-theme.theme($css-var-theme);
@include bottom-sheet-theme.theme($css-var-theme);
@include button-theme.theme($css-var-theme);
@include button-toggle-theme.theme($css-var-theme);
@include checkbox-theme.theme($css-var-theme);
@include chips-theme.theme($css-var-theme);
@include table-theme.theme($css-var-theme);
@include datepicker-theme.theme($css-var-theme);
@include dialog-theme.theme($css-var-theme);
@include divider-theme.theme($css-var-theme);
@include expansion-theme.theme($css-var-theme);
@include form-field-theme.theme($css-var-theme);
@include grid-list-theme.theme($css-var-theme);
@include icon-theme.theme($css-var-theme);
@include input-theme.theme($css-var-theme);
@include list-theme.theme($css-var-theme);
@include menu-theme.theme($css-var-theme);
@include paginator-theme.theme($css-var-theme);
@include progress-spinner-theme.theme($css-var-theme);
@include radio-theme.theme($css-var-theme);
@include select-theme.theme($css-var-theme);
@include sidenav-theme.theme($css-var-theme);
@include slide-toggle-theme.theme($css-var-theme);
@include slider-theme.theme($css-var-theme);
@include stepper-theme.theme($css-var-theme);
@include sort-theme.theme($css-var-theme);
@include tabs-theme.theme($css-var-theme);
@include toolbar-theme.theme($css-var-theme);
@include tooltip-theme.theme($css-var-theme);
@include tree-theme.theme($css-var-theme);
@include snack-bar-theme.theme($css-var-theme);
@include legacy-all-theme.all-legacy-component-themes($css-var-theme);
}