-
Notifications
You must be signed in to change notification settings - Fork 70
/
variables.css
179 lines (179 loc) · 7.08 KB
/
variables.css
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
/* Media Breakpoints */
/* Fonts */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local(''), url('../fonts/roboto-v30-latin-ext_latin-regular.woff2') format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local(''), url('../fonts/roboto-v30-latin-ext_latin-700.woff2') format('woff2');
}
/* Variables */
:root {
--border-radius: 8px;
--gutter-size: 2rem;
--link-text-color: #06b;
--whitespace-color: #fff;
--top-background-color: var(--card-background-color);
--top-text-color: var(--card-text-color);
--page-background-color: #f5f6f7;
--sidebar-background-color: #e6e8ec;
--sidebar-border-color: var(--default-border-color);
--sidebar-text-color: #333;
--sidebar-width: 18em;
--navigation-background-color: #3e3e3e;
--navigation-background-color-active: #bdbdbd;
--navigation-text-color: #444;
--default-background-color: #f2f3f6;
--default-background-color-hover: #f2f3f6;
--default-border-color: #f2f3f7;
--default-line-height: 1.25;
--default-text-font: Roboto, Arial, 'Helvetica Neue', Helvetica, sans-serif;
--default-text-color: #444;
--default-text-size: 14px;
--breadcrumbs-background-color: transparent;
--breadcrumbs-text-color: #3c3c3c;
--breadcrumbs-border-color: transparent;
--card-background-color: #fff;
--card-text-color: var(--default-text-color);
--card-border-color: transparent;
--card-header-background-color: transparent;
--card-header-text-color: var(--card-text-color);
--card-body-background-color: transparent;
--card-footer-background-color: #f2f3f6;
--pills-background-color: #f3f3f3;
--pills-background-color-active: #cfd3e1;
--pills-background-color-hover: #f1f3f7;
--pills-text-color: var(--default-text-color);
--tab-nav-background-color: #fff;
--tab-nav-background-color-hover: transparent;
--tab-nav-background-color-active: transparent;
--tab-nav-text-color: var(--default-text-color);
--tab-border-color: #e7e9f0;
--tab-content-background-color: #fff;
--tab-content-text-color: var(--default-text-color);
--table-header-background-color: #fff;
--table-body-background-color: #fff;
--table-row-background-color-odd: #f9fafb;
--table-row-background-color-even: #fff;
--table-row-background-color-hover: #ecedef;
--table-link-background-color: #e3ebf3;
--table-link-background-color-hover: #cfddeb;
--table-footer-background-color: #fbfcfd;
--table-border-color: #e6e8f0;
--pagination-background-color: #fff;
--pagination-background-color-hover: #c8cbd0;
--pagination-background-color-active: #e6e8ec;
--pagination-border-color: var(--default-border-color);
--pagination-border-color-hover: var(--default-border-color);
--pagination-border-color-active: var(--default-border-color);
--pagination-text-color: var(--default-text-color);
--pagination-text-color-hover: var(--default-text-color);
--pagination-text-color-active: var(--default-text-color);
--button-default-background-color: #f3f4f7;
--button-default-background-color-hover: #eeeff3;
--button-default-background-color-active: #dfdfe2;
--button-default-border-color: #e0e0e0;
--button-default-text-color: #222;
--button-danger-background-color: #d9534f;
--button-danger-background-color-hover: #d04a46;
--button-danger-background-color-active: #db5d59;
--button-danger-border-color: rgba(0, 0, 0, 0.1);
--button-danger-text-color: #fff;
--button-success-background-color: #87b92b;
--button-success-background-color-hover: #7faf26;
--button-success-background-color-active: #87b92b;
--button-success-border-color: rgba(0, 0, 0, 0.1);
--button-success-text-color: #fff;
--input-background-color: #f9f9fb;
--input-addon-background-color: #f3f4f7;
--input-code-background-color: #313b50;
--input-code-text-color: #fff;
--input-text-color: #000;
--input-line-height: 1.333;
--input-border-color: #e7e9f0;
--input-border-color-focus: #e7e9f0;
--input-padding-x: 1em;
--input-padding-y: 0.5em;
--notice-default-background-color: #e5e5e5;
--notice-default-text-color: #000;
--notice-primary-background-color: #3ba5c6;
--notice-primary-text-color: #fff;
--notice-success-background-color: #98cc34;
--notice-success-text-color: #fff;
--notice-warning-background-color: #ffcc66;
--notice-warning-text-color: #aa0000;
--notice-danger-background-color: #d9534f;
--notice-danger-text-color: #fff;
--copyright-text-color: #444;
}
html.dark-mode {
--top-background-color: #283144;
--top-text-color: var(--card-text-color);
--page-background-color: #1a2133;
--sidebar-background-color: #283144;
--sidebar-border-color: #1d2431;
--sidebar-text-color: #acb6c2;
--default-background-color: #283042;
--default-border-color: #1c243a;
--default-title-color: #acb6c2;
--default-text-color: #acb6c2;
--default-input-color: #fff;
--card-background-color: #283144;
--card-header-background-color: transparent;
--card-body-background-color: transparent;
--card-footer-background-color: #212836;
--card-border-color: #253046;
--pills-background-color: #333c4e;
--tab-nav-background-color: #1c243a;
--tab-nav-text-color: #acb6c2;
--tab-border-color: #434e67;
--tab-content-background-color: #283144;
--table-header-background-color: #283144;
--table-body-background-color: #283144;
--table-row-background-color-odd: #2d374c;
--table-row-background-color-even: #283246;
--table-row-background-color-hover: #3c4861;
--table-link-background-color: #1a2133;
--table-link-background-color-hover: #333b4e;
--table-footer-background-color: #252e42;
--table-border-color: #1c243a;
--pagination-background-color: var(--default-background-color);
--pagination-background-color-hover: var(--default-background-color);
--pagination-background-color-active: #35415a;
--pagination-border-color: var(--default-border-color);
--pagination-border-color-hover: var(--default-border-color);
--pagination-border-color-active: var(--default-border-color);
--pagination-text-color: var(--default-text-color);
--pagination-text-color-active: var(--default-text-color);
--pagination-text-color-hover: #fff;
--button-default-background-color: #434e67;
--button-default-background-color-hover: #535f7a;
--button-default-background-color-active: #161b25;
--button-default-border-color: #434e67;
--button-default-text-color: #acb6c2;
--button-danger-background-color: #a93e3a;
--button-danger-background-color-hover: #bd3d38;
--button-danger-background-color-active: #a93e3a;
--button-danger-border-color: rgba(0, 0, 0, 0.1);
--button-danger-text-color: #fff;
--button-success-background-color: #608516;
--button-success-background-color-hover: #709f12;
--button-success-background-color-active: #608516;
--button-success-border-color: rgba(0, 0, 0, 0.1);
--button-success-text-color: #fff;
--input-background-color: #1a2133;
--input-border-color: #31384a;
--input-border-color-focus: #555e74;
--input-addon-background-color: #3d485e;
--input-text-color: #acb6c2;
--copyright-text-color: #acb6c2;
--link-text-color: #acb6c7;
--whitespace-color: #1a2133;
}