From 5e9ff24647b48b2f845196567838157f8e8037d8 Mon Sep 17 00:00:00 2001
From: coon <coon@mailbox.org>
Date: Tue, 23 Jan 2024 23:43:08 +0100
Subject: [PATCH] static: flexbox: treeview.css: use directory unicode symbols

---
 static/flexbox/treeview.css | 29 +++++++++++++++++++----------
 1 file changed, 19 insertions(+), 10 deletions(-)

diff --git a/static/flexbox/treeview.css b/static/flexbox/treeview.css
index 6f052b6..30a7c54 100644
--- a/static/flexbox/treeview.css
+++ b/static/flexbox/treeview.css
@@ -32,14 +32,25 @@
 
 /* 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 {
   content      : '';
   display      : block;
   position     : absolute;
-  top          : calc(var(--spacing) / -2);
+  top          : calc(var(--spacing) - 22px);
   left         : -2px;
   width        : calc(var(--spacing) + 2px);
-  height       : calc(var(--spacing) + 1px);
+  height       : calc(var(--spacing) - 2px);
   border       : solid #ddd;
   border-width : 0 0 2px 2px;
 }
@@ -68,24 +79,22 @@
 
 .tree li::after,
 .tree summary::before {
-  content       : '';
+  content       : '\1F4C1';
   display       : block;
   position      : absolute;
-  top           : calc(var(--spacing) / 2 - var(--radius));
+  top           : calc(var(--spacing) / 1.5 - var(--radius));
   left          : calc(var(--spacing) - var(--radius) - 1px);
   width         : calc(2 * var(--radius));
   height        : calc(2 * var(--radius));
-  border-radius : 50%;
-  background    : #ddd;
-}
+}u
 
 /* Expand and collapse buttons */
 
 .tree summary::before {
-  z-index    : 1;
-  background : #696 url('../img/expand-collapse.svg') 0 0;
+  z-index: 1;
+  content: '\1F4C1';
 }
 
 .tree details[open] > summary::before {
-  background-position : calc(-2 * var(--radius)) 0;
+  content: '\1F4C2';
 }