Small layout adjustments and form errors in partial outsourced

app/views/categories/_form.html.erb

@@ -1,41 +1,24 @@
-<%= form_with(model: category, class: "space-y-6 max-w-2xl mx-auto bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8") do |form| %>
+<!-- app/views/categories/_form.html.erb -->
+<%= form_with(model: category, class: "space-y-6") do |form| %>
   
-  <% if category.errors.any? %>
-    <div class="p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 border border-red-200" role="alert">
-      <h2 class="font-bold mb-1"><%= pluralize(category.errors.count, "Fehler") %> verhinderten das Speichern:</h2>
-      <ul class="list-disc list-inside text-xs">
-        <% category.errors.full_messages.each do |message| %>
-          <li><%= message %></li>
-        <% end %>
-      </ul>
-    </div>
-  <% end %>
+  <%= render "layouts/form_errors", model: category %>
 
-  <div>
-    <h2 class="text-xl font-bold text-gray-800">Kategorie-Details</h2>
-    <p class="text-sm text-gray-500 mt-1">Definiere eine übergeordnete Gruppe für dein Inventar (z.B. Laptops oder Bürostühle).</p>
-  </div>
-
-  <hr class="border-gray-200">
-
-  <!-- Name -->
-  <div>
-    <%= form.label :name, "Name der Kategorie", class: "block text-sm font-medium mb-2 text-gray-700" %>
-    <%= form.text_field :name, required: true, class: "py-2.5 px-4 block w-full border border-gray-300 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 bg-gray-50/50", placeholder: "z.B. IT-Infrastruktur" %>
+  <!-- KATEGORIENAME INPUT -->
+  <div class="space-y-1.5">
+    <%= form.label :name, "Kategoriebezeichnung", class: "block text-sm font-semibold text-gray-700" %>
+    <%= form.text_field :name, placeholder: "z.B. Laptops, Monitore, Server...", class: "py-2.5 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50 focus:border-blue-500 focus:ring-blue-500" %>
   </div>
 
   <!-- Beschreibung -->
-  <div>
-    <%= form.label :description, "Beschreibung / Notizen", class: "block text-sm font-medium mb-2 text-gray-700" %>
+  <div class="space-y-1.5">
+    <%= form.label :description, "Beschreibung / Notizen", class: "block text-sm font-semibold text-gray-700" %>
     <%= form.text_area :description, rows: 4, class: "py-2.5 px-4 block w-full border border-gray-300 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 bg-gray-50/50", placeholder: "Welche Art von Gegenständen fällt in diese Kategorie?..." %>
   </div>
 
-  <hr class="border-gray-200">
-
-  <!-- Buttons -->
-  <div class="flex justify-end gap-x-3">
-    <%= link_to "Abbrechen", categories_path, class: "py-2.5 px-4 inline-flex items-center text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition shadow-sm" %>
-    <%= form.submit "Kategorie speichern", class: "py-2.5 px-4 inline-flex items-center text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 shadow-sm transition cursor-pointer" %>
+  <!-- AKTIONEN (Speichern & Abbrechen) -->
+  <div class="flex items-center justify-end gap-3 pt-4 border-t border-gray-100">
+    <%= link_to "Abbrechen", categories_path, class: "py-2 px-4 text-sm font-semibold rounded-lg border border-gray-200 bg-white text-gray-700 hover:bg-gray-50 transition" %>
+    <%= form.submit "Kategorie speichern", class: "py-2 px-4 text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 shadow-sm transition cursor-pointer" %>
   </div>
 
 <% end %>

app/views/categories/index.html.erb

@@ -1,4 +1,16 @@
-<% content_for :title, "Kategorien & Typen" %>
+<% content_for :title, "Kategorien" %>
+
+<!-- NEU: Fügt den Hinzufügen-Button oben rechts in die Hauptleiste ein -->
+<% content_for :top_bar_actions do %>
+  <%= link_to new_category_path, class: "py-2 px-4 text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 flex items-center gap-1.5 shadow-sm transition" do %>
+    <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+      <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+    </svg>
+    <div class="hidden md:inline">
+      Kategorie anlegen
+    </div>
+  <% end %>
+<% end %>
 
 <div class="space-y-6">
   

app/views/categories/new.html.erb

@@ -1,5 +1,30 @@
-<% content_for :title, "Neue Kategorie erstellen" %>
+<% content_for :title, "Kategorien anlegen" %>
+
+<% content_for :top_bar_actions do %>
+  <%= link_to rooms_path, class: "py-2 px-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center gap-1.5 shadow-sm transition" do %>
+    <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" /></svg>
+    <div class="hidden md:inline">
+      Zurück zur Übersicht
+    </div>
+  <% end %>
+<% end %>
+
+<div class="max-w-xl mx-auto mt-4">
+  <div class="bg-white border border-gray-200 rounded-xl shadow-sm p-4 md:p-6">
+    
+    <div class="flex items-center gap-3 mb-6 pb-4 border-b border-gray-100 text-gray-500">
+      <div class="p-2 bg-blue-50 text-blue-600 rounded-lg border border-blue-100">
+        <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+        </svg>
+      </div>
+      <div>
+        <h3 class="font-bold text-gray-900 text-base">Kategorie erstellen</h3>
+        <p class="text-xs text-gray-400">Definiere einen neuen Hardware-Typ für deine Bestandsliste.</p>
+      </div>
+    </div>
 
