From 59c462506dd11c1523401b57bb0c5d5b6558c3fe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20B=C3=B6hm?= <spaceman78@gmx.de>
Date: Sun, 31 May 2026 01:09:53 +0200
Subject: [PATCH] Fixed dashboard#index mobile view

---
 app/views/dashboard/index.html.erb | 88 +++++++-----------------------
 app/views/items/show.html.erb      |  2 +-
 app/views/layouts/_badge.html.erb  | 44 ++++++++++-----
 3 files changed, 51 insertions(+), 83 deletions(-)

diff --git a/app/views/dashboard/index.html.erb b/app/views/dashboard/index.html.erb
index 0341a98..f5e46f4 100644
--- a/app/views/dashboard/index.html.erb
+++ b/app/views/dashboard/index.html.erb
@@ -65,7 +65,6 @@
   <!-- UNTERER BEREICH: BREITEN-OPTIMIERTE LISTEN (items-start verhindert vertikale Streckung) -->
   <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6 items-start">
     
-    <!-- SPALTE 1: ZULETZT HINZUGEFÜGTE ARTIKEL -->
     <div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden flex flex-col h-fit">
       <div class="px-5 py-4 border-b border-gray-200 bg-gray-50 flex items-center gap-2 shrink-0">
         <svg class="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
@@ -73,54 +72,32 @@
         </svg>
         <h3 class="font-bold text-gray-700 text-sm">Zuletzt hinzugefügt</h3>
       </div>
-      
       <div class="overflow-x-auto">
         <table class="min-w-full divide-y divide-gray-200 text-xs table-fixed">
           <tbody class="divide-y divide-gray-200 bg-white">
-            <% @recent_items.each.each do |item| %>
+            <% @recent_items.each do |item| %>
               <tr class="hover:bg-gray-50/50 transition">
                 <!-- KORREKTUR: max-w begrenzt die Breite, whitespace-normal erlaubt Zeilenumbruch -->
                 <td class="px-5 py-3.5 text-start align-middle max-w-[200px] sm:max-w-[250px]">
                   <div class="flex items-start gap-2.5">
                     <%= link_to item_path(item), class: "shrink-0 transition hover:scale-105 active:scale-95 block" do %>
-                      <span class="inline-flex items-center font-mono font-bold text-[10px] text-white bg-blue-600 px-1.5 py-0.5 rounded shadow-sm tracking-wider mt-0.5">
-                        #<%= item.sticker_id %>
-                      </span>
+                      <%= render "layouts/badge", type: :sticker, label: "##{item.sticker_id}" %> 
                     <% end %>        
                     <div class="min-w-0 whitespace-normal break-words">
