@rolster/styles-foundations 3.0.3 → 3.0.5

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.
Files changed (86) hide show
  1. package/LICENSE +21 -21
  2. package/dist/design-system-bordered.css +18 -20
  3. package/dist/design-system-bordered.css.map +1 -1
  4. package/dist/design-system-bordered.min.css +5 -5
  5. package/dist/design-system-filled.css +14 -16
  6. package/dist/design-system-filled.css.map +1 -1
  7. package/dist/design-system-filled.min.css +4 -4
  8. package/package.json +41 -41
  9. package/scss/design-system-bordered/app.scss +228 -228
  10. package/scss/design-system-bordered/atoms/amount.scss +58 -58
  11. package/scss/design-system-bordered/atoms/area-text.scss +100 -100
  12. package/scss/design-system-bordered/atoms/avatar.scss +50 -50
  13. package/scss/design-system-bordered/atoms/badge.scss +51 -51
  14. package/scss/design-system-bordered/atoms/breadcrumb.scss +87 -87
  15. package/scss/design-system-bordered/atoms/button-action.scss +124 -124
  16. package/scss/design-system-bordered/atoms/button-option.scss +49 -49
  17. package/scss/design-system-bordered/atoms/button.scss +4 -4
  18. package/scss/design-system-bordered/atoms/image.scss +37 -37
  19. package/scss/design-system-bordered/atoms/input-decimal.scss +15 -15
  20. package/scss/design-system-bordered/atoms/input-money.scss +15 -15
  21. package/scss/design-system-bordered/atoms/input-number.scss +12 -12
  22. package/scss/design-system-bordered/atoms/input-password.scss +48 -48
  23. package/scss/design-system-bordered/atoms/input-percentage.scss +12 -12
  24. package/scss/design-system-bordered/atoms/input-search.scss +28 -28
  25. package/scss/design-system-bordered/atoms/input-text.scss +12 -12
  26. package/scss/design-system-bordered/atoms/label.scss +20 -20
  27. package/scss/design-system-bordered/atoms/led.scss +31 -31
  28. package/scss/design-system-bordered/atoms/message-icon.scss +21 -21
  29. package/scss/design-system-bordered/atoms/poster.scss +42 -42
  30. package/scss/design-system-bordered/atoms/progress-bar.scss +83 -83
  31. package/scss/design-system-bordered/atoms/progress-circular.scss +59 -59
  32. package/scss/design-system-bordered/atoms/radio-button.scss +55 -55
  33. package/scss/design-system-bordered/atoms/spinner.scss +102 -102
  34. package/scss/design-system-bordered/atoms/switch.scss +71 -71
  35. package/scss/design-system-bordered/atoms/tabular-text.scss +38 -38
  36. package/scss/design-system-bordered/molecules/alert.scss +52 -52
  37. package/scss/design-system-bordered/molecules/button-progress.scss +15 -15
  38. package/scss/design-system-bordered/molecules/button-toggle.scss +100 -100
  39. package/scss/design-system-bordered/molecules/field-area.scss +13 -13
  40. package/scss/design-system-bordered/molecules/field-decimal.scss +14 -14
  41. package/scss/design-system-bordered/molecules/field-file.scss +41 -41
  42. package/scss/design-system-bordered/molecules/field-list-suggestions.scss +65 -65
  43. package/scss/design-system-bordered/molecules/field-money.scss +14 -14
  44. package/scss/design-system-bordered/molecules/field-password.scss +23 -23
  45. package/scss/design-system-bordered/molecules/field-readonly.scss +24 -24
  46. package/scss/design-system-bordered/molecules/label-check-box.scss +72 -72
  47. package/scss/design-system-bordered/molecules/label-radio-button.scss +79 -79
  48. package/scss/design-system-bordered/molecules/label-switch.scss +71 -71
  49. package/scss/design-system-bordered/molecules/message-empty.scss +16 -17
  50. package/scss/design-system-bordered/molecules/pagination.scss +114 -114
  51. package/scss/design-system-bordered/molecules/picker-day-range.scss +109 -109
  52. package/scss/design-system-bordered/molecules/picker-day.scss +117 -117
  53. package/scss/design-system-bordered/molecules/picker-month.scss +67 -67
  54. package/scss/design-system-bordered/molecules/picker-selector-title.scss +54 -54
  55. package/scss/design-system-bordered/molecules/picker-year.scss +113 -113
  56. package/scss/design-system-bordered/molecules/slider.scss +74 -74
  57. package/scss/design-system-bordered/molecules/tabs.scss +51 -51
  58. package/scss/design-system-bordered/molecules/toolbar.scss +53 -53
  59. package/scss/design-system-bordered/organisms/bottom-sheet.scss +108 -108
  60. package/scss/design-system-bordered/organisms/card.scss +36 -36
  61. package/scss/design-system-bordered/organisms/confirmation.scss +186 -186
  62. package/scss/design-system-bordered/organisms/dropdown.scss +45 -45
  63. package/scss/design-system-bordered/organisms/field-autocomplete.scss +79 -79
  64. package/scss/design-system-bordered/organisms/field-clock.scss +62 -62
  65. package/scss/design-system-bordered/organisms/field-date-range.scss +60 -60
  66. package/scss/design-system-bordered/organisms/field-date.scss +61 -61
  67. package/scss/design-system-bordered/organisms/form-navigation.scss +46 -46
  68. package/scss/design-system-bordered/organisms/image-chooser.scss +50 -50
  69. package/scss/design-system-bordered/organisms/image-editor-modal.scss +23 -23
  70. package/scss/design-system-bordered/organisms/image-editor.scss +118 -118
  71. package/scss/design-system-bordered/organisms/modal-sheet.scss +138 -138
  72. package/scss/design-system-bordered/organisms/modal.scss +75 -75
  73. package/scss/design-system-bordered/organisms/picker-clock.scss +144 -144
  74. package/scss/design-system-bordered/organisms/picker-date-range.scss +84 -84
  75. package/scss/design-system-bordered/organisms/picker-date.scss +86 -86
  76. package/scss/design-system-bordered/organisms/snackbar.scss +93 -93
  77. package/scss/design-system-filled/atoms/led.scss +31 -31
  78. package/scss/design-system-filled/molecules/message-empty.scss +16 -17
  79. package/scss/foundations/borders.scss +14 -14
  80. package/scss/foundations/elevations.scss +130 -130
  81. package/scss/foundations/flex-boxs.scss +96 -96
  82. package/scss/foundations/helpers.scss +123 -123
  83. package/scss/foundations/themes.scss +230 -230
  84. package/scss/utilities/helpers.scss +124 -124
  85. package/scss/utilities/layout.scss +83 -83
  86. package/scss/utilities/typographics.scss +208 -208
