style: refine Beam tree visibility toggles
This commit is contained in:
parent
7e4b91b2da
commit
9e61480ad1
|
|
@ -599,7 +599,39 @@ header {
|
||||||
}
|
}
|
||||||
|
|
||||||
.tree li > input[type="checkbox"] {
|
.tree li > input[type="checkbox"] {
|
||||||
margin-right: 6px;
|
appearance: none;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
display: inline-block;
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
margin: 0 6px 0 0;
|
||||||
|
vertical-align: -1px;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: color-mix(in srgb, var(--modal-element) var(--modal-focus-alpha, 100%), transparent);
|
||||||
|
box-shadow: inset 0 0 0 1px var(--modal-element-outline, var(--modal-element));
|
||||||
|
cursor: pointer;
|
||||||
|
transition:
|
||||||
|
background-color 160ms ease,
|
||||||
|
box-shadow 160ms ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree li > input[type="checkbox"]:checked {
|
||||||
|
background: var(--highlight-color, var(--accent));
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree li > input[type="checkbox"]:hover {
|
||||||
|
background: var(--nodedc-glass-control-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree li > input[type="checkbox"]:checked:hover {
|
||||||
|
background: color-mix(in srgb, var(--highlight-color, var(--accent)) 86%, white 14%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree li > input[type="checkbox"]:focus,
|
||||||
|
.tree li > input[type="checkbox"]:focus-visible {
|
||||||
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inspector-controls {
|
.inspector-controls {
|
||||||
|
|
|
||||||
|
|
@ -87,7 +87,7 @@
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700&display=swap" rel="stylesheet">
|
||||||
<link rel="stylesheet" href="./dcViewer.css?v=10">
|
<link rel="stylesheet" href="./dcViewer.css?v=11">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue