Style buttons

frontend/src/components/Diagram.jsx

@@ -199,30 +199,48 @@ function Diagram() {
   return (
     <div style={{ width: '100vw', height: '100vh' }}>
       <div style={{ position: 'absolute', zIndex: 10, right: 10, top: 10 }}>
-        <div style={{ display: 'inline-block', marginRight: 8 }}>
+  <div style={{ position: 'relative', display: 'inline-block', marginRight: 8 }}>
-          <label style={{ fontWeight: 'bold', marginRight: 4 }}>Diagram: </label>
+    <select
-          <select
+      value={diagramName || ''}
-            value={diagramName || ''}
+      onChange={(e) => setDiagramName(e.target.value)}
-            onChange={(e) => setDiagramName(e.target.value)}
+      className="btn"
-            style={{
+      style={{
-              padding: '6px 10px',
+        padding: '10px 16px',
-              borderRadius: '8px',
+        height: 48,
-              border: '1px solid #aaa',
+        fontSize: 16,
-              background: 'black',
+        fontWeight: 'bold',
-              fontWeight: 'bold',
+        borderRadius: '12px',
-              minWidth: 120,
+        border: 'none',
-            }}
+        background: '#111',
-          >
+        color: 'white',
-            {diagramList.map((name) => (
+        cursor: 'pointer',
-              <option key={name} value={name}>
+        appearance: 'none',
-                📌 {name}
+        width: 180,
-              </option>
+      }}
-            ))}
+    >
-          </select>
+      {diagramList.map((name) => (
-</div>
+        <option key={name} value={name} style={{ color: 'white' }}>
+          📌 {name}
+        </option>
+      ))}
+    </select>
+    <div
+      style={{
+        position: 'absolute',
+        right: 16,
+        top: '50%',
+        transform: 'translateY(-50%)',
+        pointerEvents: 'none',
+      }}
+    >
+      ⏷
+    </div>
+  </div>
+
 
         <button
           className="btn"
+          style={{ marginLeft: 8, background: '#d28519', color: 'white' }}
           onClick={() => {
             const newName = prompt("Enter new diagram name:");
             if (newName) {