static: flexbox: treeview.css: use directory unicode symbols

This commit is contained in:
coon 2024-01-23 23:43:08 +01:00
parent e38a94264b
commit 5e9ff24647

View file

@ -32,14 +32,25 @@
/* Horizontal lines */ /* Horizontal lines */
.tree ul::before {
content : '';
display : block;
position : absolute;
top : calc(var(--spacing) - 8px);
left : 6px;
width : calc(var(--spacing) + 2px);
border : solid #ddd;
border-width : 0 0 2px 2px;
}
.tree ul li::before { .tree ul li::before {
content : ''; content : '';
display : block; display : block;
position : absolute; position : absolute;
top : calc(var(--spacing) / -2); top : calc(var(--spacing) - 22px);
left : -2px; left : -2px;
width : calc(var(--spacing) + 2px); width : calc(var(--spacing) + 2px);
height : calc(var(--spacing) + 1px); height : calc(var(--spacing) - 2px);
border : solid #ddd; border : solid #ddd;
border-width : 0 0 2px 2px; border-width : 0 0 2px 2px;
} }
@ -68,24 +79,22 @@
.tree li::after, .tree li::after,
.tree summary::before { .tree summary::before {
content : ''; content : '\1F4C1';
display : block; display : block;
position : absolute; position : absolute;
top : calc(var(--spacing) / 2 - var(--radius)); top : calc(var(--spacing) / 1.5 - var(--radius));
left : calc(var(--spacing) - var(--radius) - 1px); left : calc(var(--spacing) - var(--radius) - 1px);
width : calc(2 * var(--radius)); width : calc(2 * var(--radius));
height : calc(2 * var(--radius)); height : calc(2 * var(--radius));
border-radius : 50%; }u
background : #ddd;
}
/* Expand and collapse buttons */ /* Expand and collapse buttons */
.tree summary::before { .tree summary::before {
z-index: 1; z-index: 1;
background : #696 url('../img/expand-collapse.svg') 0 0; content: '\1F4C1';
} }
.tree details[open] > summary::before { .tree details[open] > summary::before {
background-position : calc(-2 * var(--radius)) 0; content: '\1F4C2';
} }