-
Notifications
You must be signed in to change notification settings - Fork 1
/
css-variables.css
123 lines (123 loc) · 5.41 KB
/
css-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
:root {
color-scheme: light dark;
--toolbar-height: 49px;
--mobile-toolbar-height: 57px;
--external-header-height: 24px;
--search-header-height: 72px;
--sidebar-width: 192px;
--rightbar-width: 192px;
--login-background-color: var(--brand-primary-500);
--login-inner-background-color: light-dark(#ffffff, #000000);
--gray-base: light-dark(#000000, #f2f2f2);
--gray-darkest: light-dark(#262626, #d9d9d9);
--gray-darker: light-dark(#4d4d4d, #999999);
--gray-dark: light-dark(#666666, #777777);
--gray: light-dark(#777777, #666666);
--gray-light: light-dark(#999999, #4d4d4d);
--gray-lighter: light-dark(#d9d9d9, #262626);
--gray-lightest: light-dark(#f2f2f2, #191919);
--gray-placeholder: var(--gray-dark);
--warm-gray: var(--gray-light);
--off-white: #fafafa;
--translucent-black: rgba(0, 0, 0, 0.6);
--translucent-white: rgba(255, 255, 255, 0.6);
--overlay-bg: light-dark(var(--translucent-black), var(--translucent-white));
--branding-font-family: "Roboto", Helvetica, Arial, sans-serif;
--branding-font-family-regular: "Roboto", Helvetica, Arial, sans-serif;
--branding-font-family-medium: "Roboto", Helvetica, Arial, sans-serif;
--branding-font-family-bold: "Roboto", Helvetica, Arial, sans-serif;
--branding-font-family-medium-italic: "Roboto", Helvetica, Arial, sans-serif;
--color-light-positive: #00bd02;
--color-light-negative: #ff1f1f;
--body-bg: light-dark(#ffffff, #000000);
--text-color: light-dark(var(--gray-darker), var(--gray-darkest));
--text-color-white: #ffffff;
--text-color-black: #000000;
--dialog-title-fg: var(--gray-base);
--background-gray: var(--gray-lightest);
--link-color: light-dark(var(--brand-primary-600), var(--brand-primary-400));
--link-hover-color: light-dark(var(--brand-primary-800), var(--brand-primary-200));
--link-hover-decoration: underline;
--item-hover-bg: #ffffff;
--item-selected-bg: var(--brand-primary-100);
--border-color: light-dark(var(--gray-lighter), var(--gray));
--hr-border: light-dark(var(--gray-lighter), var(--gray));
--input-border-color: light-dark(var(--gray), var(--gray));
--placeholder-color: var(--gray-dark);
--app-menu-active-color: light-dark(var(--text-color-white), var(--brand-primary-500));
--app-menu-active-background-color: light-dark(var(--brand-primary-500), var(--text-color-white));
--list-active-bg: light-dark(var(--brand-primary-50), var(--brand-primary-900));
--list-hover-bg: var(--gray-lightest);
--folder-item-hover-bg: var(--list-hover-bg);
--sidebar-bg-color: var(--gray-lightest);
--sidebar-header-bg-color: var(--gray-lightest);
--sidebar-shaded-color: var(--gray-lighter);
--rightbar-bg-color: var(--gray-lightest);
--read-pane-toolbar-color: var(--gray-lightest);
--read-pane-bg-color: var(--gray-lightest);
--favorite-indicator-active: var(--brand-warning-500);
--favorite-indicator-inactive: var(--gray);
--favorite-indicator-hover: var(--brand-warning-400);
--favorite-indicator-disabled: var(--gray-lighter);
--trash-indicator: var(--gray);
--trash-indicator-hover: var(--brand-primary-500);
--file-type-doc: #0f73ff;
--file-type-ppt: #ff9937;
--file-type-pdf: #ff4c4e;
--file-type-xls: #0e9d58;
--file-type-zip: #ada293;
--file-type-default: #949cae;
--file-type-media: #bc0e67;
--file-type-code: #00b4ca;
--toast-success-color: var(--brand-success-500);
--toast-failure-color: var(--brand-danger-500);
--toast-warning-color: var(--brand-warning-500);
--font-family-sans-serif: "Roboto", Helvetica, Arial, sans-serif;
--font-family-serif: Georgia, "Times New Roman", Times, serif;
--font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
--font-family-base: "Roboto", Helvetica, Arial, sans-serif;
--font-brand-primary: inherit;
--font-family-primary: inherit;
--font-family-secondary: inherit;
--font-family-plainText: monospace;
--font-size-base: 14px;
--font-size-med: calc(var(--font-size-base) * 1.15); /*~16px*/
--font-size-large: calc(var(--font-size-base) * 1.25); /*~18px*/
--font-size-small: calc(var(--font-size-base) * 0.85); /*~12px*/
--font-size-h1: calc(var(--font-size-base) * 2.6); /* ~36px */
--font-size-h2: calc(var(--font-size-base) * 2.15); /* ~30px */
--font-size-h3: calc(var(--font-size-base) * 1.7); /* ~24px */
--font-size-h4: calc(var(--font-size-base) * 1.25); /* ~18px */
--font-size-h5: var(--font-size-base);
--font-size-h6: calc(var(--font-size-base) * 0.85); /* ~12px */
--line-height-base: 1.42857143;
--line-height-computed: calc(var(--font-size-base) * var(--line-height-base)); /* ~20px */
--headings-font-family: inherit;
--headings-font-weight: 300;
--headings-line-height: 1.1;
--headings-color: inherit;
--headings-small-color: var(--gray-light);
--spacing-base: 8px;
--spacing-xs: calc(var(--spacing-base) / 2);
--spacing-sm: var(--spacing-base);
--spacing-md: calc(var(--spacing-base) * 2);
--spacing-lg: calc(var(--spacing-base) * 3);
--spacing-xl: calc(var(--spacing-base) * 4);
--icon-size-xs: 12px;
--icon-size-sm: 16px;
--icon-size-md: 24px;
--icon-size-lg: 32px;
--logo-height: 32px;
--logo-max-width: 200px;
--header-bg: var(--gray-lightest);
--header-fg: var(--gray-darker);
--header-actions-fg: var(--gray-darker);
--external-header-bg: var(--brand-primary-700);
--external-header-fg: #ffffff;
--search-highlighter: #fff100;
--row-height-narrow: 72px;
--row-height-wide: 27px;
--tag-secondary-font-color: #ffffff;
--popover-row-border-color: var(--border-color);
--warning-banner-bg: light-dark(var(--brand-warning-300), var(--brand-warning-500));
}