@cloud-app-dev/vidc 3.0.45 → 3.1.1

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 (16) hide show
  1. package/.umirc.ts +2 -104
  2. package/es/ThemeAntd/demo.css +16 -0
  3. package/es/ThemeAntd/demo.d.ts +3 -0
  4. package/es/ThemeAntd/demo.js +102 -0
  5. package/es/ThemeAntd/index.css +162 -118
  6. package/es/ThemeAntd/style/button.css +1 -1
  7. package/es/ThemeAntd/style/checkbox.css +19 -19
  8. package/es/ThemeAntd/style/input.css +26 -20
  9. package/es/ThemeAntd/style/pagination.css +43 -17
  10. package/es/ThemeAntd/style/picker.css +16 -14
  11. package/es/ThemeAntd/style/popover.css +1 -1
  12. package/es/ThemeAntd/style/radio.css +31 -22
  13. package/es/ThemeAntd/style/select.css +20 -19
  14. package/es/ThemeAntd/style/table.css +1 -1
  15. package/package.json +1 -1
  16. package/theme-config.ts +118 -0
package/es/ThemeAntd/style/input.css CHANGED
@@ -1,56 +1,62 @@
1
1
  div .cloudapp-input {
2
2
  color: inherit;
3
- border-radius: var(--redius1);
4
- border-color: var(--gray3);
5
- background-color: var(--gray1);
3
+ border-radius: var(--radius1);
4
+ border-color: var(--form-bd);
5
+ background-color: var(--form-bg);
6
+ }
7
+ div .cloudapp-input-affix-wrapper:not(.cloudapp-input-affix-wrapper-disabled):hover {
8
+ border-color: var(--form-active-bg);
6
9
  }
7
10
  div .cloudapp-input:hover {
8
- border-color: var(--primary);
11
+ border-color: var(--form-active-bg);
9
12
  }
10
13
  div .cloudapp-input:focus,
11
14
  div .cloudapp-input-focused {
12
- border-color: var(--primary);
15
+ border-color: var(--form-active-bg);
16
+ box-shadow: unset;
13
17
  }
14
18
  div .cloudapp-input-affix-wrapper {
15
- background-color: var(--gray1);
19
+ background-color: var(--form-bg);
16
20
  color: inherit;
17
- border-radius: var(--redius1);
18
- border-color: var(--gray3);
21
+ border-radius: var(--radius1);
22
+ border-color: var(--form-bd);
19
23
  }
20
24
  div .cloudapp-input-affix-wrapper:hover {
21
- border-color: var(--primary);
25
+ border-color: var(--form-active-bg);
22
26
  }
23
27
  div .cloudapp-input-affix-wrapper:focus,
24
28
  div .cloudapp-input-affix-wrapper-focused {
25
- border-color: var(--primary);
29
+ border-color: var(--form-active-bg);
30
+ box-shadow: unset;
26
31
  }
27
32
  div .cloudapp-input[disabled] {
28
- background-color: var(--gray1);
33
+ background-color: var(--form-bd);
29
34
  color: inherit;
30
- border-color: var(--gray3);
35
+ border-color: var(--form-bd);
31
36
  opacity: 0.7;
32
37
  }
33
38
  div .cloudapp-input-number {
34
39
  color: inherit;
35
- border-radius: var(--redius1);
36
- border-color: var(--gray3);
37
- background-color: var(--gray1);
40
+ border-radius: var(--radius1);
41
+ border-color: var(--form-bd);
42
+ background-color: var(--form-bg);
38
43
  }
39
44
  div .cloudapp-input-number:hover {
40
- border-color: var(--primary);
45
+ border-color: var(--form-active-bg);
41
46
  }
42
47
  div .cloudapp-input-number:focus,
43
48
  div .cloudapp-input-number-focused {
44
- border-color: var(--primary);
49
+ border-color: var(--form-active-bg);
50
+ box-shadow: unset;
45
51
  }
46
52
  div .cloudapp-input-number-handler-wrap {
47
- border-radius: 0 var(--form-redius) var(--form-redius) 0;
48
- background-color: var(--gray1);
53
+ border-radius: 0 var(--radius1) var(---redius1) 0;
54
+ background-color: var(--form-bg);
49
55
  color: inherit;
50
56
  }
