Fixed dashboard#index mobile view
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user