-<div class="p-4 md:p-6">
     <%= render "form", category: @category %>
+
+  </div>
 </div>

app/views/items/_form.html.erb

@@ -1,15 +1,6 @@
 <%= form_with(model: item, class: "space-y-6 max-w-2xl mx-auto bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8") do |form| %>
 
-  <% if item.errors.any? %>
-    <div class="p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 border border-red-200" role="alert">
-      <h2 class="font-bold mb-1"><%= pluralize(item.errors.count, "Fehler") %> verhinderten das Speichern:</h2>
-      <ul class="list-disc list-inside text-xs">
-        <% item.errors.each do |error| %>
-          <li><%= error.full_message %></li>
-        <% end %>
-      </ul>
-    </div>
-  <% end %>
+  <%= render "layouts/form_errors", model: item %>
 
   <div>
     <h2 class="text-xl font-bold text-gray-800">

app/views/items/index.html.erb

@@ -4,7 +4,9 @@
 <% content_for :top_bar_actions do %>
   <%= link_to new_item_path, class: "py-2 px-4 text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 flex items-center gap-1.5 shadow-sm transition" do %>
     <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" /></svg>
-    Artikel hinzufügen
+    <div class="hidden md:inline">
+      Artikel anlegen
+    </div>
   <% end %>
 <% end %>
 

app/views/items/show.html.erb

@@ -1,20 +1,3 @@
-<!--<%# content_for :title, "Showing item" %>
-
-<div class="md:w-2/3 w-full">
-  <% if notice.present? %>
-    <p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-md inline-block" id="notice"><%= notice %></p>
-  <% end %>
-
-  <h1 class="font-bold text-4xl">Showing item</h1>
-
-  <%#= render @item %>
-
-  <%= link_to "Edit this item", edit_item_path(@item), class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-  <%= link_to "Back to items", items_path, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-  <%= button_to "Destroy this item", @item, method: :delete, form_class: "sm:inline-block mt-2 sm:mt-0 sm:ml-2", class: "w-full rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
-</div>
--->
-
 <% content_for :title, "Artikel-Details" %>
 
 <!-- OBERE AKTIONSLISTE (Yield im Top-Bar deines Hauptlayouts) -->

app/views/layouts/_form_errors.html.erb

@@ -0,0 +1,18 @@
+<% if model.errors.any? %>
+  <div class="p-4 bg-red-50 border border-red-200 rounded-xl flex gap-3 text-sm text-red-800 shadow-sm animate-fade-in">
+    <!-- Heroicon: exclamation-triangle -->
+    <svg class="h-5 w-5 text-red-600 shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+      <path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z" />
+    </svg>
+    <div>
+      <h4 class="font-bold">
+        <%= model.class.model_name.human %> konnte nicht gespeichert werden
+      </h4>
+      <ul class="list-disc list-inside mt-1 space-y-0.5 text-xs text-red-700">
+        <% model.errors.full_messages.each do |message| %>
+          <li><%= message %></li>
+        <% end %>
+      </ul>
+    </div>
+  </div>
+<% end %>

app/views/rooms/_form.html.erb

@@ -1,15 +1,6 @@
 <%= form_with(model: room, class: "space-y-6 max-w-xl mx-auto bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8") do |form| %>
 
-  <% if room.errors.any? %>
-    <div class="p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 border border-red-200" role="alert">
-      <h2 class="font-bold mb-1"><%= pluralize(room.errors.count, "Fehler") %> verhinderten das Speichern:</h2>
-      <ul class="list-disc list-inside text-xs">
-        <% room.errors.each do |error| %>
-          <li><%= error.full_message %></li>
-        <% end %>
-      </ul>
-    </div>
-  <% end %>
+  <%= render "layouts/form_errors", model: room %>
 
   <div>
     <h2 class="text-xl font-bold text-gray-800">

app/views/rooms/index.html.erb

@@ -8,7 +8,9 @@
     <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
       <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
     </svg>
+    <div class="hidden md:inline">
       Raum anlegen
+    </div>
   <% end %>
 <% end %>
 

app/views/rooms/new.html.erb

@@ -1,9 +1,11 @@
-<% content_for :title, "Neuen Raum hinzufügen" %>
+<% content_for :title, "Raum anlegen" %>
 
 <% content_for :top_bar_actions do %>
   <%= link_to rooms_path, class: "py-2 px-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center gap-1.5 shadow-sm transition" do %>
     <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" /></svg>
+    <div class="hidden md:inline">
       Zurück zur Übersicht
+    </div>
   <% end %>
 <% end %>