Skip to content

Commit 98dff1e

Browse files
nikolozanikoloza
committed
bump version
1 parent 3f3141e commit 98dff1e

File tree

4 files changed

+563
-51
lines changed

4 files changed

+563
-51
lines changed

‎lib/colors/brand-states.css

+299
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,299 @@
1+
.primary {
2+
&:hover {
3+
color: var(--primary-hover);
4+
background: var(--primary-contrast-hover);
5+
border-color: var(--primary-hover);
6+
}
7+
&:focus {
8+
color: var(--primary-hover);
9+
background: var(--primary-contrast-hover);
10+
border-color: var(--primary-focus);
11+
}
12+
13+
&-contrast {
14+
&:hover {
15+
color: var(--primary-contrast-hover);
16+
background: var(--primary-hover);
17+
border-color: var(--primary-focus);
18+
}
19+
&:focus {
20+
color: var(--primary-contrast-hover);
21+
background: var(--primary-hover);
22+
border-color: var(--primary-hover);
23+
}
24+
}
25+
26+
&-color {
27+
&:hover {
28+
color: var(--primary-hover);
29+
}
30+
&:focus {
31+
color: var(--primary-focus);
32+
}
33+
34+
&-contrast {
35+
&:hover {
36+
color: var(--primary-contrast-hover);
37+
}
38+
&:focus {
39+
color: var(--primary-contrast-focus);
40+
}
41+
}
42+
}
43+
44+
&-background {
45+
background: var(--primary);
46+
47+
&-contrast {
48+
background: var(--primary-contrast);
49+
}
50+
}
51+
52+
&-border {
53+
border-color: var(--primary-focus);
54+
55+
&-contrast {
56+
border-color: var(--primary-contrast-focus);
57+
}
58+
}
59+
}
60+
61+
.secondary {
62+
&:hover {
63+
color: var(--secondary-hover);
64+
background: var(--secondary-contrast-hover);
65+
border-color: var(--secondary-hover);
66+
}
67+
&:focus {
68+
color: var(--secondary-hover);
69+
background: var(--secondary-contrast-hover);
70+
border-color: var(--secondary-focus);
71+
}
72+
73+
&-contrast {
74+
&:hover {
75+
color: var(--secondary-contrast-hover);
76+
background: var(--secondary-hover);
77+
border-color: var(--secondary-focus);
78+
}
79+
&:focus {
80+
color: var(--secondary-contrast-hover);
81+
background: var(--secondary-hover);
82+
border-color: var(--secondary-hover);
83+
}
84+
}
85+
86+
&-color {
87+
&:hover {
88+
color: var(--secondary-hover);
89+
}
90+
&:focus {
91+
color: var(--secondary-focus);
92+
}
93+
94+
&-contrast {
95+
&:hover {
96+
color: var(--secondary-contrast-hover);
97+
}
98+
&:focus {
99+
color: var(--secondary-contrast-focus);
100+
}
101+
}
102+
}
103+
104+
&-background {
105+
background: var(--secondary);
106+
107+
&-contrast {
108+
background: var(--secondary-contrast);
109+
}
110+
}
111+
112+
&-border {
113+
border-color: var(--secondary-focus);
114+
115+
&-contrast {
116+
border-color: var(--secondary-contrast-focus);
117+
}
118+
}
119+
}
120+
121+
.tertiary {
122+
&:hover {
123+
color: var(--tertiary-hover);
124+
background: var(--tertiary-contrast-hover);
125+
border-color: var(--tertiary-hover);
126+
}
127+
&:focus {
128+
color: var(--tertiary-hover);
129+
background: var(--tertiary-contrast-hover);
130+
border-color: var(--tertiary-focus);
131+
}
132+
133+
&-contrast {
134+
&:hover {
135+
color: var(--tertiary-contrast-hover);
136+
background: var(--tertiary-hover);
137+
border-color: var(--tertiary-focus);
138+
}
139+
&:focus {
140+
color: var(--tertiary-contrast-hover);
141+
background: var(--tertiary-hover);
142+
border-color: var(--tertiary-hover);
143+
}
144+
}
145+
146+
&-color {
147+
&:hover {
148+
color: var(--tertiary-hover);
149+
}
150+
&:focus {
151+
color: var(--tertiary-focus);
152+
}
153+
154+
&-contrast {
155+
&:hover {
156+
color: var(--tertiary-contrast-hover);
157+
}
158+
&:focus {
159+
color: var(--tertiary-contrast-focus);
160+
}
161+
}
162+
}
163+
164+
&-background {
165+
background: var(--tertiary);
166+
167+
&-contrast {
168+
background: var(--tertiary-contrast);
169+
}
170+
}
171+
172+
&-border {
173+
border-color: var(--tertiary-focus);
174+
175+
&-contrast {
176+
border-color: var(--tertiary-contrast-focus);
177+
}
178+
}
179+
}
180+
181+
.quaternary {
182+
&:hover {
183+
color: var(--quaternary-hover);
184+
background: var(--quaternary-contrast-hover);
185+
border-color: var(--quaternary-hover);
186+
}
187+
&:focus {
188+
color: var(--quaternary-hover);
189+
background: var(--quaternary-contrast-hover);
190+
border-color: var(--quaternary-focus);
191+
}
192+
193+
&-contrast {
194+
&:hover {
195+
color: var(--quaternary-contrast-hover);
196+
background: var(--quaternary-hover);
197+
border-color: var(--quaternary-focus);
198+
}
199+
&:focus {
200+
color: var(--quaternary-contrast-hover);
201+
background: var(--quaternary-hover);
202+
border-color: var(--quaternary-hover);
203+
}
204+
}
205+
206+
&-color {
207+
&:hover {
208+
color: var(--quaternary-hover);
209+
}
210+
&:focus {
211+
color: var(--quaternary-focus);
212+
}
213+
214+
&-contrast {
215+
&:hover {
216+
color: var(--quaternary-contrast-hover);
217+
}
218+
&:focus {
219+
color: var(--quaternary-contrast-focus);
220+
}
221+
}
222+
}
223+
224+
&-background {
225+
background: var(--quaternary);
226+
227+
&-contrast {
228+
background: var(--quaternary-contrast);
229+
}
230+
}
231+
232+
&-border {
233+
border-color: var(--quaternary-focus);
234+
235+
&-contrast {
236+
border-color: var(--quaternary-contrast-focus);
237+
}
238+
}
239+
}
240+
241+
.quinary {
242+
&:hover {
243+
color: var(--quinary-hover);
244+
background: var(--quinary-contrast-hover);
245+
border-color: var(--quinary-hover);
246+
}
247+
&:focus {
248+
color: var(--quinary-focus);
249+
background: var(--quinary-contrast-focus);
250+
border-color: var(--quinary-focus);
251+
}
252+
253+
&-contrast {
254+
&:hover {
255+
color: var(--quinary-contrast-hover);
256+
background: var(--quinary-hover);
257+
border-color: var(--quinary-focus);
258+
}
259+
&:focus {
260+
color: var(--quinary-contrast-focus);
261+
background: var(--quinary-focus);
262+
border-color: var(--quinary-focus);
263+
}
264+
}
265+
266+
&-color {
267+
&:hover {
268+
color: var(--quinary-hover);
269+
}
270+
&:focus {
271+
color: var(--quinary-focus);
272+
}
273+
274+
&-contrast {
275+
&:hover {
276+
color: var(--quinary-contrast-hover);
277+
}
278+
&:focus {
279+
color: var(--quinary-contrast-focus);
280+
}
281+
}
282+
}
283+
284+
&-background {
285+
background: var(--quinary);
286+
287+
&-contrast {
288+
background: var(--quinary-contrast);
289+
}
290+
}
291+
292+
&-border {
293+
border-color: var(--quinary-focus);
294+
295+
&-contrast {
296+
border-color: var(--quinary-contrast-focus);
297+
}
298+
}
299+
}

0 commit comments

Comments
 (0)