初版

wangrui

2020-12-14 0d7669f8bf28300362fc0dacd5c794ff823d0297

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
@import "../common/variable";
 
/* 主题色
-------------------------- */
@dark--primary-color: #26DEFD;
@dark--primary-darkness-color-1: #27CBEB; // 主颜色亮度20
@dark--primary-darkness-color-2: #25AECD; // 主颜色亮度50
@dark--primary-darkness-color-3: #20809B; // 主颜色亮度100
 
@dark--primary-opacity-color-1: rgba(38, 222, 253, .1);
@dark--primary-opacity-color-1-5: rgba(38, 222, 253, .15);
@dark--primary-opacity-color-3: rgba(38, 222, 253, .3);
 
/* Base
-------------------------- */
@dark--title-color: #f7faff;
@dark--text-base: #e4e8f1;
@dark--text-secondary: #BBC3CD;
@dark--text-placeholder: #97a8be;
@dark--text-disabled: #677287;
 
@dark--background-base: #091e33;
@dark--background-header: #324157;
@dark--background-body: #202e3e;
 
/* border
-------------------------- */
@dark--border-color-base: @dark--primary-darkness-color-2; // 主颜色亮度50
@dark--border-color-light: @dark--primary-darkness-color-1; // 主颜色亮度20
 
/* popover
-------------------------- */
@dark--popover-body-color: @dark--background-body;
@dark--popover-border-color: @dark--border-color-base;
 
/* collapse
-------------------------- */
@dark--collapse-text-color: @dark--text-base;
@dark--collapse-title-color: @dark--title-color;
@dark--collapse-header-background: @dark--background-header;
@dark--collapse-container-background: @dark--background-base;
@dark--collapse-border-color: @dark--border-color-base;
 
/* popup
-------------------------- */
@dark--popup-title-color: @dark--title-color;
 
@dark--popup-border-color-1: #092c42; // 设备配置查看页面，下面vivew粗border
@dark--popup-title-background: @dark--background-header;
@dark--popup-border-color: @dark--background-header;
@dark--popup-background: @dark--background-base;
 
/* link
-------------------------- */
@dark--link-color: @color-blue;
@dark--link-hover-color: @color-blue-light;
@dark--link-active-color: @color-blue-light;
@dark--link-disabled-color: @dark--text-secondary;
 
/* table
-------------------------- */
@dark--table-title-color: @dark--title-color;
@dark--table-text-color: @dark--text-base;
@dark--table-title-background: @dark--primary-opacity-color-3;
@dark--table-row-current-background: @dark--primary-opacity-color-1-5;
@dark--table-row-hover-background: @dark--primary-opacity-color-1-5;
@dark--table-border-color: @dark--border-color-base;
 
/* select
-------------------------- */
@dark--select-text-color: @dark--text-base;
@dark--select-dropdown-background: @dark--background-body;
@dark--select-border-color: @dark--border-color-base;
@dark--select-border-light-color: @dark--border-color-light;
@dark--select-hover-background: @dark--primary-opacity-color-1;
@dark--select-selected-background: @dark--primary-opacity-color-3;
 
/* input
-------------------------- */
@dark--input-text-color: @dark--text-base;
 
/* pagination
-------------------------- */
@dark--pagination-text-color: @dark--text-base;
@dark--pagination-text-hover-color: @dark--primary-color;
@dark--pagination-border-color: @dark--border-color-base;
@dark--pagination-selected-background: @dark--primary-opacity-color-3;
 
/* Button
-------------------------- */
@dark--button-text-color: @dark--text-base;
@dark--button-primary-background-color: @dark--primary-darkness-color-3;