-                      <%= link_to item_path(item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
-                        <%= item.name %>
+                      <% if item.present? %>
+                        <%= link_to item_path(item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
+                          <%= item.name %>
+                          <span class="block text-[10px] text-gray-400 mt-0.5"><%= item.category.name %></span>
+                        <% end %>
+                      <% else %>
+                        <span class="font-bold text-gray-400">Gelöschter Artikel</span>
                       <% end %>
-                      <span class="block text-[10px] text-gray-400 mt-0.5"><%= item.category.name %></span>
+                      <div class="mt-1">
+                        <%= render "layouts/badge", type: item.location_badge_type, label: item.location_badge_label(short_room: true) %>
+                      </div>
                     </div>
                   </div>
                 </td>
-                <td class="px-5 py-3.5 whitespace-nowrap align-middle shrink-0 w-32">
-                  <% if item.user.present? %>
-                    <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-green-50 text-green-800 px-2 py-0.5 rounded border border-green-200 shadow-sm">
-                      <svg class="h-3 w-3 text-green-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                        <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 1 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
-                      </svg>
-                      <%= item.user.name %>
-                    </span>
-                  <% elsif item.room.present? %>
-                    <%= link_to room_path item.room do %>
-                      <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-blue-50 text-blue-800 px-2 py-0.5 rounded border border-blue-200 shadow-sm">
-                        <svg class="h-3 w-3 text-blue-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                          <path stroke-linecap="round" stroke-linejoin="round" d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25s-7.5-4.108-7.5-11.25a7.5 7.5 0 1 1 15 0Z" />
-                        </svg>
-                        <%= item.room.name %>
-                      </span>
-                    <% end %>
-                  <% else %>
-                    <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-amber-50 text-amber-800 px-2 py-0.5 rounded border border-amber-200 shadow-sm">
-                      <svg class="h-3 w-3 text-amber-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                        <path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" />
-                      </svg>
-                      Hauptlager
-                    </span>
-                  <% end %>
-                </td>
                 <td class="px-5 py-3.5 whitespace-nowrap text-end text-gray-400 font-medium align-middle shrink-0 w-24">
                   <%= time_ago_in_words(item.created_at) %>
                 </td>
@@ -149,44 +126,19 @@
                 <td class="px-5 py-3.5 text-start align-middle max-w-[200px] sm:max-w-[250px]">
                   <div class="flex items-start gap-2.5">
                     <%= link_to item_path(log.item), class: "shrink-0 transition hover:scale-105 active:scale-95 block" do %>
-                      <span class="inline-flex items-center font-mono font-bold text-[10px] text-white bg-blue-600 px-1.5 py-0.5 rounded shadow-sm tracking-wider mt-0.5">
-                        #<%= log.item.sticker_id %>
-                      </span>
+                      <%= render "layouts/badge", type: :sticker, label: "##{log.item.sticker_id}" %> 
                     <% end %>        
-                  <div class="min-w-0 whitespace-normal break-words">
-                    <% if log.item.present? %>
-                      <%= link_to item_path(log.item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
-                        <%= log.item.name %>
-                      <% end %>
+                    <div class="min-w-0 whitespace-normal break-words">
+                      <% if log.item.present? %>
+                        <%= link_to item_path(log.item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
+                          <%= log.item.name %>
+                          <span class="block text-[10px] text-gray-400 mt-0.5"><%= log.item.category.name %></span>
+                        <% end %>
                       <% else %>
                         <span class="font-bold text-gray-400">Gelöschter Artikel</span>
                       <% end %>
-                      
                       <div class="mt-1">
-                        <% if log.user.present? %>
-                          <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-green-50 text-green-800 px-2 py-0.5 rounded border border-green-200 shadow-sm">
-                            <svg class="h-3 w-3 text-green-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                              <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 1 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
-                            </svg>
-                            <%= log.user.name %> zugewiesen
-                          </span>
-                        <% elsif log.room.present? %>
-                          <%= link_to room_path log.room do %>
-                            <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-blue-50 text-blue-800 px-2 py-0.5 rounded border border-blue-200 shadow-sm">
-                              <svg class="h-3 w-3 text-blue-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                                <path stroke-linecap="round" stroke-linejoin="round" d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25s-7.5-4.108-7.5-11.25a7.5 7.5 0 1 1 15 0Z" />
-                              </svg>
-                              In <%= log.room.name %> platziert
-                            </span>
-                          <% end %>
-                        <% else %>
-                          <span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-amber-50 text-amber-800 px-2 py-0.5 rounded border border-amber-200 shadow-sm">
-                            <svg class="h-3 w-3 text-amber-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                              <path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" />
-                            </svg>
-                            Hauptlager zurückgebracht
-                          </span>
-                        <% end %>
+                        <%= render "layouts/badge", type: log.item.location_badge_type, label: log.item.location_badge_label(short_room: true) %>
                       </div>
                     </div>
                   </div>
diff --git a/app/views/items/show.html.erb b/app/views/items/show.html.erb
index cc0675d..a12a710 100644
--- a/app/views/items/show.html.erb
+++ b/app/views/items/show.html.erb
@@ -3,7 +3,7 @@
 <!-- OBERE AKTIONSLISTE (Yield im Top-Bar deines Hauptlayouts) -->
 <% content_for :top_bar_actions do %>
   <div class="flex items-center gap-2">
-    <%= link_to items_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 %>
+    <%= link_to "javascript:history.back()", 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
diff --git a/app/views/layouts/_badge.html.erb b/app/views/layouts/_badge.html.erb
index 3921d28..dcfd0ac 100644
--- a/app/views/layouts/_badge.html.erb
+++ b/app/views/layouts/_badge.html.erb
@@ -9,7 +9,7 @@
   type = local_assigns[:type] || ""
   
   # 2. Icons als Strings definieren
-  icon_user = '<svg class="h-3.5 w-3.5 text-green-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" /></svg>'
+  icon_user = '<svg class="h-3.5 w-3.5 text-green-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 1 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" /></svg>'
   icon_room = '<svg class="h-3.5 w-3.5 text-blue-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25s-7.5-4.108-7.5-11.25a7.5 7.5 0 1 1 15 0Z" /></svg>'
   icon_storage = '<svg class="h-3.5 w-3.5 text-amber-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" /></svg>'
   icon_in_use = '<svg class="h-3.5 w-3.5 text-gray-400 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M7.5 21 3 16.5m0 0L7.5 12M3 16.5h13.5m0-13.5L21 7.5m0 0L16.5 12M21 7.5H7.5" /></svg>'
@@ -24,32 +24,47 @@
   # 3. Logik-Weiche für Farben, Standard-Icons und Standard-Labels
   case type.to_s
   when "storage"
-    css, computed_icon, computed_label = "bg-amber-50 text-amber-800 border-amber-200", icon_storage, "Hauptlager"
+    css = "bg-amber-50 text-amber-800 border-amber-200" if css.blank?
+    computed_icon, computed_label = icon_storage, "Hauptlager"
   when "user"
-    css, computed_icon, computed_label = "bg-green-50 text-green-800 border-green-200", icon_user, ""
+    css = "bg-green-50 text-green-800 border-green-200" if css.blank?
+    computed_icon, computed_label = icon_user, ""
   when "room"
-    css, computed_icon, computed_label = "bg-blue-50 text-blue-800 border-blue-200", icon_room, ""
+    css = "bg-blue-50 text-blue-800 border-blue-200" if css.blank?
+    computed_icon, computed_label = icon_room, ""
   when "in_use"
-    css, computed_icon, computed_label = "bg-gray-100 text-gray-600 border-gray-200", icon_in_use, "In Benutzung"
+    css = "bg-gray-100 text-gray-600 border-gray-200" if css.blank?
+    computed_icon, computed_label = icon_in_use, "In Benutzung"
   when "new_item"
-    css, computed_icon, computed_label = "bg-green-50 text-green-700 border-green-200", icon_new, Item.human_attribute_name("conditions.new_item")
+    css = "bg-green-50 text-green-700 border-green-200" if css.blank?
+    computed_icon, computed_label = icon_new, Item.human_attribute_name("conditions.new_item")
   when "as_new"
-    css, computed_icon, computed_label = "bg-emerald-50 text-emerald-700 border-emerald-200", icon_as_new, Item.human_attribute_name("conditions.as_new")
+    css = "bg-emerald-50 text-emerald-700 border-emerald-200" if css.blank?
+    computed_icon, computed_label = icon_as_new, Item.human_attribute_name("conditions.as_new")
   when "used"
-    css, computed_icon, computed_label = "bg-yellow-50 text-yellow-700 border-yellow-200", icon_used, Item.human_attribute_name("conditions.used")
+    css = "bg-yellow-50 text-yellow-700 border-yellow-200" if css.blank?
+    computed_icon, computed_label = icon_used, Item.human_attribute_name("conditions.used")
   when "heavily_used"
-    css, computed_icon, computed_label = "bg-orange-50 text-orange-700 border-orange-200", icon_heavy, Item.human_attribute_name("conditions.heavily_used")
+    css = "bg-orange-50 text-orange-700 border-orange-200" if css.blank?
+    computed_icon, computed_label = icon_heavy, Item.human_attribute_name("conditions.heavily_used")
   when "defective"
-    css, computed_icon, computed_label = "bg-red-50 text-red-700 border-red-200", icon_defective, Item.human_attribute_name("conditions.defective")
-    css += " animate-pulse font-bold"
+    css = "bg-red-50 text-red-700 border-red-200 animate-pulse font-bold" if css.blank?
+    computed_icon, computed_label = icon_defective, Item.human_attribute_name("conditions.defective")
   when "unknown"
-    css, computed_icon, computed_label = "bg-gray-50 text-gray-400 border-gray-100", icon_unknown, Item.human_attribute_name("conditions.unknown")
+    css = "bg-gray-50 text-gray-400 border-gray-100" if css.blank?
+    computed_icon, computed_label = icon_unknown, Item.human_attribute_name("conditions.unknown")
   when "category"
-    css, computed_icon, computed_label = "bg-blue-50 text-blue-800 border-blue-200", icon_category, ""
+    css = "bg-blue-50 text-blue-800 border-blue-200" if css.blank?
+    computed_icon, computed_label = icon_category, ""
+  when "sticker"
+    # Wenn von außen kein custom CSS kommt, brennen wir den sportlichen Sticker-Look direkt hier ein
+    css = "bg-blue-600 text-white border-blue-600 font-mono font-black tracking-wider uppercase py-0.5 px-1.5" if css.blank?
+    computed_icon, computed_label = "", ""
   end
 
   # 4. Optionale Variablen-Überlagerung von außen (Falls manuell übergeben)
   final_label = local_assigns[:label].presence || computed_label
+  
   final_icon = if local_assigns[:icon_svg].present?
                  local_assigns[:icon_svg]
                elsif local_assigns[:icon_type].present?
@@ -59,7 +74,8 @@
                end
 %>
 
-<span class="inline-flex items-center gap-1.5 py-1 px-2.5 rounded-md text-xs font-semibold shadow-sm border <%= css %> ">
+<!-- Der Haupt-Container bleibt extrem fokussiert und sauber -->
+<span class="inline-flex items-center gap-1.5 rounded-md text-xs font-semibold shadow-sm border py-1 px-2.5 <%= css %>">
   <%= final_icon if final_icon.present? %>
   <%= final_label %>
 </span>