beyond-rails 1.0.3 → 1.0.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (52) hide show
  1. checksums.yaml +4 -4
  2. data/src/js/components/BarChart.js +19 -7
  3. data/src/js/components/LineChart.js +18 -8
  4. data/src/js/components/PieChart.js +16 -6
  5. data/src/js/components/SearchDropdown.js +8 -5
  6. data/src/js/consts/index.js +42 -0
  7. data/src/js/decorators/chartCommon.js +4 -1
  8. data/src/js/index.js +0 -1
  9. data/src/sass/_base.scss +170 -0
  10. data/src/sass/_beyond-dark.scss +3 -0
  11. data/src/sass/_beyond.scss +0 -54
  12. data/src/sass/_main.scss +56 -176
  13. data/src/sass/abstracts/_mixins.scss +2 -4
  14. data/src/sass/abstracts/_placeholders.scss +3 -3
  15. data/src/sass/abstracts/_post-variables.scss +85 -0
  16. data/src/sass/abstracts/_variables.scss +301 -188
  17. data/src/sass/base/_background.scss +2 -3
  18. data/src/sass/base/_typography.scss +17 -17
  19. data/src/sass/components/_alert.scss +8 -14
  20. data/src/sass/components/_autocomplete.scss +4 -5
  21. data/src/sass/components/_badge.scss +2 -4
  22. data/src/sass/components/_breadcrumb.scss +3 -2
  23. data/src/sass/components/_btn-group.scss +1 -1
  24. data/src/sass/components/_btn.scss +34 -19
  25. data/src/sass/components/_card.scss +12 -6
  26. data/src/sass/components/_chart.scss +5 -5
  27. data/src/sass/components/_checkbox.scss +8 -8
  28. data/src/sass/components/_date-menu.scss +10 -10
  29. data/src/sass/components/_date-time-ranger.scss +9 -3
  30. data/src/sass/components/_dropdown.scss +11 -14
  31. data/src/sass/components/_form.scss +17 -18
  32. data/src/sass/components/_input.scss +4 -4
  33. data/src/sass/components/_modal.scss +5 -6
  34. data/src/sass/components/_month-menu.scss +11 -11
  35. data/src/sass/components/_nav.scss +5 -5
  36. data/src/sass/components/_navbar.scss +26 -33
  37. data/src/sass/components/_pagination.scss +9 -8
  38. data/src/sass/components/_radio.scss +2 -4
  39. data/src/sass/components/_search-dropdown.scss +3 -2
  40. data/src/sass/components/_select.scss +15 -23
  41. data/src/sass/components/_sidebar.scss +1 -1
  42. data/src/sass/components/_spinner.scss +0 -1
  43. data/src/sass/components/_switch.scss +5 -5
  44. data/src/sass/components/_tabbox.scss +19 -32
  45. data/src/sass/components/_table.scss +13 -14
  46. data/src/sass/components/_tag-input.scss +2 -4
  47. data/src/sass/components/_tag.scss +4 -4
  48. data/src/sass/components/_time-menu.scss +4 -4
  49. data/src/sass/components/_toast.scss +4 -3
  50. data/src/sass/components/_tooltip.scss +11 -14
  51. data/src/sass/themes/_dark.scss +309 -0
  52. metadata +6 -2
@@ -1,15 +1,32 @@
1
1
  $beyond-use-helper: false !default;
2
2
 
3
- // texts
4
- $text-color-strong: #1a1f36;
5
- $text-color: #3c4257;
6
- $text-color-light: #828695;
3
+ $txt: #3c4257;
4
+ $txt-strong: #1a1f36;
5
+ $txt-light: #828695;
6
+
7
+ $txt-primary: #3e51b7;
8
+ $txt-secondary: #969696;
9
+ $txt-success: #25b47e;
10
+ $txt-warn: #f1946a;
11
+ $txt-danger: #cd3d64;
12
+ $txt-muted: #495763;
13
+
14
+ $txt-anchor: #5469d4;
15
+ $txt-anchor-ex: #1a1f36;
16
+
17
+ $txt-type0: #5c5f72;
18
+ $txt-type1: #63a396;
19
+ $txt-type2: #6772e5;
20
+ $txt-type3: #4191d9;
21
+ $txt-type4: #6382a3;
7
22
 
