From 46f9c69a39b4fa066fdd56747fd4f633906fc4f4 Mon Sep 17 00:00:00 2001
From: Scarriffle <admin@scarriffle.com>
Date: Mon, 27 Jul 2026 21:23:38 +0200
Subject: [PATCH] Web: "Neue Kategorie"-Button auf Hoehe des Auswahlfelds

Eigene unsichtbare Beschriftungszeile ueber dem Knopf, damit er auf gleicher
Hoehe wie das Kategorie-Auswahlfeld beginnt - statt am oberen oder unteren
Zeilenrand zu kleben.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 web/src/pages/ProductForm.jsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/src/pages/ProductForm.jsx b/web/src/pages/ProductForm.jsx
index 454616e..dde691d 100644
--- a/web/src/pages/ProductForm.jsx
+++ b/web/src/pages/ProductForm.jsx
@@ -656,8 +656,11 @@ export default function ProductForm() {
               />
             </label>
             {isAdmin && (
-              <div style={{ display: "flex", alignSelf: "flex-end", marginBottom: 2 }}>
-                <button type="button" className="btn"
+              // Eigene, unsichtbare Beschriftungszeile, damit der Knopf auf
+              // gleicher Höhe wie das Auswahlfeld beginnt (nicht am Zeilenrand).
+              <div style={{ marginBottom: "var(--sp-4)" }}>
+                <div aria-hidden="true" style={{ visibility: "hidden", fontSize: "0.8rem", fontWeight: 580 }}>&nbsp;</div>
+                <button type="button" className="btn" style={{ width: "auto", marginTop: 5 }}
                   onClick={() => (newCat ? setNewCat(null) : openNewCat())}>
                   <Icon name="plus" size={16} />Neue Kategorie
                 </button>