blob: e9de5a20ad1b12f04ca5e4dab1ecca230f2b7ffd (
plain)
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
|
div.outer {
align-items: center;
border-radius: 10px;
border: 1px solid var(--color-aclaction-deny);
cursor: pointer;
display: flex;
flex-direction: row;
height: 20px;
position: relative;
transition: border-color 0.1s linear;
user-select: none;
width: min-content;
}
div.inner {
background: var(--color-aclaction-deny);
border-radius: 8px;
height: calc(100% - 2px);
left: 1px;
position: absolute;
top: 1px;
transition: left 0.1s linear, background 0.1s linear;
width: calc(50% - 2px);
z-index: 1;
}
div.outer p {
color: white;
font-family: 'Trebuchet MS';
font-size: 8pt;
text-align: center;
transition: color 0.1s linear;
width: 50px;
z-index: 2;
}
input:checked + div.outer {
border-color: var(--color-aclaction-allow);
}
input:checked + div.outer > div.inner {
background: var(--color-aclaction-allow);
left: calc(50% + 1px);
}
input:checked + div.outer p:nth-child(2) {
color: black;
}
|