8
- // backgrounds
9
23
  $bg-transparent: transparent;
10
24
  $bg-admin: #e3e8ee;
11
25
  $bg-outline: rgba(58, 151, 212, .28);
12
26
  $bg-content: #f7fafc;
27
+ $bg-content-shadow:
28
+ 0 -1px 3px 0 rgba(227, 232, 238, 1),
29
+ 0 1px 3px 0 rgba(227, 232, 238, 1);
13
30
 
14
31
  $bg-primary: #6772e5;
15
32
  $bg-primary-ex: #7795f8;
@@ -56,47 +73,6 @@ $bg-dark-ex2: #b7b7b7;
56
73
  $bg-icon: #8892b3;
57
74
  $bg-disabled: #f1f1f1;
58
75
 
59
- $backgrounds:
60
- ('bg-transparent', $bg-transparent),
61
- ('bg-admin', $bg-admin),
62
- ('bg-outline', $bg-outline),
63
- ('bg-content', $bg-content),
64
- ('bg-primary', $bg-primary),
65
- ('bg-primary-ex', $bg-primary-ex),
66
- ('bg-primary-ex2', $bg-primary-ex2),
67
- ('bg-secondary', $bg-secondary),
68
- ('bg-secondary-ex', $bg-secondary-ex),
69
- ('bg-secondary-ex2', $bg-secondary-ex2),
70
- ('bg-success', $bg-success),
71
- ('bg-success-ex', $bg-success-ex),
72
- ('bg-success-ex2', $bg-success-ex2),
73
- ('bg-danger', $bg-danger),
74
- ('bg-danger-ex', $bg-danger-ex),
75
- ('bg-danger-ex2', $bg-danger-ex2),
76
- ('bg-warn', $bg-warn),
77
- ('bg-warning', $bg-warn),
78
- ('bg-warn-ex', $bg-warn-ex),
79
- ('bg-warn-ex2', $bg-warn-ex2),
80
- ('bg-info', $bg-info),
81
- ('bg-info-ex', $bg-info-ex),
82
- ('bg-info-ex2', $bg-info-ex2),
83
- ('bg-white', $bg-white),
84
- ('bg-type1', $bg-type1),
85
- ('bg-type1-ex', $bg-type1-ex),
86
- ('bg-type1-ex2', $bg-type1-ex2),
87
- ('bg-type2', $bg-type2),
88
- ('bg-type2-ex', $bg-type2-ex),
89
- ('bg-type2-ex2', $bg-type2-ex2),
90
- ('bg-light', $bg-light),
91
- ('bg-light-ex', $bg-light-ex),
92
- ('bg-light-ex2', $bg-light-ex2),
93
- ('bg-dark', $bg-dark),
94
- ('bg-dark-ex', $bg-dark-ex),
95
- ('bg-dark-ex2', $bg-dark-ex2),
96
- ('bg-icon', $bg-icon),
97
- ('bg-disabled', $bg-disabled);
98
-
99
- // borders
100
76
  $border-primary: $bg-primary;
101
77
  $border-secondary: #6c757d;
102
78
  $border-success: $bg-success;
@@ -107,22 +83,6 @@ $border-light: $bg-light;
107
83
  $border-dark: $bg-dark;
108
84
  $border-white: $bg-white;
109
85
 
110
- $borders:
111
- ('border-primary', $border-primary),
112
- ('border-secondary', $border-secondary),
113
- ('border-success', $border-success),
114
- ('border-danger', $border-danger),
115
- ('border-warning', $border-warning),
116
- ('border-info', $border-info),
117
- ('border-light', $border-light),
118
- ('border-dark', $border-dark),
119
- ('border-white', $border-white);
120
-
121
- $color-anchor: #5469d4;
122
- $color-anchor-ex: #1a1f36;
123
-
124
- $color-primary: #5469d4;
125
-
126
86
  $color-secondary: #6772e5;
