From bfc4a3d7804ed076e032243d10785a6c44df4708 Mon Sep 17 00:00:00 2001
From: cha0s <git@cha0s.io>
Date: Thu, 2 Jul 2020 02:58:25 -0500
Subject: [PATCH] fix: nicer hierarchy

---
 src/client/menubar.jsx      | 18 ++++++++++++++++--
 src/client/menubar.raw.scss | 10 ++++++++--
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/client/menubar.jsx b/src/client/menubar.jsx
index 05a33d6..1981f83 100644
--- a/src/client/menubar.jsx
+++ b/src/client/menubar.jsx
@@ -13,12 +13,26 @@ const renderTree = (tree) => (
       const {
         children = [],
         label,
-        onClick = () => {},
         onPointerDown = () => {},
       } = branch;
+      const onClick = (event) => {
+        if (branch.onClick) {
+          window.document.activeElement.blur();
+          branch.onClick(event);
+        }
+      };
       return (
         <li>
-          <button onClick={onClick} onPointerDown={onPointerDown} type="button">{label}</button>
+          <button
+            onClick={onClick}
+            onPointerDown={onPointerDown}
+            type="button"
+          >
+            {label}
+            {children.length > 0 && (
+              <span className="descend" />
+            )}
+          </button>
           {children.length > 0 && renderTree(children)}
         </li>
       );
diff --git a/src/client/menubar.raw.scss b/src/client/menubar.raw.scss
index 81957bf..b03a38e 100644
--- a/src/client/menubar.raw.scss
+++ b/src/client/menubar.raw.scss
@@ -38,14 +38,22 @@ li button {
   position: relative;
 
   button {
+    align-items: center;
     background-color: transparent;
     border: none;
+    display: flex;
+    justify-content: space-between;
     text-align: left;
     &:focus {
       box-shadow: none;
     }
   }
 
+  > ul li .descend::after {
+    color: #bbbbbb;
+    content: '>';
+  }
+
   > ul {
     display: none;
   }
@@ -75,7 +83,5 @@ li button {
   > ul > li:hover ul, > ul ul > li:hover {
     display: flex;
   }
-
-
 }