51
57
  div .cloudapp-input-number-handler {
52
58
  color: inherit;
53
- border-top-color: var(--gray3);
59
+ border-top-color: var(--form-bd);
54
60
  }
55
61
  div .cloudapp-input-number-handler-up-inner,
56
62
  div .cloudapp-input-number-handler-down-inner {
package/es/ThemeAntd/style/pagination.css CHANGED
@@ -5,40 +5,66 @@ div .cloudapp-pagination-prev,
5
5
  div .cloudapp-pagination-next,
6
6
  div .cloudapp-pagination-jump-prev,
7
7
  div .cloudapp-pagination-jump-next {
8
- border-radius: var(--redius1);
8
+ border-radius: var(--radius1);
9
9
  line-height: 28px;
10
10
  }
11
11
  div .cloudapp-pagination-prev .cloudapp-pagination-item-link,
12
12
  div .cloudapp-pagination-next .cloudapp-pagination-item-link {
13
- border-radius: var(--redius1);
13
+ border-radius: var(--radius1);
14
+ background-color: var(--form-bg);
15
+ border-color: var(--form-bd);
16
+ }
17
+ div .cloudapp-pagination-jump-prev .cloudapp-pagination-item-container .cloudapp-pagination-item-link-icon,
18
+ div .cloudapp-pagination-jump-next .cloudapp-pagination-item-container .cloudapp-pagination-item-link-icon {
19
+ color: var(--form-active-bg);
14
20
  }
15
21
  div .cloudapp-pagination-item {
16
- border-radius: var(--redius1);
22
+ border-radius: var(--radius1);
23
+ background-color: var(--form-bg);
24
+ border-color: var(--form-bd);
17
25
  }
18
- div .cloudapp-pagination-item-active {
19
- border-color: var(--primary);
26
+ div .cloudapp-pagination-item a {
27
+ color: inherit;
20
28
  }
21
- div .cloudapp-pagination-item-active a {
22
- color: var(--primary);
29
+ div .cloudapp-pagination-item-active {
30
+ border-color: var(--form-active-bg);
23
31
  }
24
32
  div .cloudapp-pagination-item:focus,
25
33
  div .cloudapp-pagination-item:hover {
26
- border-color: var(--primary);
34
+ border-color: var(--form-active-bg);
27
35
  }
28
36
  div .cloudapp-pagination-item:focus a,
29
37
  div .cloudapp-pagination-item:hover a {
30
- color: var(--primary);
38
+ color: #fff;
31
39
  }
32
- div .cloudapp-pagination-prev:focus .cloudapp-pagination-item-link,
33
- div .cloudapp-pagination-next:focus .cloudapp-pagination-item-link,
34
- div .cloudapp-pagination-prev:hover .cloudapp-pagination-item-link,
35
- div .cloudapp-pagination-next:hover .cloudapp-pagination-item-link {
36
- color: var(--primary);
37
- border-color: var(--primary);
40
+ div .cloudapp-pagination-prev:focus:not(.cloudapp-pagination-disabled) .cloudapp-pagination-item-link,
41
+ div .cloudapp-pagination-next:focus:not(.cloudapp-pagination-disabled) .cloudapp-pagination-item-link,
42
+ div .cloudapp-pagination-prev:hover:not(.cloudapp-pagination-disabled) .cloudapp-pagination-item-link,
43
+ div .cloudapp-pagination-next:hover:not(.cloudapp-pagination-disabled) .cloudapp-pagination-item-link {
44
+ background-color: var(--form-active-bg);
45
+ border-color: var(--form-active-bg);
46
+ color: #fff;
38
47
  }
39
48
  div .cloudapp-pagination-disabled .cloudapp-pagination-item-link,
40
49
  div .cloudapp-pagination-disabled:hover .cloudapp-pagination-item-link,
41
50
  div .cloudapp-pagination-disabled:focus .cloudapp-pagination-item-link {
42
- border-color: var(--gray8);
43
- color: var(--gray8);
51
+ border-color: var(--form-bd);
52
+ }
53
+ div .cloudapp-pagination-prev button,
54
+ div .cloudapp-pagination-next button {
55
+ color: inherit;
56
+ }
57
+ div .cloudapp-pagination-prev,
58
+ div .cloudapp-pagination-next,
59
+ div .cloudapp-pagination-jump-prev,
60
+ div .cloudapp-pagination-jump-next {
61
+ color: inherit;
62
+ }
63
+ div .cloudapp-pagination-disabled .cloudapp-pagination-item-link,
64
+ div .cloudapp-pagination-disabled:hover .cloudapp-pagination-item-link {
65
+ color: inherit;
66
+ }
67
+ div .cloudapp-pagination-jump-prev .cloudapp-pagination-item-container .cloudapp-pagination-item-ellipsis,
68
+ div .cloudapp-pagination-jump-next .cloudapp-pagination-item-container .cloudapp-pagination-item-ellipsis {
69
+ color: inherit;
44
70
  }
package/es/ThemeAntd/style/picker.css CHANGED
@@ -1,31 +1,32 @@
1
1
  div .cloudapp-picker {
2
- background-color: var(--gray1);
2
+ background-color: var(--form-bg);
3
3
  border-radius: var(--radius1);
4
4
  color: inherit;
5
5
  }
6
6
  div .cloudapp-picker:hover,
7
7
  div .cloudapp-picker-focused {
8
- border-color: var(--primary);
8
+ border-color: var(--form-active-bg);
9
9
  }
10
10
  div .cloudapp-picker-suffix {
11
11
  color: inherit;
12
12
  }
13
13
  div .cloudapp-picker-panel {
14
- background-color: var(--gray1);
15
- border-color: var(--gray3);
14
+ background-color: var(--form-bg);
15
+ border-color: var(--form-bd);
16
16
  }
17
17
  div .cloudapp-picker-panel .cloudapp-picker-footer {
18
- border-color: var(--gray3);
18
+ border-color: var(--form-bd);
19
19
  }
20
20
  div .cloudapp-picker-header {
21
- border-bottom-color: var(--gray3);
21
+ border-bottom-color: var(--form-bd);
22
22
  color: inherit;
23
23
  }
24
24
  div .cloudapp-picker-header button {
25
25
  color: inherit;
26
26
  }
27
27
  div .cloudapp-picker-panel-container {
28
- background-color: var(--gray1);
28
+ background-color: var(--form-bg);
29
+ border-radius: var(--radius1);
29
30
  }
30
31
  div .cloudapp-picker-dropdown {
31
32
  color: inherit;
@@ -43,36 +44,37 @@ div .cloudapp-picker-content th {
43
44
  color: inherit;
44
45
  }
45
46
  div .cloudapp-picker-today-btn {
46
- color: var(--primary);
47
+ color: var(--form-active-bg);
47
48
  }
48
49
  div .cloudapp-picker-cell .cloudapp-picker-cell-inner {
49
50
  border-radius: var(--radius1);
50
51
  }
51
52
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-today .cloudapp-picker-cell-inner::before {
52
53
  border-radius: var(--radius1);
54
+ border-color: var(--form-active-bg);
53
55
  }
54
56
  div .cloudapp-picker-cell:hover:not(.cloudapp-picker-cell-in-view) .cloudapp-picker-cell-inner,
55
57
  div .cloudapp-picker-cell:hover:not(.cloudapp-picker-cell-selected):not(.cloudapp-picker-cell-range-start):not(.cloudapp-picker-cell-range-end):not(.cloudapp-picker-cell-range-hover-start):not(.cloudapp-picker-cell-range-hover-end) .cloudapp-picker-cell-inner {
56
- background-color: var(--form-bg-dark);
58
+ background-color: var(--form-bg);
57
59
  }
58
60
  div .cloudapp-picker-input > input {
59
61
  color: inherit;
60
62
  }
61
63
  div .cloudapp-picker-range-arrow::after {
62
- border-color: var(--gray1);
64
+ border-color: var(--form-bd);
63
65
  }
64
66
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-selected .cloudapp-picker-cell-inner,
65
67
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-range-start .cloudapp-picker-cell-inner,
66
68
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-range-end .cloudapp-picker-cell-inner {
67
- background-color: var(--primary);
69
+ background-color: var(--form-active-bg);
68
70
  }
69
71
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-range-start:not(.cloudapp-picker-cell-range-start-single)::before,
70
72
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-range-end:not(.cloudapp-picker-cell-range-end-single)::before {
71
- background-color: var(--primary);
73
+ background-color: var(--form-active-bg);
72
74
  opacity: 0.8;
73
75
  }
74
76
  div .cloudapp-picker-cell-in-view.cloudapp-picker-cell-in-range::before {
75
- background-color: var(--primary);
77
+ background-color: var(--form-active-bg);
76
78
  opacity: 0.8;
77
79
  }
78
80
  div .cloudapp-picker-focused .cloudapp-picker-separator {
@@ -82,5 +84,5 @@ div .cloudapp-picker-separator {
82
84
  color: inherit;
83
85
  }
84
86
  div .cloudapp-picker-range .cloudapp-picker-active-bar {
85
- background-color: var(--primary);
87
+ background-color: var(--form-active-bg);
86
88
  }
package/es/ThemeAntd/style/popover.css CHANGED
@@ -1,3 +1,3 @@
1
1
  div .cloudapp-popover-inner {
2
- border-radius: var(--redius1);
2
+ border-radius: var(--radius1);
3
3
  }
package/es/ThemeAntd/style/radio.css CHANGED
@@ -1,39 +1,45 @@
1
+ div .cloudapp-radio {
2
+ color: inherit;
3
+ }
4
+ div .cloudapp-radio-group {
5
+ color: inherit;
6
+ }
1
7
  div .cloudapp-radio-button-wrapper {
2
8
  outline: unset;
3
9
  }
4
10
  div .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled):hover {
5
- border-color: var(--primary);
6
- color: var(--primary);
11
+ border-color: var(--form-active-bg);
12
+ color: var(--form-active-bg);
7
13
  }
8
14
  div .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled) {
9
- border-color: var(--primary);
10
- color: var(--primary);
11
- box-shadow: -1px 0 0 0 var(--primary);
15
+ border-color: var(--form-active-bg);
16
+ color: var(--form-active-bg);
17
+ box-shadow: -1px 0 0 0 var(--form-active-bg);
12
18
  }
13
19
  div .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled):first-child {
14
- border-color: var(--primary);
20
+ border-color: var(--form-active-bg);
15
21
  }
16
22
  div .cloudapp-radio-disabled .cloudapp-radio-inner::after {
17
- background-color: var(--gray3);
23
+ background-color: var(--form-bg);
18
24
  }
19
25
  div .cloudapp-radio-disabled .cloudapp-radio-inner {
20
- background-color: var(--gray1);
26
+ background-color: var(--form-bg);
21
27
  opacity: 0.8;
22
28
  }
23
29
  div .cloudapp-radio-button-wrapper:hover {
24
- color: var(--primary);
30
+ color: var(--form-active-bg);
25
31
  }
26
32
  div .cloudapp-radio-checked .cloudapp-radio-inner {
27
- border-color: var(--primary);
33
+ border-color: var(--form-active-bg);
28
34
  }
29
35
  div .cloudapp-radio-inner {
30
- background-color: var(--gray1);
36
+ background-color: var(--form-bg);
31
37
  }
32
38
  div .cloudapp-radio-inner::after {
33
- background-color: var(--primary);
39
+ background-color: var(--form-active-bg);
34
40
  }
35
41
  div .cloudapp-radio-checked::after {
36
- border-color: var(--primary);
42
+ border-color: var(--form-active-bg);
37
43
  }
38
44
  div .cloudapp-radio-wrapper {
39
45
  color: inherit;
@@ -45,27 +51,30 @@ div .cloudapp-radio-disabled + span {
45
51
  div .cloudapp-radio-wrapper:hover .cloudapp-radio,
46
52
  div .cloudapp-radio:hover .cloudapp-radio-inner,
47
53
  div .cloudapp-radio-input:focus + .cloudapp-radio-inner {
48
- border-color: var(--primary);
54
+ border-color: var(--form-active-bg);
49
55
  }
50
56
  div .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled)::before {
51
- background-color: var(--primary) !important;
57
+ background-color: var(--form-active-bg) !important;
52
58
  opacity: unset;
53
59
  }
54
60
  div .cloudapp-radio-group-solid .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled) {
55
- background-color: var(--primary);
56
- border-color: var(--primary);
61
+ background-color: var(--form-active-bg);
62
+ border-color: var(--form-active-bg);
57
63
  }
58
64
  div .cloudapp-radio-group-solid .cloudapp-radio-button-wrapper-checked:not(.cloudapp-radio-button-wrapper-disabled):hover {
59
- background-color: var(--primary-dark);
60
- border-color: var(--primary-dark);
61
- box-shadow: -1px 0 0 0 var(--primary);
65
+ background-color: var(--form-active-bg-dark);
66
+ border-color: var(--form-active-bg-dark);
67
+ box-shadow: -1px 0 0 0 var(--form-active-bg);
62
68
  }
63
69
  div .cloudapp-radio-button-wrapper-checked:not([class*=' cloudapp-radio-button-wrapper-disabled']).cloudapp-radio-button-wrapper:first-child {
64
- border-right-color: var(--primary);
70
+ border-right-color: var(--form-active-bg);
65
71
  }
66
72
  div .cloudapp-radio-button-wrapper:last-child {
67
73
  border-radius: 0 var(--form-redius) var(--form-redius) 0;
68
74
  }
69
75
  div .cloudapp-radio-button-wrapper:first-child {
70
- border-radius: var(--form-redius) 0 0 var(--redius1);
76
+ border-radius: var(--form-redius) 0 0 var(--radius1);
77
+ }
78
+ div .cloudapp-radio-input:focus + .cloudapp-radio-inner {
79
+ box-shadow: unset;
71
80
  }
package/es/ThemeAntd/style/select.css CHANGED
@@ -1,32 +1,32 @@
1
1
  div .cloudapp-select-single:not(.cloudapp-select-customize-input) .cloudapp-select-selector {
2
- border-radius: var(--redius1);
3
- border-color: var(--gray3);
4
- background-color: var(--gray1);
2
+ border-radius: var(--radius1);
3
+ border-color: var(--form-bd);
4
+ background-color: var(--form-bg);
5
5
  }
6
6
  div .cloudapp-select-multiple .cloudapp-select-selector {
7
- border-radius: var(--redius1);
8
- border-color: var(--gray3);
9
- background-color: var(--gray1);
7
+ border-radius: var(--radius1);
8
+ border-color: var(--form-bd);
9
+ background-color: var(--form-bg);
10
10
  }
11
11
  div .cloudapp-select-multiple .cloudapp-select-selection-item {
12
- border-radius: var(--redius1);
13
- border-color: var(--gray3);
14
- background-color: var(--gray1);
12
+ border-radius: var(--radius1);
13
+ border-color: var(--form-bd);
14
+ background-color: var(--form-bg);
15
15
  }
16
16
  div .cloudapp-select:not(.cloudapp-select-disabled):hover .cloudapp-select-selector {
17
- border-color: var(--primary);
17
+ border-color: var(--form-active-bg);
18
18
  }
19
19
  div .cloudapp-select-focused.cloudapp-select-single:not(.cloudapp-select-customize-input) .cloudapp-select-selector {
20
- border-color: var(--primary);
20
+ border-color: var(--form-active-bg);
21
21
  }
22
22
  div .cloudapp-select-focused.cloudapp-select-multiple .cloudapp-select-selector {
23
- border-color: var(--primary);
23
+ border-color: var(--form-active-bg);
24
24
  }
25
25
  div .cloudapp-select-multiple .cloudapp-select-selection-item-remove {
26
26
  color: inherit;
27
27
  }
28
28
  div .cloudapp-select-multiple .cloudapp-select-selection-item-remove:hover {
29
- color: var(--primary);
29
+ color: var(--form-active-bg);
30
30
  }
31
31
  div .cloudapp-select {
32
32
  color: inherit;
@@ -36,22 +36,23 @@ div .cloudapp-select-arrow {
36
36
  color: inherit;
37
37
  }
38
38
  div .cloudapp-select-dropdown {
39
- background-color: var(--gray1);
39
+ background-color: var(--form-bg);
40
40
  color: inherit;
41
41
  }
42
42
  div .cloudapp-select-item {
43
43
  color: inherit;
44
44
  }
45
45
  div .cloudapp-select-item-option-active:not(.cloudapp-select-item-option-disabled) {
46
- background-color: var(--form-bg-dark);
46
+ background-color: var(--form-bg);
47
47
  }
48
48
  div .cloudapp-select-item-option-selected:not(.cloudapp-select-item-option-disabled) .cloudapp-select-item-option-state {
49
- color: var(--primary);
49
+ color: var(--form-active-bg);
50
50
  }
51
51
  div .cloudapp-select-item-option-selected:not(.cloudapp-select-item-option-disabled) {
52
- color: var(--primary);
53
- background-color: var(--gray8);
52
+ color: var(--form-active-bg);
53
+ background-color: transparent;
54
54
  }
55
55
  div .cloudapp-select-focused:not(.cloudapp-select-disabled).cloudapp-select-single:not(.cloudapp-select-customize-input) .cloudapp-select-selector {
56
- border-color: var(--primary);
56
+ border-color: var(--form-active-bg);
57
+ box-shadow: unset;
57
58
  }
package/es/ThemeAntd/style/table.css CHANGED
@@ -27,7 +27,7 @@ div tr.cloudapp-table-expanded-row:hover > td {
27
27
  background-color: var(--table-row-hover-color);
28
28
  }
29
29
  div .cloudapp-table-row-expand-icon {
30
- border-radius: var(--redius1);
30
+ border-radius: var(--radius1);
31
31
  color: var(--primary);
32
32
  }
33
33
  div .cloudapp-table-row-expand-icon:focus,
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "private": false,
3
3
  "name": "@cloud-app-dev/vidc",
4
4
  "description": "Video Image Data Componennts",
5
- "version": "3.0.45",
5
+ "version": "3.1.1",
6
6
  "scripts": {
7
7
  "start": "dumi dev",
8
8
  "docs:build": "dumi build",
package/theme-config.ts ADDED
@@ -0,0 +1,118 @@
1
+ export const themeConfig = `
2
+ :root{
3
+ --primary: #248FFA;
4
+ --primary-light: #248FFA;
5
+ --primary-dark: #227BD5;
6
+ --secondary1: #6D8EFB;
7
+ --secondary1-light: #86A2FF;
8
+ --secondary1-dark: #5D7FF0;
9
+ --secondary2: #33AAFF;
10
+ --secondary2-light: #61BDFF;
11
+ --secondary2-dark: #2194E5;
12
+ --secondary3: #F3A75F;
13
+ --secondary3-light: #F8B578;
14
+ --secondary3-dark: #DC914C;
15
+ --danger: #F32D37;
16
+ --danger-light: #FF4D4F;
17
+ --danger-dark: #DC1B2A;
18
+ --warn: #FD8535;
19
+ --warn-light: #FF9F5E;
20
+ --warn-dark: #DC1B2A;
21
+ --success: #35BD77;
22
+ --success-light: #55C98D;
23
+ --success-dark: #21965A;
24
+ --gray1: #FFFFFF;
25
+ --gray2: #F3F3F3;
26
+ --gray3: #EEEEEE;
27
+ --gray4: #E7E7E7;
28
+ --gray5: #DCDCDC;
29
+ --gray6: #C5C5C5;
30
+ --gray7: #A6A6A6;
31
+ --gray8: #8B8B8B;
32
+ --gray9: #777777;
33
+ --gray10: #5E5E5E;
34
+ --gray11: #4B4B4B;
35
+ --gray12: #383838;
36
+ --background: #348fe2;
37
+ --content-bg: #ffffff;
38
+ --form-bg:#fff;
39
+ --form-bd:#eee;
40
+ --form-active-bg:#248FFA;
41
+ --icon:#62708B;
42
+ --fs: 14px;
43
+ --fs-small: 12px;
44
+ --fs-large: 20px;
45
+ --color: rgba(0,0,0,1);
46
+ --color-dark: #000000;
47
+ --color-light: rgba(255,255,255,1);
48
+ --color-disabled: rgba(0,0,0,0.26);
49
+ --shadow1: 2px 0 10px 0 rgba(0,0,0,0.06);
50
+ --shadow2: 2px 0 10px 0 rgba(0,0,0,0.06);
51
+ --shadow3: 2px 0 10px 0 rgba(0,0,0,0.06);
52
+ --radius1: 4px;
53
+ --radius2: 8px;
54
+ --radius3: 16px;
55
+
56
+ --header-color: #FFFFFF;
57
+ --header-bg: #348fe2;
58
+ --header-height: 66px;
59
+
60
+ --nav-height: 66px;
61
+ --nav-bg: #348fe2;
62
+ --nav-sub-bg: rgba(255,255,255,1);
63
+ --nav-sub-bg2: rgba(241,244,247,0.8);
64
+ --nav-item-bg-selected: #FFFFFF;
65
+ --nav-item-color: #FFFFFF;
66
+ --nav-icon-color: rgba(255, 255, 255, 0.4);
67
+ --nav-icon-color-selected: #3495EF;
68
+ --nav-item-bg: #348fe2;
69
+ --nav-item-color-selected: rgba(0, 0, 0, 0.9);
70
+ --nav-sub-item-bg-selected: #F3F5F6;
71
+ --nav-sub-item-color-selected: #348fe2;
72
+ --nav-sub-item-color: rgba(0, 0, 0, 0.9);
73
+ --nav-bd-color: rgba(0,0,0,0);
74
+
75
+ --tab-height: 34px;
76
+ --tab-bg: #348fe2;
77
+ --tab-item-bg: #348fe2;
78
+ --tab-item-height: 34px;
79
+ --tab-item-color: #FFFFFF;
80
+ --tab-item-selected-bg: #F3F5F6;
81
+ --tab-item-selected-color: rgba(0, 0, 0, 0.9);
82
+
83
+ --drawer-title-height: 48px;
84
+ --drawer-title-bg: rgba(255,255,255,1);
85
+ --drawer-divider-color: rgba(219,225,234,1);
86
+ --drawer-footer-height: 44px;
87
+ --drawer-footer-bg: rgba(255,255,255,1);
88
+ --drawer-content-bg: rgba(243,246,249,1);
89
+
90
+ --modal-title-height: 44px;
91
+ --modal-title-bg: #ffffff;
92
+ --modal-divider-color: rgba(219,225,234,1);
93
+ --modal-footer-height: 44px;
94
+ --modal-footer-bg: rgba(243,246,249,1);
95
+ --modal-content-bg: rgba(243,246,249,1);
96
+
97
+ --card-image-radius: 4px;
98
+ --card-image-bg: rgba(219,225,234,1);
99
+ --card-radius: 4px;
100
+ --card-content-bg: rgba(255,255,255,1);
101
+ --card-shadow: 0 0 4px 0 rgba(0,0,0,0.2);
102
+ --card-bd-color: rgba(219,225,234,1);
103
+ --card-hover-bd-color: rgba(18,122,255,1);
104
+ --card-footer-bg: rgba(219,225,234,1);
105
+
106
+ --table-bg:#ffffff";
107
+ --table-head-bg:#fafafa";
108
+ --table-bd:rgba(245,245,245,1);
109
+ --table-row-hover-color:rgba(237,245,250,1);
110
+
111
+ --scrollbar-width: 8px;
112
+ --scrollbar-track-bg: rgba(239,241,244,1);
113
+ --scrollbar-thumb-bg: rgba(185,193,203,1);
114
+ --scrollbar-thumb-hover-bg: rgba(195,209,229,1);
115
+ --scrollbar-track-shadow: 0 0 3px 0 rgba(255, 255, 255, 0.1) inset;
116
+ --scrollbar-thumb-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3) inset;
117
+ }
118
+ `;