127
87
  $color-secondary-ex: #7795f8;
128
88
  $color-secondary-ex2: #bbb;
@@ -143,60 +103,6 @@ $color-link-ex2: #bbb;
143
103
 
144
104
  $color-avatar: #000;
145
105
 
146
- $txt-color-primary: #6772e5;
147
- $txt-color-secondary: #969696;
148
- $txt-color-success: #25b47e;
149
- $txt-color-warn: #f1946a;
150
- $txt-color-danger: #cd3d64;
151
-
152
- $color-txt-type0: #5c5f72;
153
- $color-txt-type1: #63a396;
154
- $color-txt-type2: #6772e5;
155
- $color-txt-type3: #4191d9;
156
- $color-txt-type4: #6382a3;
157
-
158
- $color-txt-types:
159
- $color-txt-type0,
160
- $color-txt-type1,
161
- $color-txt-type2,
162
- $color-txt-type3,
163
- $color-txt-type4;
164
-
165
- // tags
166
- $bg-tag-primary: #6782e5;
167
- $bg-tag-secondary: #7d5ae8;
168
- $bg-tag-success: $bg-success;
169
- $bg-tag-danger: $bg-danger;
170
- $bg-tag-warn: $bg-warn;
171
- $bg-tag-info: $bg-info;
172
- $bg-tag-dark: $bg-dark;
173
- $bg-tag-light: #8b8b9e;
174
-
175
- $bg-tag-type0: #19af95;
176
- $bg-tag-type1: #005b4a;
177
- $bg-tag-type2: #865260;
178
- $bg-tag-type3: #993192;
179
- $bg-tag-type4: #e682dc;
180
-
181
- $bg-tags: (
182
- (tag-primary, $bg-tag-primary),
183
- (tag-secondary, $bg-tag-secondary),
184
- (tag-success, $bg-tag-success),
185
- (tag-danger, $bg-tag-danger),
186
- (tag-warn, $bg-tag-warn),
187
- (tag-info, $bg-tag-info),
188
- (tag-dark, $bg-tag-dark),
189
- (tag-light, $bg-tag-light),
190
- (tag-type0, $bg-tag-type0),
191
- (tag-type1, $bg-tag-type1),
192
- (tag-type2, $bg-tag-type2),
193
- (tag-type3, $bg-tag-type3),
194
- (tag-type4, $bg-tag-type4)
195
- );
196
-
197
- $color-tag-danger-ex: #fff;
198
- $bg-tag-danger-ex: #e03953;
199
-
200
106
  $screen-sm: 576px;
201
107
  $screen-md: 768px;
202
108
  $screen-lg: 992px;
@@ -233,89 +139,296 @@ $sides: (
233
139
  $side-y
234
140
  );
235
141
 
236
- // alerts
237
- $alert-bg-primary: #d7daea;
238
- $alert-color-primary: #3c4257;
239
- $alert-color-link-primary: #020204;
240
- $alert-color-hr-primary: #020204;
241
-
242
- $alert-bg-secondary: #e3e8ee;
243
- $alert-color-secondary: #3c4257;
244
- $alert-color-link-secondary: #121623;
245
- $alert-color-hr-secondary: #121623;
246
-
247
- $alert-bg-danger: #f7e9e9;
248
- $alert-color-danger: #3c4257;
249
- $alert-color-link-danger: #310101;
250
- $alert-color-hr-danger: #310101;
251
-
252
- $alert-bg-warn: #f9f1ea;
253
- $alert-color-warn: #3c4257;
254
- $alert-color-link-warn: #3a1401;
255
- $alert-color-hr-warn: #3a1401;
256
-
257
- $alert-states: 'primary', 'secondary', 'warn', 'danger';
258
-
259
- $alert-bgs:
260
- $alert-bg-primary,
261
- $alert-bg-secondary,
262
- $alert-bg-warn,
263
- $alert-bg-danger;
264
-
265
- $alert-colors:
266
- $alert-color-primary,
267
- $alert-color-secondary,
268
- $alert-color-warn,
269
- $alert-color-danger;
270
-
271
- $alert-color-links:
272
- $alert-color-link-primary,
273
- $alert-color-link-secondary,
274
- $alert-color-link-warn,
275
- $alert-color-link-danger;
276
-
277
- $alert-color-hrs:
278
- $alert-color-hr-primary,
279
- $alert-color-hr-secondary,
280
- $alert-color-hr-warn,
281
- $alert-color-hr-danger;
142
+ $alert-primary: (
143
+ state: 'primary',
144
+ bg: #d7daea,
145
+ border: #d7daea,
146
+ txt: #3c4257,
147
+ link-txt: #020204,
148
+ hr-txt: #020204
149
+ );
282
150
 
