igniteui-theming 4.1.0-beta.1 → 5.0.0-beta.2
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "igniteui-theming",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0-beta.2",
|
|
4
4
|
"description": "A set of Sass variables, mixins, and functions for generating palettes, typography, and elevations used by Ignite UI components.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -7,9 +7,6 @@
|
|
|
7
7
|
/// @access public
|
|
8
8
|
////
|
|
9
9
|
|
|
10
|
-
/// Generates a dark calendar schema.
|
|
11
|
-
/// @type {Map}
|
|
12
|
-
|
|
13
10
|
/// Generates a dark calendar schema.
|
|
14
11
|
/// @type {Map}
|
|
15
12
|
/// @requires $light-calendar
|
|
@@ -17,11 +14,270 @@ $dark-calendar: extend($light-calendar);
|
|
|
17
14
|
|
|
18
15
|
/// Generates a dark fluent calendar schema.
|
|
19
16
|
/// @type {Map}
|
|
17
|
+
/// @prop {Map} year-selected-foreground [contrast-color: ('primary', 800)] - The foreground color of the selected year.
|
|
18
|
+
/// @prop {Map} year-selected-background [color: ('primary', 800)]- The background color of the selected year in years view.
|
|
19
|
+
/// @prop {Map} year-selected-hover-foreground [contrast-color: ('primary', 900)] - The :hover foreground color of the selected year in years view.
|
|
20
|
+
/// @prop {Map} year-selected-hover-background [color: ('primary' 900)] - The :hover background color of the selected year in years view.
|
|
21
|
+
/// @prop {Map} year-selected-focus-foreground [contrast-color: ('primary', 900)] - The :focus foreground color of the selected year in years view.
|
|
22
|
+
/// @prop {Map} year-selected-focus-background [color: ('primary' 900)] - The :focus background color of the selected year in years view.
|
|
23
|
+
/// @prop {Map} year-selected-current-hover-foreground [contrast-color: ('primary', 900)] - The :hover foreground color of the current/selected year.
|
|
24
|
+
/// @prop {Map} year-selected-current-hover-background [color: ('primary', 900)] - The :hover background color of the current/selected year.
|
|
25
|
+
/// @prop {Map} year-selected-current-focus-foreground [contrast-color: ('secondary', 900)] - The :focus foreground color of the current/selected year.
|
|
26
|
+
/// @prop {Map} year-selected-current-focus-background [color: ('secondary', 500)] - The :focus background color of the current/selected year.
|
|
27
|
+
/// @prop {Map} month-selected-foreground [contrast-color: ('primary', 800)] - The foreground color of the selected month in month view.
|
|
28
|
+
/// @prop {Map} month-selected-background [color: ('primary', 800)] - The background color of the selected month in month view.
|
|
29
|
+
/// @prop {Map} month-selected-hover-foreground [contrast-color: ('primary', 900)]- The :hover foreground color of the selected month in month view.
|
|
30
|
+
/// @prop {Map} month-selected-hover-background [color: ('primary', 900)]- The :hover background color of the selected month in month view.
|
|
31
|
+
/// @prop {Map} month-selected-focus-foreground [contrast-color: ('primary', 900)]- The :focus foreground color of the selected month in month view.
|
|
32
|
+
/// @prop {Map} month-selected-focus-background [color: ('primary', 900)]- The :focus background color of the selected month in month view.
|
|
33
|
+
/// @prop {Map} month-selected-current-foreground [contrast-color: ('primary', 800)] - The foreground color of the current/selected month in month view.
|
|
34
|
+
/// @prop {Map} month-selected-current-background [color: ('primary', 800)]- The background color of the current/selected month in month view.
|
|
35
|
+
/// @prop {Map} month-selected-current-hover-foreground [contrast-color: ('primary', 900)] - The :hover foreground color of the current/selected month in month view.
|
|
36
|
+
/// @prop {Map} month-selected-current-hover-background [color: ('primary', 900)] - The :hover background color of the current/selected month in month view.
|
|
37
|
+
/// @prop {Map} month-selected-current-focus-foreground [contrast-color: ('primary', 900)] - The :focus foreground color of the current/selected month in month view.
|
|
38
|
+
/// @prop {Map} month-selected-current-focus-background [color: ('primary', 900)] - The :focus background color of the current/selected month in month view.
|
|
39
|
+
/// @prop {Map} date-hover-foreground [contrast-color: 'gray', 50] - The :hover foreground color of a date.
|
|
40
|
+
/// @prop {Map} date-hover-background [color: ('gray', 50)] - The :hover background color of a date.
|
|
41
|
+
/// @prop {Map} date-focus-foreground [contrast-color: 'gray', 50] - The :focus foreground color of a date.
|
|
42
|
+
/// @prop {Map} date-focus-background [color: ('gray', 50)] - The :focus background color of date.
|
|
43
|
+
/// @prop {Map} date-selected-foreground [contrast-color: ('gray', 50)] - The foreground color of the selected date.
|
|
44
|
+
/// @prop {Map} date-selected-hover-foreground [contrast-color: ('secondary', 700)] - The :hover foreground color of the selected date.
|
|
45
|
+
/// @prop {Map} date-selected-hover-background [color: ('secondary', 700)] - The :hover background color of the selected date.
|
|
46
|
+
/// @prop {Map} date-selected-focus-foreground [contrast-color: ('secondary', 700)] - The :focus foreground color of the selected date.
|
|
47
|
+
/// @prop {Map} date-selected-focus-background [color: ('secondary', 700)] - The :focus background color of the selected date.
|
|
48
|
+
/// @prop {Map} date-selected-range-start-foreground [contrast-color: ('gray', 50)] - The foreground color of the first date in the selected range.
|
|
49
|
+
/// @prop {Map} date-selected-range-end-foreground [contrast-color: ('gray', 50)] - The background color of the last date in the selected range.
|
|
50
|
+
/// @prop {Map} date-selected-range-start-hover-foreground [contrast-color: ('gray', 50)] - The :hover foreground color of the first date in the selected range.
|
|
51
|
+
/// @prop {Map} date-selected-range-start-focus-foreground [contrast-color: ('gray', 50)] - The :focus foreground color of the first date in the selected range.
|
|
52
|
+
/// @prop {Map} date-selected-range-end-hover-foreground [contrast-color: ('gray', 50)] - The :hover foreground color of the last date in the selected range.
|
|
53
|
+
/// @prop {Map} date-selected-range-end-focus-foreground [contrast-color: ('gray', 50)] - The :focus foreground color of the last date in the selected range.
|
|
20
54
|
/// @prop {Map} date-disabled-foreground [color: ('gray', 300)] - The foreground of disabled dates.
|
|
21
55
|
/// @requires $fluent-calendar
|
|
22
56
|
$dark-fluent-calendar: extend(
|
|
23
57
|
$fluent-calendar,
|
|
24
58
|
(
|
|
59
|
+
year-selected-foreground: (
|
|
60
|
+
contrast-color: (
|
|
61
|
+
'primary',
|
|
62
|
+
800,
|
|
63
|
+
),
|
|
64
|
+
),
|
|
65
|
+
year-selected-background: (
|
|
66
|
+
color: (
|
|
67
|
+
'primary',
|
|
68
|
+
800,
|
|
69
|
+
),
|
|
70
|
+
),
|
|
71
|
+
year-selected-hover-foreground: (
|
|
72
|
+
contrast-color: (
|
|
73
|
+
'primary',
|
|
74
|
+
900,
|
|
75
|
+
),
|
|
76
|
+
),
|
|
77
|
+
year-selected-hover-background: (
|
|
78
|
+
color: (
|
|
79
|
+
'primary',
|
|
80
|
+
900,
|
|
81
|
+
),
|
|
82
|
+
),
|
|
83
|
+
year-selected-focus-foreground: (
|
|
84
|
+
contrast-color: (
|
|
85
|
+
'primary',
|
|
86
|
+
900,
|
|
87
|
+
),
|
|
88
|
+
),
|
|
89
|
+
year-selected-focus-background: (
|
|
90
|
+
contrast-color: (
|
|
91
|
+
'primary',
|
|
92
|
+
900,
|
|
93
|
+
),
|
|
94
|
+
),
|
|
95
|
+
year-selected-current-hover-foreground: (
|
|
96
|
+
contrast-color: (
|
|
97
|
+
'primary',
|
|
98
|
+
900,
|
|
99
|
+
),
|
|
100
|
+
),
|
|
101
|
+
year-selected-current-hover-background: (
|
|
102
|
+
color: (
|
|
103
|
+
'primary',
|
|
104
|
+
900,
|
|
105
|
+
),
|
|
106
|
+
),
|
|
107
|
+
year-selected-current-focus-foreground: (
|
|
108
|
+
contrast-color: (
|
|
109
|
+
'primary',
|
|
110
|
+
900,
|
|
111
|
+
),
|
|
112
|
+
),
|
|
113
|
+
year-selected-current-focus-background: (
|
|
114
|
+
color: (
|
|
115
|
+
'primary',
|
|
116
|
+
900,
|
|
117
|
+
),
|
|
118
|
+
),
|
|
119
|
+
month-selected-foreground: (
|
|
120
|
+
contrast-color: (
|
|
121
|
+
'primary',
|
|
122
|
+
800,
|
|
123
|
+
),
|
|
124
|
+
),
|
|
125
|
+
month-selected-background: (
|
|
126
|
+
color: (
|
|
127
|
+
'primary',
|
|
128
|
+
800,
|
|
129
|
+
),
|
|
130
|
+
),
|
|
131
|
+
month-selected-hover-foreground: (
|
|
132
|
+
contrast-color: (
|
|
133
|
+
'primary',
|
|
134
|
+
900,
|
|
135
|
+
),
|
|
136
|
+
),
|
|
137
|
+
month-selected-hover-background: (
|
|
138
|
+
color: (
|
|
139
|
+
'primary',
|
|
140
|
+
900,
|
|
141
|
+
),
|
|
142
|
+
),
|
|
143
|
+
month-selected-focus-foreground: (
|
|
144
|
+
contrast-color: (
|
|
145
|
+
'primary',
|
|
146
|
+
900,
|
|
147
|
+
),
|
|
148
|
+
),
|
|
149
|
+
month-selected-focus-background: (
|
|
150
|
+
contrast-color: (
|
|
151
|
+
'primary',
|
|
152
|
+
900,
|
|
153
|
+
),
|
|
154
|
+
),
|
|
155
|
+
month-selected-current-foreground: (
|
|
156
|
+
contrast-color: (
|
|
157
|
+
'primary',
|
|
158
|
+
800,
|
|
159
|
+
),
|
|
160
|
+
),
|
|
161
|
+
month-selected-current-background: (
|
|
162
|
+
color: (
|
|
163
|
+
'primary',
|
|
164
|
+
800,
|
|
165
|
+
),
|
|
166
|
+
),
|
|
167
|
+
month-selected-current-hover-foreground: (
|
|
168
|
+
contrast-color: (
|
|
169
|
+
'primary',
|
|
170
|
+
900,
|
|
171
|
+
),
|
|
172
|
+
),
|
|
173
|
+
month-selected-current-hover-background: (
|
|
174
|
+
color: (
|
|
175
|
+
'primary',
|
|
176
|
+
900,
|
|
177
|
+
),
|
|
178
|
+
),
|
|
179
|
+
month-selected-current-focus-foreground: (
|
|
180
|
+
contrast-color: (
|
|
181
|
+
'primary',
|
|
182
|
+
900,
|
|
183
|
+
),
|
|
184
|
+
),
|
|
185
|
+
month-selected-current-focus-background: (
|
|
186
|
+
color: (
|
|
187
|
+
'primary',
|
|
188
|
+
900,
|
|
189
|
+
),
|
|
190
|
+
),
|
|
191
|
+
date-hover-foreground: (
|
|
192
|
+
contrast-color: (
|
|
193
|
+
'gray',
|
|
194
|
+
50,
|
|
195
|
+
),
|
|
196
|
+
),
|
|
197
|
+
date-hover-background: (
|
|
198
|
+
color: (
|
|
199
|
+
'gray',
|
|
200
|
+
200,
|
|
201
|
+
),
|
|
202
|
+
),
|
|
203
|
+
date-focus-foreground: (
|
|
204
|
+
contrast-color: (
|
|
205
|
+
'gray',
|
|
206
|
+
50,
|
|
207
|
+
),
|
|
208
|
+
),
|
|
209
|
+
date-focus-background: (
|
|
210
|
+
color: (
|
|
211
|
+
'gray',
|
|
212
|
+
200,
|
|
213
|
+
),
|
|
214
|
+
),
|
|
215
|
+
date-selected-foreground: (
|
|
216
|
+
contrast-color: (
|
|
217
|
+
'gray',
|
|
218
|
+
50,
|
|
219
|
+
),
|
|
220
|
+
),
|
|
221
|
+
date-selected-hover-foreground: (
|
|
222
|
+
contrast-color: (
|
|
223
|
+
'gray',
|
|
224
|
+
50,
|
|
225
|
+
),
|
|
226
|
+
),
|
|
227
|
+
date-selected-hover-background: (
|
|
228
|
+
color: (
|
|
229
|
+
'gray',
|
|
230
|
+
200,
|
|
231
|
+
),
|
|
232
|
+
),
|
|
233
|
+
date-selected-focus-foreground: (
|
|
234
|
+
contrast-color: (
|
|
235
|
+
'gray',
|
|
236
|
+
50,
|
|
237
|
+
),
|
|
238
|
+
),
|
|
239
|
+
date-selected-focus-background: (
|
|
240
|
+
color: (
|
|
241
|
+
'gray',
|
|
242
|
+
200,
|
|
243
|
+
),
|
|
244
|
+
),
|
|
245
|
+
date-selected-range-start-foreground: (
|
|
246
|
+
contrast-color: (
|
|
247
|
+
'gray',
|
|
248
|
+
50,
|
|
249
|
+
),
|
|
250
|
+
),
|
|
251
|
+
date-selected-range-end-foreground: (
|
|
252
|
+
contrast-color: (
|
|
253
|
+
'gray',
|
|
254
|
+
50,
|
|
255
|
+
),
|
|
256
|
+
),
|
|
257
|
+
date-selected-range-start-hover-foreground: (
|
|
258
|
+
contrast-color: (
|
|
259
|
+
'gray',
|
|
260
|
+
50,
|
|
261
|
+
),
|
|
262
|
+
),
|
|
263
|
+
date-selected-range-start-focus-foreground: (
|
|
264
|
+
contrast-color: (
|
|
265
|
+
'gray',
|
|
266
|
+
50,
|
|
267
|
+
),
|
|
268
|
+
),
|
|
269
|
+
date-selected-range-end-hover-foreground: (
|
|
270
|
+
contrast-color: (
|
|
271
|
+
'gray',
|
|
272
|
+
50,
|
|
273
|
+
),
|
|
274
|
+
),
|
|
275
|
+
date-selected-range-end-focus-foreground: (
|
|
276
|
+
contrast-color: (
|
|
277
|
+
'gray',
|
|
278
|
+
50,
|
|
279
|
+
),
|
|
280
|
+
),
|
|
25
281
|
date-disabled-foreground: (
|
|
26
282
|
color: (
|
|
27
283
|
'gray',
|
|
@@ -34,14 +290,12 @@ $dark-fluent-calendar: extend(
|
|
|
34
290
|
/// Generates a dark bootstrap calendar schema.
|
|
35
291
|
/// @type {Map}
|
|
36
292
|
/// @prop {Map} content-background [color: ('gray', 50)] - The main content background color.
|
|
37
|
-
/// @prop {Color} picker-background-color [color: ('gray', 100, .5)] - The igx calendar picker background color.
|
|
38
293
|
/// @prop {Map} border-color [color: ('gray', 100)] - The calendar border color.
|
|
39
294
|
/// @prop {Map} picker-foreground [contrast-color: ('surface')]- The idle picker month/year color.
|
|
40
295
|
/// @prop {Map} date-selected-foreground [contrast-color: ('secondary', 600)] - The text color for the selected date.
|
|
41
296
|
/// @prop {Map} date-current-foreground [contrast-color: 'surface'] - The text color for the current date.
|
|
42
297
|
/// @prop {Map} date-current-hover-foreground [color: ('surface')] - The hover text color for the current date.
|
|
43
298
|
/// @prop {Map} date-current-focus-foreground [color: ('surface')] - The focus text color for the current date.
|
|
44
|
-
/// @prop {Map} week-number-background [('gray', 300, .2)] - The background color of the week number column.
|
|
45
299
|
/// @prop {Map} date-selected-hover-foreground [contrast-color: ('surface')] - The hover text color for the selected date.
|
|
46
300
|
/// @prop {Map} date-selected-focus-foreground [contrast-color: ('surface')] - The focus text color for the selected date.
|
|
47
301
|
/// @requires $bootstrap-calendar
|
|
@@ -54,66 +308,37 @@ $dark-bootstrap-calendar: extend(
|
|
|
54
308
|
50,
|
|
55
309
|
),
|
|
56
310
|
),
|
|
57
|
-
|
|
58
|
-
picker-background-color: (
|
|
59
|
-
color: (
|
|
60
|
-
'gray',
|
|
61
|
-
100,
|
|
62
|
-
0.5,
|
|
63
|
-
),
|
|
64
|
-
),
|
|
65
|
-
|
|
66
311
|
border-color: (
|
|
67
312
|
color: (
|
|
68
313
|
'gray',
|
|
69
314
|
100,
|
|
70
315
|
),
|
|
71
316
|
),
|
|
72
|
-
|
|
73
|
-
picker-foreground: (
|
|
74
|
-
contrast-color: (
|
|
75
|
-
'surface',
|
|
76
|
-
),
|
|
77
|
-
),
|
|
78
|
-
|
|
79
317
|
date-selected-foreground: (
|
|
80
318
|
contrast-color: (
|
|
81
319
|
'secondary',
|
|
82
320
|
600,
|
|
83
321
|
),
|
|
84
322
|
),
|
|
85
|
-
|
|
86
323
|
date-selected-hover-foreground: (
|
|
87
324
|
contrast-color: (
|
|
88
325
|
'surface',
|
|
89
326
|
),
|
|
90
327
|
),
|
|
91
|
-
|
|
92
328
|
date-selected-focus-foreground: (
|
|
93
329
|
contrast-color: (
|
|
94
330
|
'surface',
|
|
95
331
|
),
|
|
96
332
|
),
|
|
97
|
-
|
|
98
333
|
date-current-foreground: (
|
|
99
334
|
contrast-color: 'surface',
|
|
100
335
|
),
|
|
101
|
-
|
|
102
336
|
date-current-hover-foreground: (
|
|
103
337
|
contrast-color: 'surface',
|
|
104
338
|
),
|
|
105
|
-
|
|
106
339
|
date-current-focus-foreground: (
|
|
107
340
|
contrast-color: 'surface',
|
|
108
341
|
),
|
|
109
|
-
|
|
110
|
-
week-number-background: (
|
|
111
|
-
color: (
|
|
112
|
-
'gray',
|
|
113
|
-
300,
|
|
114
|
-
0.2,
|
|
115
|
-
),
|
|
116
|
-
),
|
|
117
342
|
)
|
|
118
343
|
);
|
|
119
344
|
|