From 39a229bf21f9f030b0c60272a40df3cc99ce4c0a Mon Sep 17 00:00:00 2001
From: Joeri Exelmans <joeri.exelmans@gmail.com>
Date: Tue, 14 Oct 2025 19:02:17 +0200
Subject: [PATCH] more toolbar buttons

---
 src/App/App.tsx      |  2 +-
 src/App/TopPanel.tsx | 13 +++++++------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/App/App.tsx b/src/App/App.tsx
index 7450429..82f94dc 100644
--- a/src/App/App.tsx
+++ b/src/App/App.tsx
@@ -112,7 +112,7 @@ export function App() {
           paddingLeft: 1,
         }}>
           <AST {...{...ast, rt: rt.at(rtIdx!)}}/>
-          <hr/>
+          <br/>
           <RTHistory {...{ast, rt, rtIdx, setTime, setRTIdx}}/>
         </Box>
     </Stack>
diff --git a/src/App/TopPanel.tsx b/src/App/TopPanel.tsx
index 56d223c..2acd3ed 100644
--- a/src/App/TopPanel.tsx
+++ b/src/App/TopPanel.tsx
@@ -102,13 +102,14 @@ export function TopPanel({rt, time, setTime, onInit, onClear, onRaise, ast, mode
   return <>
     <div className="toolbar">
       {([
-        ["and", <RountangleIcon kind="and"/>],
-        ["or", <RountangleIcon kind="or"/>],
-        ["pseudo", <PseudoStateIcon/>],
-        ["transition", <TrendingFlatIcon fontSize="small"/>],
-        ["text", <>T</>],
-      ] as [InsertMode, ReactElement][]).map(([m, buttonTxt]) =>
+        ["and", "AND-states", <RountangleIcon kind="and"/>],
+        ["or", "OR-states", <RountangleIcon kind="or"/>],
+        ["pseudo", "pseudo-states", <PseudoStateIcon/>],
+        ["transition", "transitions", <TrendingFlatIcon fontSize="small"/>],
+        ["text", "text", <>T</>],
+      ] as [InsertMode, string, ReactElement][]).map(([m, hint, buttonTxt]) =>
         <button
+          title={"insert "+hint}
           disabled={mode===m}
           onClick={() => setMode(m)}
         >{buttonTxt}</button>)}