By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 tabs.css

View raw Download
text/plain • 1.27 kiB
ASCII text
        
            
1
x-notebook > x-tab {
2
display: none;
3
order: 2;
4
width: 100%;
5
}
6
7
x-notebook > label:has(input[type="radio"]:checked) + x-tab {
8
display: block;
9
}
10
11
x-notebook > label > input[type="radio"] {
12
clip-path: inset(50%) !important;
13
height: 1px !important;
14
overflow: hidden !important;
15
position: absolute !important;
16
white-space: nowrap !important;
17
width: 1px !important;
18
opacity: 0 !important;
19
}
20
21
x-notebook > label {
22
display: flex;
23
background: var(--color-tab);
24
color: var(--color-tab-text);
25
height: var(--height-tab);
26
min-width: var(--width-tab);
27
justify-content: var(--align-tab);
28
29
cursor: pointer;
30
border: var(--border-tab);
31
border-radius: var(--radius-tab);
32
}
33
34
x-notebook > label:hover {
35
background: var(--color-tab-hover);
36
color: var(--color-tab-hover-text);
37
}
38
39
x-notebook > label:has(input[type="radio"]:checked) {
40
background: var(--color-tab-selected);
41
color: var(--color-tab-selected-text);
42
border: var(--border-tab-selected);
43
}
44
45
x-notebook > label:has(input[type="radio"]:checked):hover {
46
background: var(--color-tab-hover-selected);
47
color: var(--color-tab-hover-selected-text);
48
}
49
50
x-notebook {
51
display: flex;
52
flex-flow: row wrap;
53
justify-content: var(--justify-tab-row);
54
}
55