package/scss/foundations/themes.scss CHANGED
@@ -1,230 +1,230 @@
1
- // Rolster Technology Themes Foundations
2
- // v2.5.3
3
- // @license MIT
4
- // Author: Rolster Developers
5
- // Created: 03/Mar/2022
6
- // Updated: 09/Abr/2026
7
-
8
- @mixin rolster-app-border($token) {
9
- --rls-app-border-1-#{$token}: var(--rls-border-1) solid
10
- var(--rls-app-color-#{$token});
11
-
12
- --rls-app-border-2-#{$token}: var(--rls-border-2) solid
13
- var(--rls-app-color-#{$token});
14
-
15
- --rls-app-border-4-#{$token}: var(--rls-border-4) solid
16
- var(--rls-app-color-#{$token});
17
- }
18
-
19
- @mixin rolster-border-color($theme, $token) {
20
- --rls-#{$theme}-border-1-#{$token}: var(--rls-border-1) solid
21
- var(--rls-#{$theme}-color-#{$token});
22
-
23
- --rls-#{$theme}-border-2-#{$token}: var(--rls-border-2) solid
24
- var(--rls-#{$theme}-color-#{$token});
25
-
26
- --rls-#{$theme}-border-4-#{$token}: var(--rls-border-4) solid
27
- var(--rls-#{$theme}-color-#{$token});
28
- }
29
-
30
- @mixin rolster-border-token($theme) {
31
- @include rolster-border-color($theme, 100);
32
- @include rolster-border-color($theme, 200);
33
- @include rolster-border-color($theme, 300);
34
- @include rolster-border-color($theme, 400);
35
- @include rolster-border-color($theme, 500);
36
- @include rolster-border-color($theme, 600);
37
- @include rolster-border-color($theme, 700);
38
- @include rolster-border-color($theme, 800);
39
- @include rolster-border-color($theme, 900);
40
- }
41
-
42
- @mixin rolster-border-theme($theme, $token) {
43
- --rls-theme-border-1-#{$token}: var(--rls-border-1) solid
44
- var(--rls-#{$theme}-color-#{$token});
45
-
46
- --rls-theme-border-2-#{$token}: var(--rls-border-2) solid
47
- var(--rls-#{$theme}-color-#{$token});
48
-
49
- --rls-theme-border-4-#{$token}: var(--rls-border-4) solid
50
- var(--rls-#{$theme}-color-#{$token});
51
- }
52
-
53
- @mixin rolster-theme($theme) {
54
- --rls-theme-color-950: var(--rls-#{$theme}-color-950);
55
-
56
- --rls-theme-color-900: var(--rls-#{$theme}-color-900);
57
-
58
- --rls-theme-color-800: var(--rls-#{$theme}-color-800);
59
-
60
- --rls-theme-color-700: var(--rls-#{$theme}-color-700);
61
-
62
- --rls-theme-color-600: var(--rls-#{$theme}-color-600);
63
-
64
- --rls-theme-color-500: var(--rls-#{$theme}-color-500);
65
-
66
- --rls-theme-color-400: var(--rls-#{$theme}-color-400);
67
-
68
- --rls-theme-color-300: var(--rls-#{$theme}-color-300);
69
-
70
- --rls-theme-color-200: var(--rls-#{$theme}-color-200);
71
-
72
- --rls-theme-color-100: var(--rls-#{$theme}-color-100);
73
-
74
- --rls-theme-color-050: var(--rls-#{$theme}-color-050);
75
-
76
- --rls-theme-font-900: var(--rls-#{$theme}-color-050);
77
-
78
- --rls-theme-color-050: var(--rls-#{$theme}-color-050);
79
-
80
- --rls-theme-font-100: var(--rls-#{$theme}-color-900);
81
-
82
- --rls-theme-skeleton-500: var(--rls-#{$theme}-skeleton-500);
83
-
84
- --rls-theme-skeleton-400: var(--rls-#{$theme}-skeleton-400);
85
-
86
- --rls-theme-skeleton-300: var(--rls-#{$theme}-skeleton-300);
87
-
88
- --rls-theme-skeleton-200: var(--rls-#{$theme}-skeleton-200);
89
-
90
- --rls-theme-skeleton-100: var(--rls-#{$theme}-skeleton-100);
91
-
92
- --rls-theme-shadow-color-500: var(--rls-#{$theme}-shadow-color-500);
93
-
94
- --rls-theme-shadow-500: var(--rls-#{$theme}-shadow-500);
95
-
96
- --rls-theme-backdrop-100: var(--rls-#{$theme}-backdrop-100);
97
-
98
- --rls-theme-backdrop-200: var(--rls-#{$theme}-backdrop-200);
99
-
100
- --rls-theme-backdrop-300: var(--rls-#{$theme}-backdrop-300);
101
-
102
- --rls-theme-backdrop-400: var(--rls-#{$theme}-backdrop-400);
103
-
104
- --rls-theme-backdrop-500: var(--rls-#{$theme}-backdrop-500);
105
-
106
- --rls-theme-backdrop-600: var(--rls-#{$theme}-backdrop-600);
107
-
108
- --rls-theme-backdrop-700: var(--rls-#{$theme}-backdrop-700);
109
-
110
- --rls-theme-backdrop-800: var(--rls-#{$theme}-backdrop-800);
111
-
112
- --rls-theme-backdrop-900: var(--rls-#{$theme}-backdrop-900);
113
-
114
- --rls-theme-gradient-700: var(--rls-#{$theme}-gradient-700);
115
-
116
- --rls-theme-gradient-600: var(--rls-#{$theme}-gradient-600);
117
-
118
- --rls-theme-gradient-500: var(--rls-#{$theme}-gradient-500);
119
-
120
- --rls-theme-gradient-400: var(--rls-#{$theme}-gradient-400);
121
-
122
- --rls-theme-gradient-300: var(--rls-#{$theme}-gradient-300);
123
-
124
- @include rolster-border-theme($theme, 900);
125
- @include rolster-border-theme($theme, 800);
126
- @include rolster-border-theme($theme, 700);
127
- @include rolster-border-theme($theme, 600);
128
- @include rolster-border-theme($theme, 500);
129
- @include rolster-border-theme($theme, 400);
130
- @include rolster-border-theme($theme, 300);
131
- @include rolster-border-theme($theme, 200);
132
- @include rolster-border-theme($theme, 100);
133
- }
134
-
135
- body {
136
- @include rolster-app-border('050');
137
- @include rolster-app-border('100');
138
- @include rolster-app-border('200');
139
- @include rolster-app-border('300');
140
- @include rolster-app-border('400');
141
- @include rolster-app-border('500');
142
- @include rolster-app-border('600');
143
- @include rolster-app-border('700');
144
- @include rolster-app-border('800');
145
- @include rolster-app-border('900');
146
-
147
- @include rolster-border-token('standard');
148
- @include rolster-border-token('primary');
149
- @include rolster-border-token('secondary');
150
- @include rolster-border-token('tertiary');
151
- @include rolster-border-token('success');
152
- @include rolster-border-token('info');
153
- @include rolster-border-token('warning');
154
- @include rolster-border-token('danger');
155
- @include rolster-border-token('berry');
156
- @include rolster-border-token('ross');
157
- @include rolster-border-token('hope');
158
- @include rolster-border-token('mountains');
159
- @include rolster-border-token('amaizing');
160
- @include rolster-border-token('purple');
161
- @include rolster-border-token('amber');
162
- @include rolster-border-token('smartness');
163
- @include rolster-border-token('obsidian');
164
-
165
- @include rolster-theme('primary');
166
- }
167
-
168
- *[rls-theme='standard'] {
169
- @include rolster-theme('standard');
170
- }
171
-
172
- *[rls-theme='secondary'] {
173
- @include rolster-theme('secondary');
174
- }
175
-
176
- *[rls-theme='tertiary'] {
177
- @include rolster-theme('tertiary');
178
- }
179
-
180
- *[rls-theme='success'] {
181
- @include rolster-theme('success');
182
- }
183
-
184
- *[rls-theme='info'] {
185
- @include rolster-theme('info');
186
- }
187
-
188
- *[rls-theme='warning'] {
189
- @include rolster-theme('warning');
190
- }
191
-
192
- *[rls-theme='danger'] {
193
- @include rolster-theme('danger');
194
- }
195
-
196
- *[rls-theme='berry'] {
197
- @include rolster-theme('berry');
198
- }
199
-
200
- *[rls-theme='ross'] {
201
- @include rolster-theme('ross');
202
- }
203
-
204
- *[rls-theme='hope'] {
205
- @include rolster-theme('hope');
206
- }
207
-
208
- *[rls-theme='mountains'] {
209
- @include rolster-theme('mountains');
210
- }
211
-
212
- *[rls-theme='amaizing'] {
213
- @include rolster-theme('amaizing');
214
- }
215
-
216
- *[rls-theme='purple'] {
217
- @include rolster-theme('purple');
218
- }
219
-
220
- *[rls-theme='amber'] {
221
- @include rolster-theme('amber');
222
- }
223
-
224
- *[rls-theme='smartness'] {
225
- @include rolster-theme('smartness');
226
- }
227
-
228
- *[rls-theme='obsidian'] {
229
- @include rolster-theme('obsidian');
230
- }
1
+ // Rolster Technology Themes Foundations
2
+ // v2.5.3
3
+ // @license MIT
4
+ // Author: Rolster Developers
5
+ // Created: 03/Mar/2022
6
+ // Updated: 09/Abr/2026
7
+
8
+ @mixin rolster-app-border($token) {
9
+ --rls-app-border-1-#{$token}: var(--rls-border-1) solid
10
+ var(--rls-app-color-#{$token});
11
+
12
+ --rls-app-border-2-#{$token}: var(--rls-border-2) solid
13
+ var(--rls-app-color-#{$token});
14
+
15
+ --rls-app-border-4-#{$token}: var(--rls-border-4) solid
16
+ var(--rls-app-color-#{$token});
17
+ }
18
+
19
+ @mixin rolster-border-color($theme, $token) {
20
+ --rls-#{$theme}-border-1-#{$token}: var(--rls-border-1) solid
21
+ var(--rls-#{$theme}-color-#{$token});
22
+
23
+ --rls-#{$theme}-border-2-#{$token}: var(--rls-border-2) solid
24
+ var(--rls-#{$theme}-color-#{$token});
25
+
26
+ --rls-#{$theme}-border-4-#{$token}: var(--rls-border-4) solid
27
+ var(--rls-#{$theme}-color-#{$token});
28
+ }
29
+
30
+ @mixin rolster-border-token($theme) {
31
+ @include rolster-border-color($theme, 100);
32
+ @include rolster-border-color($theme, 200);
33
+ @include rolster-border-color($theme, 300);
34
+ @include rolster-border-color($theme, 400);
35
+ @include rolster-border-color($theme, 500);
36
+ @include rolster-border-color($theme, 600);
37
+ @include rolster-border-color($theme, 700);
38
+ @include rolster-border-color($theme, 800);
39
+ @include rolster-border-color($theme, 900);
40
+ }
41
+
42
+ @mixin rolster-border-theme($theme, $token) {
43
+ --rls-theme-border-1-#{$token}: var(--rls-border-1) solid
44
+ var(--rls-#{$theme}-color-#{$token});
45
+
46
+ --rls-theme-border-2-#{$token}: var(--rls-border-2) solid
47
+ var(--rls-#{$theme}-color-#{$token});
48
+
49
+ --rls-theme-border-4-#{$token}: var(--rls-border-4) solid
50
+ var(--rls-#{$theme}-color-#{$token});
51
+ }
52
+
53
+ @mixin rolster-theme($theme) {
54
+ --rls-theme-color-950: var(--rls-#{$theme}-color-950);
55
+
56
+ --rls-theme-color-900: var(--rls-#{$theme}-color-900);
57
+
58
+ --rls-theme-color-800: var(--rls-#{$theme}-color-800);
59
+
60
+ --rls-theme-color-700: var(--rls-#{$theme}-color-700);
61
+
62
+ --rls-theme-color-600: var(--rls-#{$theme}-color-600);
63
+
64
+ --rls-theme-color-500: var(--rls-#{$theme}-color-500);
65
+
66
+ --rls-theme-color-400: var(--rls-#{$theme}-color-400);
67
+
68
+ --rls-theme-color-300: var(--rls-#{$theme}-color-300);
69
+
70
+ --rls-theme-color-200: var(--rls-#{$theme}-color-200);
71
+
72
+ --rls-theme-color-100: var(--rls-#{$theme}-color-100);
73
+
74
+ --rls-theme-color-050: var(--rls-#{$theme}-color-050);
75
+
76
+ --rls-theme-font-900: var(--rls-#{$theme}-color-050);
77
+
78
+ --rls-theme-color-050: var(--rls-#{$theme}-color-050);
79
+
80
+ --rls-theme-font-100: var(--rls-#{$theme}-color-900);
81
+
82
+ --rls-theme-skeleton-500: var(--rls-#{$theme}-skeleton-500);
83
+
84
+ --rls-theme-skeleton-400: var(--rls-#{$theme}-skeleton-400);
85
+
86
+ --rls-theme-skeleton-300: var(--rls-#{$theme}-skeleton-300);
87
+
88
+ --rls-theme-skeleton-200: var(--rls-#{$theme}-skeleton-200);
89
+
90
+ --rls-theme-skeleton-100: var(--rls-#{$theme}-skeleton-100);
91
+
92
+ --rls-theme-shadow-color-500: var(--rls-#{$theme}-shadow-color-500);
93
+
94
+ --rls-theme-shadow-500: var(--rls-#{$theme}-shadow-500);
95
+
96
+ --rls-theme-backdrop-100: var(--rls-#{$theme}-backdrop-100);
97
+
98
+ --rls-theme-backdrop-200: var(--rls-#{$theme}-backdrop-200);
99
+
100
+ --rls-theme-backdrop-300: var(--rls-#{$theme}-backdrop-300);
101
+
102
+ --rls-theme-backdrop-400: var(--rls-#{$theme}-backdrop-400);
103
+
104
+ --rls-theme-backdrop-500: var(--rls-#{$theme}-backdrop-500);
105
+
106
+ --rls-theme-backdrop-600: var(--rls-#{$theme}-backdrop-600);
107
+
108
+ --rls-theme-backdrop-700: var(--rls-#{$theme}-backdrop-700);
109
+
110
+ --rls-theme-backdrop-800: var(--rls-#{$theme}-backdrop-800);
111
+
112
+ --rls-theme-backdrop-900: var(--rls-#{$theme}-backdrop-900);
113
+
114
+ --rls-theme-gradient-700: var(--rls-#{$theme}-gradient-700);
115
+
116
+ --rls-theme-gradient-600: var(--rls-#{$theme}-gradient-600);
117
+
118
+ --rls-theme-gradient-500: var(--rls-#{$theme}-gradient-500);
119
+
120
+ --rls-theme-gradient-400: var(--rls-#{$theme}-gradient-400);
121
+
122
+ --rls-theme-gradient-300: var(--rls-#{$theme}-gradient-300);
123
+
124
+ @include rolster-border-theme($theme, 900);
125
+ @include rolster-border-theme($theme, 800);
126
+ @include rolster-border-theme($theme, 700);
127
+ @include rolster-border-theme($theme, 600);
128
+ @include rolster-border-theme($theme, 500);
129
+ @include rolster-border-theme($theme, 400);
130
+ @include rolster-border-theme($theme, 300);
131
+ @include rolster-border-theme($theme, 200);
132
+ @include rolster-border-theme($theme, 100);
133
+ }
134
+
135
+ body {
136
+ @include rolster-app-border('050');
137
+ @include rolster-app-border('100');
138
+ @include rolster-app-border('200');
139
+ @include rolster-app-border('300');
140
+ @include rolster-app-border('400');
141
+ @include rolster-app-border('500');
142
+ @include rolster-app-border('600');
143
+ @include rolster-app-border('700');
144
+ @include rolster-app-border('800');
145
+ @include rolster-app-border('900');
146
+
147
+ @include rolster-border-token('standard');
148
+ @include rolster-border-token('primary');
149
+ @include rolster-border-token('secondary');
150
+ @include rolster-border-token('tertiary');
151
+ @include rolster-border-token('success');
152
+ @include rolster-border-token('info');
153
+ @include rolster-border-token('warning');
154
+ @include rolster-border-token('danger');
155
+ @include rolster-border-token('berry');
156
+ @include rolster-border-token('ross');
157
+ @include rolster-border-token('hope');
158
+ @include rolster-border-token('mountains');
159
+ @include rolster-border-token('amaizing');
160
+ @include rolster-border-token('purple');
161
+ @include rolster-border-token('amber');
162
+ @include rolster-border-token('smartness');
163
+ @include rolster-border-token('obsidian');
164
+
165
+ @include rolster-theme('primary');
166
+ }
167
+
168
+ *[rls-theme='standard'] {
169
+ @include rolster-theme('standard');
170
+ }
171
+
172
+ *[rls-theme='secondary'] {
173
+ @include rolster-theme('secondary');
174
+ }
175
+
176
+ *[rls-theme='tertiary'] {
177
+ @include rolster-theme('tertiary');
178
+ }
179
+
180
+ *[rls-theme='success'] {
181
+ @include rolster-theme('success');
182
+ }
183
+
184
+ *[rls-theme='info'] {
185
+ @include rolster-theme('info');
186
+ }
187
+
188
+ *[rls-theme='warning'] {
189
+ @include rolster-theme('warning');
190
+ }
191
+
192
+ *[rls-theme='danger'] {
193
+ @include rolster-theme('danger');
194
+ }
195
+
196
+ *[rls-theme='berry'] {
197
+ @include rolster-theme('berry');
198
+ }
199
+
200
+ *[rls-theme='ross'] {
201
+ @include rolster-theme('ross');
202
+ }
203
+
204
+ *[rls-theme='hope'] {
205
+ @include rolster-theme('hope');
206
+ }
207
+
208
+ *[rls-theme='mountains'] {
209
+ @include rolster-theme('mountains');
210
+ }
211
+
212
+ *[rls-theme='amaizing'] {
213
+ @include rolster-theme('amaizing');
214
+ }
215
+
216
+ *[rls-theme='purple'] {
217
+ @include rolster-theme('purple');
218
+ }
219
+
220
+ *[rls-theme='amber'] {
221
+ @include rolster-theme('amber');
222
+ }
223
+
224
+ *[rls-theme='smartness'] {
225
+ @include rolster-theme('smartness');
226
+ }
227
+
228
+ *[rls-theme='obsidian'] {
229
+ @include rolster-theme('obsidian');
230
+ }