Reduce form field height to show list entries below the form

py-3 → py-2 on all inputs, selects, buttons; space-y-5 → space-y-3;
textarea rows 3 → 2; label margin reduced.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/BeoSelector.tsx

@@ -37,7 +37,7 @@ export default function BeoSelector({ selected, onChange }: Props) {
         {selected.map((b) => (
           <span
             key={b.ID}
-            className="inline-flex items-center gap-2 bg-blue-100 text-blue-800 text-base px-3 py-2 rounded-full"
+            className="inline-flex items-center gap-2 bg-blue-100 text-blue-800 text-base px-3 py-1.5 rounded-full"
           >
             {b.Kuerzel} — {b.Name}
             <button

components/CustomSelect.tsx

@@ -39,7 +39,7 @@ export default function CustomSelect({ options, placeholder, onChange, keepOpen
       <button
         type="button"
         onClick={() => setOpen((v) => !v)}
-        className="w-full flex items-center justify-between px-4 py-3 border-2 border-gray-400 rounded-lg bg-white text-base text-gray-700 focus:border-blue-500 focus:outline-none"
+        className="w-full flex items-center justify-between px-4 py-2 border-2 border-gray-400 rounded-lg bg-white text-base text-gray-700 focus:border-blue-500 focus:outline-none"
       >
         <span>{placeholder}</span>
         <svg
@@ -58,7 +58,7 @@ export default function CustomSelect({ options, placeholder, onChange, keepOpen
               type="button"
               disabled={opt.disabled}
               onClick={() => select(opt.value)}
-              className="w-full text-left px-4 py-3 text-base hover:bg-blue-50 active:bg-blue-100 border-b border-gray-100 last:border-0 disabled:text-gray-400 disabled:bg-gray-50"
+              className="w-full text-left px-4 py-2 text-base hover:bg-blue-50 active:bg-blue-100 border-b border-gray-100 last:border-0 disabled:text-gray-400 disabled:bg-gray-50"
             >
               {opt.label}
             </button>
@@ -67,7 +67,7 @@ export default function CustomSelect({ options, placeholder, onChange, keepOpen
             <button
               type="button"
               onClick={() => setOpen(false)}
-              className="w-full px-4 py-3 text-base font-medium text-center bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-b-lg border-t-2 border-gray-300"
+              className="w-full px-4 py-2 text-base font-medium text-center bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-b-lg border-t-2 border-gray-300"
             >
               Fertig
             </button>

components/LogbuchForm.tsx

@@ -156,11 +156,11 @@ export default function LogbuchForm({ kuppel, currentUserBeo, editEntry, onSaved
     }
   }
 
-  const inputCls = 'w-full px-3 py-3 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none';
-  const labelCls = 'block text-sm font-medium text-gray-700 mb-1';
+  const inputCls = 'w-full px-3 py-2 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none';
+  const labelCls = 'block text-sm font-medium text-gray-700 mb-0.5';
 
   return (
-    <form onSubmit={handleSubmit} className="space-y-5 max-w-2xl">
+    <form onSubmit={handleSubmit} className="space-y-3 max-w-2xl">
 
       {/* Art der Führung — volle Breite */}
       <div>
@@ -205,7 +205,7 @@ export default function LogbuchForm({ kuppel, currentUserBeo, editEntry, onSaved
           onChange={(e) => setBesucher(parseInt(e.target.value) || 0)}
           min={0}
           max={9999}
-          className="w-32 px-3 py-3 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none"
+          className="w-32 px-3 py-2 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none"
         />
       </div>}
 
@@ -241,8 +241,8 @@ export default function LogbuchForm({ kuppel, currentUserBeo, editEntry, onSaved
         <textarea
           value={bemerkungen}
           onChange={(e) => setBemerkungen(e.target.value.slice(0, 500))}
-          rows={3}
-          className="w-full px-3 py-3 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none resize-y"
+          rows={2}
+          className="w-full px-3 py-2 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none resize-y"
           placeholder="Freier Text (max. 500 Zeichen)"
         />
       </div>
@@ -275,7 +275,7 @@ export default function LogbuchForm({ kuppel, currentUserBeo, editEntry, onSaved
         <button
           type="submit"
           disabled={saving}
-          className="w-full sm:w-auto px-6 py-3 bg-[#85B7D7] hover:bg-[#6a9fc5] text-black font-medium rounded-lg transition-colors disabled:opacity-50 text-base"
+          className="w-full sm:w-auto px-6 py-2 bg-[#85B7D7] hover:bg-[#6a9fc5] text-black font-medium rounded-lg transition-colors disabled:opacity-50 text-base"
         >
           {saving ? 'Speichern...' : editEntry ? 'Änderungen speichern' : 'Eintrag speichern'}
         </button>
@@ -283,7 +283,7 @@ export default function LogbuchForm({ kuppel, currentUserBeo, editEntry, onSaved
           <button
             type="button"
             onClick={onSaved}
-            className="w-full sm:w-auto px-6 py-3 bg-gray-200 hover:bg-gray-300 text-gray-700 font-medium rounded-lg transition-colors text-base"
+            className="w-full sm:w-auto px-6 py-2 bg-gray-200 hover:bg-gray-300 text-gray-700 font-medium rounded-lg transition-colors text-base"
           >
             Abbrechen
           </button>

components/ObjektSelector.tsx

@@ -49,7 +49,7 @@ export default function ObjektSelector({ selected, onChange }: Props) {
         {selected.map((o) => (
           <span
             key={o.Name}
-            className="inline-flex items-center gap-2 bg-green-100 text-green-800 text-base px-3 py-2 rounded-full"
+            className="inline-flex items-center gap-2 bg-green-100 text-green-800 text-base px-3 py-1.5 rounded-full"
           >
             {o.Name}
             <button
@@ -78,7 +78,7 @@ export default function ObjektSelector({ selected, onChange }: Props) {
         <button
           type="button"
           onClick={() => setShowNewInput((v) => !v)}
-          className="px-4 py-3 border-2 border-gray-400 rounded-lg bg-white text-base text-gray-700 hover:bg-gray-50 whitespace-nowrap"
+          className="px-4 py-2 border-2 border-gray-400 rounded-lg bg-white text-base text-gray-700 hover:bg-gray-50 whitespace-nowrap"
         >
           + Neu
         </button>
@@ -92,20 +92,20 @@ export default function ObjektSelector({ selected, onChange }: Props) {
             onChange={(e) => setNewName(e.target.value)}
             onKeyDown={(e) => { if (e.key === 'Enter') { e.preventDefault(); addNew(); } }}
             placeholder="Objektname eingeben"
-            className="flex-1 px-3 py-3 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none"
+            className="flex-1 px-3 py-2 border-2 border-gray-400 rounded-lg bg-white text-base focus:border-blue-500 focus:outline-none"
             autoFocus
           />
           <button
             type="button"
             onClick={addNew}
-            className="px-4 py-3 bg-green-600 text-white text-base rounded-lg hover:bg-green-700"
+            className="px-4 py-2 bg-green-600 text-white text-base rounded-lg hover:bg-green-700"
           >
             OK
           </button>
           <button
             type="button"
             onClick={() => { setShowNewInput(false); setNewName(''); }}
-            className="px-4 py-3 bg-gray-200 text-gray-700 text-base rounded-lg hover:bg-gray-300"
+            className="px-4 py-2 bg-gray-200 text-gray-700 text-base rounded-lg hover:bg-gray-300"
           >
             ✕
           </button>