Skip to content

Commit a372ab1

Browse files
Kissimbila16Kissimbila16
committed
add new selectors
1 parent f6b6569 commit a372ab1

File tree

1 file changed

+182
-1
lines changed

1 file changed

+182
-1
lines changed

‎scss/helpers/_color-bg.scss

+182-1
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,185 @@
44
color: color-contrast($value) if($enable-important-utilities, !important, null);
55
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
66
}
7-
}
7+
8+
.text-bg-hover#{$color}:hover {
9+
color: color-contrast($value) if($enable-important-utilities, !important, null);
10+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
11+
}
12+
13+
.bg-hover-#{$color}:hover {
14+
color: color-contrast($value) if($enable-important-utilities, !important, null);
15+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
16+
}
17+
18+
.text-bg-off-#{$color}:disabled {
19+
color: color-contrast($value) if($enable-important-utilities, !important, null);
20+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
21+
}
22+
23+
.bg-off-#{$color}:disabled {
24+
color: color-contrast($value) if($enable-important-utilities, !important, null);
25+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
26+
}
27+
28+
.text-bg-active-#{$color}:active {
29+
color: color-contrast($value) if($enable-important-utilities, !important, null);
30+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
31+
}
32+
33+
.bg-active-#{$color}:active {
34+
color: color-contrast($value) if($enable-important-utilities, !important, null);
35+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
36+
}
37+
38+
39+
.text-bg-touch-#{$color}:selected {
40+
color: color-contrast($value) if($enable-important-utilities, !important, null);
41+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
42+
}
43+
44+
.bg-touch-#{$color}:selected {
45+
color: color-contrast($value) if($enable-important-utilities, !important, null);
46+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
47+
}
48+
49+
.text-bg-look-#{$color}:focus {
50+
color: color-contrast($value) if($enable-important-utilities, !important, null);
51+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
52+
}
53+
54+
.bg-look-#{$color}:focus {
55+
color: color-contrast($value) if($enable-important-utilities, !important, null);
56+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
57+
}
58+
59+
.text-bg-see-#{$color}:visited {
60+
color: color-contrast($value) if($enable-important-utilities, !important, null);
61+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
62+
}
63+
64+
.bg-see-#{$color}:visited {
65+
color: color-contrast($value) if($enable-important-utilities, !important, null);
66+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
67+
}
68+
69+
.text-bg-a-see-#{$color}:link {
70+
color: color-contrast($value) if($enable-important-utilities, !important, null);
71+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
72+
}
73+
74+
.bg-a-see-#{$color}:link {
75+
color: color-contrast($value) if($enable-important-utilities, !important, null);
76+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
77+
}
78+
79+
80+
.text-bg-load-#{$color}:-moz-loading {
81+
color: color-contrast($value) if($enable-important-utilities, !important, null);
82+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
83+
}
84+
85+
.bg-load-#{$color}:-moz-loading {
86+
color: color-contrast($value) if($enable-important-utilities, !important, null);
87+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
88+
}
89+
90+
.text-bg-check-#{$color}:checked {
91+
color: color-contrast($value) if($enable-important-utilities, !important, null);
92+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
93+
}
94+
95+
.bg-check-#{$color}:checked {
96+
color: color-contrast($value) if($enable-important-utilities, !important, null);
97+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
98+
}
99+
100+
101+
102+
.text-bg-on-#{$color}:enabled {
103+
color: color-contrast($value) if($enable-important-utilities, !important, null);
104+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
105+
}
106+
107+
.bg-on-#{$color}:enabled {
108+
color: color-contrast($value) if($enable-important-utilities, !important, null);
109+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
110+
}
111+
112+
113+
.text-bg-valid-#{$color}:valid {
114+
color: color-contrast($value) if($enable-important-utilities, !important, null);
115+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
116+
}
117+
118+
.bg-valid-#{$color}:valid {
119+
color: color-contrast($value) if($enable-important-utilities, !important, null);
120+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
121+
}
122+
123+
124+
.text-bg-invalid-#{$color}:invalid {
125+
color: color-contrast($value) if($enable-important-utilities, !important, null);
126+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
127+
}
128+
129+
.bg-invalid-#{$color}:invalid {
130+
color: color-contrast($value) if($enable-important-utilities, !important, null);
131+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
132+
}
133+
134+
135+
.text-bg-target-#{$color}:target {
136+
color: color-contrast($value) if($enable-important-utilities, !important, null);
137+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
138+
}
139+
140+
.bg-target-#{$color}:target {
141+
color: color-contrast($value) if($enable-important-utilities, !important, null);
142+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
143+
}
144+
145+
.text-bg-rq-#{$color}:required {
146+
color: color-contrast($value) if($enable-important-utilities, !important, null);
147+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
148+
}
149+
150+
.bg-rq-#{$color}:required {
151+
color: color-contrast($value) if($enable-important-utilities, !important, null);
152+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
153+
}
154+
155+
.text-bg-stop-#{$color}:paused {
156+
color: color-contrast($value) if($enable-important-utilities, !important, null);
157+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
158+
}
159+
160+
.bg-stop-#{$color}:paused {
161+
color: color-contrast($value) if($enable-important-utilities, !important, null);
162+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
163+
}
164+
165+
166+
.text-bg-play-#{$color}:playing {
167+
color: color-contrast($value) if($enable-important-utilities, !important, null);
168+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
169+
}
170+
171+
.bg-play-#{$color}:playing {
172+
color: color-contrast($value) if($enable-important-utilities, !important, null);
173+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
174+
}
175+
176+
.text-bg-justsee-#{$color}:read-only {
177+
color: color-contrast($value) if($enable-important-utilities, !important, null);
178+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
179+
}
180+
181+
.bg-justsee-#{$color}:read-only {
182+
color: color-contrast($value) if($enable-important-utilities, !important, null);
183+
background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
184+
}
185+
186+
187+
188+
}

0 commit comments

Comments
 (0)