|
25 | 25 | } |
26 | 26 |
|
27 | 27 | :root { |
28 | | ---color-black:#090B0B; |
29 | 28 | --color-white:#FFFFFF; |
30 | | ---color-dark-gray:#18181B; |
31 | | ---color-light-gray:#A1A1AA; |
32 | | ---color-orange:#F3722C; |
| 29 | +--color-warning:#F3722C; |
| 30 | +--color-surface-primary:#090B0B; |
| 31 | +--color-zinc-900:#18181B; |
| 32 | +--color-zinc-400:#A1A1AA; |
| 33 | +--color-zinc-800:#27272A; |
33 | 34 | } |
34 | 35 |
|
35 | 36 | html, |
|
40 | 41 | height:100%; |
41 | 42 |
|
42 | 43 | background:var(--color-black); |
43 | | -color:var(--color-light-gray); |
| 44 | +color:var(--color-zinc-400); |
44 | 45 |
|
45 | 46 | font-family: system-ui, sans-serif; |
46 | 47 | font-size:16px; |
|
94 | 95 | padding:0.5rem1rem; |
95 | 96 |
|
96 | 97 | border-radius:0.375rem; |
97 | | -border:1px solid#27272a; |
| 98 | +border:1px solidvar(--color-zinc-800); |
98 | 99 | background: none; |
99 | 100 |
|
100 | | -color:#ffffff; |
| 101 | +color:var(--color-white); |
101 | 102 | text-decoration: none; |
102 | 103 | font-size:0.875rem; |
103 | 104 | font-weight:400; |
|
110 | 111 |
|
111 | 112 | .button-groupa:hover, |
112 | 113 | .button-groupbutton:hover { |
113 | | -background-color:var(--color-dark-gray); |
114 | | -border-color:#27272a; |
| 114 | +background-color:var(--color-zinc-900); |
| 115 | +border-color:var(--color-zinc-800); |
115 | 116 | } |
116 | 117 |
|
117 | 118 | .warning { |
118 | | -border:1px solidvar(--color-orange); |
119 | | -background:var(--color-dark-gray); |
| 119 | +border:1px solidvar(--color-warning); |
| 120 | +background:var(--color-zinc-900); |
120 | 121 | width:100%; |
121 | 122 |
|
122 | 123 | margin:1.5rem00; |
|