From 85e86798fc62f8ba513482be6c4df396c8c0b8e2 Mon Sep 17 00:00:00 2001
From: dvirlabs <dvirlabs@gmail.com>
Date: Fri, 11 Jul 2025 18:22:55 +0300
Subject: [PATCH] Style diagram selector

---
 frontend/src/components/Diagram.jsx | 31 ++++++++++++++++++++---------
 1 file changed, 22 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/Diagram.jsx b/frontend/src/components/Diagram.jsx
index 1e3dd7e..b0564dc 100644
--- a/frontend/src/components/Diagram.jsx
+++ b/frontend/src/components/Diagram.jsx
@@ -199,15 +199,28 @@ function Diagram() {
   return (
     <div style={{ width: '100vw', height: '100vh' }}>
       <div style={{ position: 'absolute', zIndex: 10, right: 10, top: 10 }}>
-        <select
-          value={diagramName || ''}
-          onChange={(e) => setDiagramName(e.target.value)}
-          style={{ marginRight: 8, padding: 6 }}
-        >
-          {diagramList.map((name) => (
-            <option key={name} value={name}>{name}</option>
-          ))}
-        </select>
+        <div style={{ display: 'inline-block', marginRight: 8 }}>
+          <label style={{ fontWeight: 'bold', marginRight: 4 }}>Diagram: </label>
+          <select
+            value={diagramName || ''}
+            onChange={(e) => setDiagramName(e.target.value)}
+            style={{
+              padding: '6px 10px',
+              borderRadius: '8px',
+              border: '1px solid #aaa',
+              background: 'black',
+              fontWeight: 'bold',
+              minWidth: 120,
+            }}
+          >
+            {diagramList.map((name) => (
+              <option key={name} value={name}>
+                📌 {name}
+              </option>
+            ))}
+          </select>
+</div>
+
         <button
           className="btn"
           onClick={() => {