283
- $sizes: 25, 50, 75, 100;
151
+ $alert-secondary: (
152
+ state: 'secondary',
153
+ bg: #e3e8ee,
154
+ border: #e3e8ee,
155
+ txt: #3c4257,
156
+ link-txt: #121623,
157
+ hr-txt: #121623
158
+ );
284
159
 
285
- // badges
286
- // classname, bg, color
287
- $badges:
288
- ('badge-primary', #6772e5, #fff),
289
- ('badge-secondary', #fff, #6772e5),
290
- ('badge-success', #25b47e, #fff),
291
- ('badge-danger', #cd3d64, #fff),
292
- ('badge-warn', #f1946a, #fff),
293
- ('badge-info', #5ecdf1, #fff),
294
- ('badge-light', #f8f9fa, #666),
295
- ('badge-dark', #000, #fff),
296
- ('badge-type1', #d681d8, #fff),
297
- ('badge-type2', #fdd85f, #516487);
160
+ $alert-warn: (
161
+ state: 'warn',
162
+ bg: #f9f1ea,
163
+ border: #f9f1ea,
164
+ txt: #3c4257,
165
+ link-txt: #3a1401,
166
+ hr-txt: #3a1401
167
+ );
168
+
169
+ $alert-danger: (
170
+ state: 'danger',
171
+ bg: #f7e9e9,
172
+ border: #f7e9e9,
173
+ txt: #3c4257,
174
+ link-txt: #310101,
175
+ hr-txt: #310101
176
+ );
177
+
178
+ $sizes: 25, 50, 75, 100;
298
179
 
299
180
  // border utils
300
181
  $border-color: #dee2e6;
301
182
 
302
183
  // buttons
303
- // classname, border, bg, color, bg-ex, bg-disabled, badge-bg, badge-color
304
- $btn-primary: 'btn-primary', #6772e5, #fff, #7795f8, #b2b7df, #6c8eef, #fff;
305
- $btn-secondary: 'btn-secondary', #fff, #6772e5, #fff, #ebebeb, lighten(#ccc, 12%), #6772e5;
306
- $btn-danger: 'btn-danger', #cd3d64, #fff, #ef6a8e, #b59ba7, lighten(#cd3d64, 10%), #fff;
307
- $btn-warn: 'btn-warn', #f1946a, #fff, #ffaf8c, #e5cec3, lighten(#f1946a, 7%), #fff;
184
+ $default-btn-bg: #fff;
185
+ $badge-bg: #eaeaea;
186
+ $btn-badge-bg: darken($default-btn-bg, 7%);
187
+ $btn-badge-shadow: 0 0 4px 0 rgba(255, 255, 255, .1);
188
+
189
+ $btn-primary: (
190
+ classname: 'btn-primary',
191
+ bg: #6772e5,
192
+ txt: #fff,
193
+ bg-ex: #7795f8,
194
+ bg-disabled: #b2b7df,
195
+ badge-bg: #6c8eef,
196
+ badge-txt: #fff
197
+ );
308
198
 
309
- $btns:
310
- $btn-primary,
311
- $btn-secondary,
312
- $btn-danger,
313
- $btn-warn;
199
+ $btn-secondary: (
200
+ classname: 'btn-secondary',
201
+ bg: #fff,
202
+ txt: #6772e5,
203
+ bg-ex: #fff,
204
+ bg-disabled: #ebebeb,
205
+ badge-bg: lighten(#ccc, 12%),
206
+ badge-txt: #6772e5
207
+ );
314
208
 
315
- // classname, bg, color, color-ex, color-disabled
316
- $btn-link: 'btn-link', #fff, #5469d4, #32325d, #bbb;
209
+ $btn-warn: (
210
+ classname: 'btn-warn',
211
+ bg: #f1946a,
212
+ txt: #fff,
213
+ bg-ex: #ffaf8c,
214
+ bg-disabled: #e5cec3,
215
+ badge-bg: lighten(#f1946a, 7%),
216
+ badge-txt: #fff
217
+ );
218
+
219
+ $btn-danger: (
220
+ classname: 'btn-danger',
221
+ bg: #cd3d64,
222
+ txt: #fff,
223
+ bg-ex: #ef6a8e,
224
+ bg-disabled: #b59ba7,
225
+ badge-bg: lighten(#cd3d64, 10%),
226
+ badge-txt: #fff
227
+ );
228
+
229
+ $btn-link-border: #5469d4;
230
+ $btn-border: #e6e6e6;
231
+
232
+ // color, color-ex, color-disabled
233
+ $btn-link: #5469d4, darken(#5469d4, 20%), #bbb;
234
+
235
+ $ripple-bg: #e6e9ea;
317
236
 
318
237
  // ring-loader
319
238
  $ring-loader-size-lg: 16px;
320
239
  $ring-loader-size-md: 14px;
321
240
  $ring-loader-size-sm: 12px;
241
+
242
+ // nav
243
+ $nav-color: $txt;
244
+ $nav-color-ex: $txt-strong;
245
+ $nav-color-active: $txt-primary;
246
+
247
+ // navbar
248
+ $navbar-bg: rgb(227, 232, 238);
249
+ $nav-txt-primary: rgb(60, 66, 87);
250
+ $nav-txt-primary-ex: #101425;
251
+ $nav-txt: rgb(105, 115, 150);
252
+ $nav-txt-ex: #adb5d0;
253
+ $nav-txt-disabled: #adb5d0;
254
+
255
+ // select
256
+ $select-color: #3c4257;
257
+ $select-bg: #fff;
258
+
259
+ // table
260
+ $table-bg: #fff;
261
+ $table-bg-ex: #f7fafc;
262
+ $table-border: inset 0 -1px #e3e8ee;
263
+ $table-th-color: #697386;
264
+ $table-td-color: #3c4257;
265
+ $table-td-disabled-bg: #ddd;
266
+ $table-td-disabled-color: #333;
267
+ $table-td-disabled-shadow: inset 0 -1px #c7c7c7;
268
+
269
+ // form
270
+ $control-bg: #fff;
271
+ $control-color: #495057;
272
+ $control-disabled-bg: #e9ecef;
273
+ $control-disabled-color: #111;
274
+
275
+ $form-check-disabled-color: #6c757d;
276
+
277
+ // tags
278
+ $bg-tag-primary: #4b64bf;
279
+ $bg-tag-secondary: #6a4cc5;
280
+ $bg-tag-success: #197653;
281
+ $bg-tag-danger: #b13355;
282
+ $bg-tag-warn: #a15735;
283
+ $bg-tag-info: #20728d;
284
+ $bg-tag-light: #676776;
285
+ $bg-tag-dark: $bg-dark;
286
+
287
+ $bg-tag-type0: #19af95;
288
+ $bg-tag-type1: #005b4a;
289
+ $bg-tag-type2: #865260;
290
+ $bg-tag-type3: #993192;
291
+ $bg-tag-type4: #a74c9e;
292
+
293
+ $tag-danger-color-ex: #fff;
294
+ $tag-danger-bg-ex: #c32e45;
295
+
296
+ // badges
297
+ // classname, bg, color
298
+ $badges:
299
+ ('badge-primary', #6772e5, #fff),
300
+ ('badge-secondary', #fff, #6772e5),
301
+ ('badge-success', #25b47e, #fff),
302
+ ('badge-danger', #cd3d64, #fff),
303
+ ('badge-warn', #f1946a, #fff),
304
+ ('badge-info', #5ecdf1, #fff),
305
+ ('badge-type1', #d681d8, #fff),
306
+ ('badge-type2', #fdd85f, #516487),
307
+ ('badge-dark', #000, #fff),
308
+ ('badge-light', #f8f9fa, #666);
309
+
310
+ // breadcrumb
311
+ $breadcrumb-color: $txt-strong;
312
+ $breadcrumb-color-ex: $txt-primary;
313
+
314
+ // card
315
+ $card-bg: #fff;
316
+ $card-color: #000;
317
+ $card-border: rgba(0, 0, 0, .125);
318
+ $list-group-bg: #fff;
319
+
320
+ $blockquote-footer-color: #6c757d;
321
+
322
+ $nav-link-bg: #fff;
323
+ $nav-link-color: #495057;
324
+
325
+ // for btn or any UIs that use focus-outline mixin
326
+ $focus-outline: 0 0 0 1px rgba(60, 66, 87, .16),
327
+ 0 1px 1px 0 rgba(0, 0, 0, .12),
328
+ 0 0 0 4px rgba(58, 151, 212, .28);
329
+
330
+ // select
331
+ $select-shadow:
332
+ 0 2px 5px 0 rgba(60, 66, 87, .12);
333
+ $select-outline-shadow:
334
+ 0 0 0 1px rgba(60, 66, 87, .16);
335
+ $select-outline-strong-shadow:
336
+ 0 1px 1px 0 rgba(0, 0, 0, 0.12),
337
+ rgba(60, 66, 87, .16) 0 0 0 1px,
338
+ rgba(60, 66, 87, .12) 0 2px 5px 0;
339
+
340
+ // dropdown
341
+ $dropdown-menu-bg: #fff;
342
+ $dropdown-menu-bg-ex: #f7fafc;
343
+ $dropdown-menu-color: #5469d4;
344
+ $dropdown-menu-shadow: 0 0 0 1px rgba(136, 152, 170, .1),
345
+ 0 15px 35px 0 rgba(49, 49, 93, .1),
346
+ 0 5px 15px 0 rgba(0, 0, 0, .08);
347
+ $dropdown-divider-border: #d8d8d8;
348
+ $dropdown-menu-title-bg: #f7fafc;
349
+
350
+ $checkbox-bg: #fff;
351
+ $checkbox-bg-ex: #6772e5;
352
+ $checkbox-disabled-bg: #eee;
353
+
354
+ $radio-disabled-bg: #eee;
355
+
356
+ $switch-bg: #e2e2e2;
357
+ $switch-bg-ex: #cfd1e2;
358
+ $switch-knob-bg: #a3a3a3;
359
+ $switch-knob-bg-ex: #60659d;
360
+
361
+ $date-menu-bg: #fff;
362
+ $date-menu-cell-bg: #f7fafc;
363
+ $date-menu-cell-border: #e3e8ee;
364
+ $date-menu-cell-today-bg: #fffef4;
365
+ $date-menu-cell-selected-bg: #6c8eef;
366
+ $date-menu-cell-selected-border: #6c8eef;
367
+ $date-menu-cell-selected-ex-bg: #5469d4;
368
+ $date-menu-cell-selected-ex-border: #5469d4;
369
+ $date-menu-caption-color: #3c4257;
370
+ $date-menu-week-header-color: #8792a2;
371
+
372
+ $time-menu-bg: #fff;
373
+ $time-menu-bg-hover: #f7fafc;
374
+ $time-menu-bg-active: #eef0f3;
375
+
376
+ // pagination
377
+ $page-color: #1a1f36;
378
+ $page-active-bg: #3c4258;
379
+ $page-active-color: #fff;
380
+ $page-hover-bg: lighten($page-active-bg, 7%);
381
+ $page-hover-color: #fff;
382
+
383
+ $search-dropdown-input-bg: $control-bg;
384
+
385
+ // modal
386
+ $modal-bg: #fff;
387
+ $modal-header-color: #1a1f36;
388
+ $modal-color: $txt;
389
+ $modal-shadow: 0 7px 14px 0 rgba(60, 66, 87, .12),
390
+ 0 3px 6px 0 rgba(0, 0, 0, .12);
391
+
392
+ $hr-border: rgba(0, 0, 0, .1);
393
+
394
+ // tabbox
395
+ $tab-btn-bg: #fff;
396
+ $tab-btn-border: #e3e8ee;
397
+ $tab-active-color: #1d2638;
398
+ $tab-active-border: #3c4356;
399
+ $tab-hover-color: #1d2638;
400
+ $tab-focus-color: #1d2638;
401
+
402
+ $tab-btn-borders: (
403
+ (tab-btn-type0, rgba(109, 188, 128, .3)),
404
+ (tab-btn-type1, rgba(1, 137, 114, .2)),
405
+ (tab-btn-type2, rgba(0, 91, 74, .2)),
406
+ (tab-btn-type3, rgba(93, 105, 227, .3)),
407
+ (tab-btn-type4, rgba(205, 205, 205, 1)),
408
+ );
409
+ $tab-slider-default-bg: #858585;
410
+
411
+ // tabbox uno
412
+ $tab-uno-active-color: #6772e5;
413
+
414
+ $tooltip-bg: #fff;
415
+ $tooltip-border: #e8e8e8;
416
+ $tooltip-shadow: 0 1px 2px 0 #ccc;
417
+
418
+ $autocomplete-item-bg: #fff;
419
+ $autocomplete-item-bg-ex: #f7fafc;
420
+
421
+ $page-prefix-txt: #6772e5;
422
+ $page-title-txt: #697396;
423
+
424
+ $chart-menu-bg: #fff;
425
+ $chart-menu-txt: #3c4257;
426
+ $chart-menu-border: 1px solid #e8e8e8;
427
+ $chart-menu-shadow: 4px 4px 15px 1px rgba(68, 68, 72, .12);
428
+
429
+ $sidebar-bg: #fff;
430
+
431
+ $toast-bg: #3c4257;
432
+ $toast-shadow: 0 0 0 1px rgba(136, 152, 170, .1);
433
+ $toast-txt: #fff;
434
+ $toast-btn-txt: #7dabf8;
@@ -1,10 +1,9 @@
1
- @each $classname, $bg in $backgrounds {
1
+ @each $classname, $bg in $bgs {
2
2
  .#{$classname} {
3
3
  background-color: $bg !important;
4
4
  }
5
5
  }
6
6
 
7
7
  .bg-content {
8
- box-shadow: 0 -1px 3px 0 rgba(227, 232, 238, 1),
9
- 0 1px 3px 0 rgba(227, 232, 238, 1);
8
+ box-shadow: $bg-content-shadow;
10
9
  }
@@ -33,19 +33,19 @@ h6 {
33
33
  }
34
34
 
35
35
  .txt-primary {
36
- color: $txt-color-primary !important;
36
+ color: $txt-primary !important;
37
37
  }
38
38
  .txt-secondary {
39
- color: $txt-color-secondary !important;
39
+ color: $txt-secondary !important;
40
40
  }
41
41
  .txt-success {
42
- color: $txt-color-success !important;
42
+ color: $txt-success !important;
43
43
  }
44
44
  .txt-warn {
45
- color: $txt-color-warn !important;
45
+ color: $txt-warn !important;
46
46
  }
47
47
  .txt-danger {
48
- color: $txt-color-danger !important;
48
+ color: $txt-danger !important;
49
49
  }
50
50
 
51
51
  .txt-white {
@@ -53,7 +53,7 @@ h6 {
53
53
  }
54
54
 
55
55
  code {
56
- color: $txt-color-primary;
56
+ color: $txt-primary;
57
57
  }
58
58
 
59
59
  .txt-lg {
@@ -112,10 +112,10 @@ a.txt-type0,
112
112
  a.txt-type0:hover {
113
113
  font-family: 'Roboto', sans-serif;
114
114
  font-weight: 900;
115
- color: $color-txt-type0;
115
+ color: $txt-type0;
116
116
  }
117
117
  body a.txt-type0:hover {
118
- border-bottom: 1px solid $color-txt-type0;
118
+ border-bottom: 1px solid $txt-type0;
119
119
  }
120
120
 
121
121
  .txt-type1,
@@ -123,10 +123,10 @@ a.txt-type1,
123
123
  a.txt-type1:hover {
124
124
  font-family: 'Roboto', sans-serif;
125
125
  font-weight: 900;
126
- color: $color-txt-type1;
126
+ color: $txt-type1;
127
127
  }
128
128
  body a.txt-type1:hover {
129
- border-bottom: 1px solid $color-txt-type1;
129
+ border-bottom: 1px solid $txt-type1;
130
130
  }
131
131
 
132
132
  .txt-type2,
@@ -134,34 +134,34 @@ a.txt-type2,
134
134
  a.txt-type2:hover {
135
135
  font-family: 'Roboto', sans-serif;
136
136
  font-weight: 900;
137
- color: $color-txt-type2;
137
+ color: $txt-type2;
138
138
  }
139
139
  body a.txt-type2:hover {
140
- border-bottom: 1px solid $color-txt-type2;
140
+ border-bottom: 1px solid $txt-type2;
141
141
  }
142
142
 
143
143
  .txt-type3,
144
144
  a.txt-type3,
145
145
  a.txt-type3:hover {
146
146
  font-family: 'Roboto', sans-serif;
147
- color: $color-txt-type3;
147
+ color: $txt-type3;
148
148
  }
149
149
  body a.txt-type3:hover {
150
- border-bottom: 1px solid $color-txt-type3;
150
+ border-bottom: 1px solid $txt-type3;
151
151
  }
152
152
 
153
153
  .txt-type4,
154
154
  a.txt-type4,
155
155
  a.txt-type4:hover {
156
156
  font-family: 'PingFang TC';
157
- color: $color-txt-type4;
157
+ color: $txt-type4;
158
158
  }
159
159
  body a.txt-type4:hover {
160
- border-bottom: 1px solid $color-txt-type4;
160
+ border-bottom: 1px solid $txt-type4;
161
161
  }
162
162
 
163
163
  .txt-muted {
164
- color: #495763;
164
+ color: $txt-muted;
165
165
  font-weight: 500;
166
166
  }
167
167
 
@@ -14,28 +14,22 @@
14
14
  font-weight: 900;
15
15
  margin-bottom: 0.5rem;
16
16
  }
17
-
18
17
  p {
19
18
  line-height: 1.5em;
20
19
  }
21
-
22
- @for $i from 1 through length($alert-states) {
23
- $state: nth($alert-states, $i);
24
- $bg: nth($alert-bgs, $i);
25
- $color: nth($alert-colors, $i);
26
- $color-link: nth($alert-color-links, $i);
27
- $color-hr: nth($alert-color-hrs, $i);
28
- &.alert-#{$state} {
29
- background-color: $bg;
30
- color: $color;
20
+ @each $alert in $alerts {
21
+ &.alert-#{map-get($alert, state)} {
22
+ border: 1px solid map-get($alert, border);
23
+ background: map-get($alert, bg);
24
+ color: map-get($alert, txt);
31
25
  .alert-link {
32
- color: $color-link;
26
+ color: map-get($alert, link-txt);
33
27
  &:hover {
34
- border-bottom: 1px solid $color-link;
28
+ border-bottom: 1px solid map-get($alert, link-txt);
35
29
  }
36
30
  }
37
31
  hr {
38
- border-top-color: $color-hr;
32
+ border-top-color: map-get($alert, hr-txt);
39
33
  }
40
34
  }
41
35
  }