Rende il CRM comodo da usare anche da cellulare.

Aggiunge navigazione mobile dedicata e trasforma le principali liste operative in layout più leggibili e facili da toccare.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/views/mailings/dashboard.html.erb

@@ -2,15 +2,15 @@
 <%= tag.div class: "space-y-6", data: (refresh ? { controller: "auto-reload", auto_reload_interval_value: 10_000 } : {}) do %>
   <div class="flex flex-wrap items-end justify-between gap-3">
     <div>
-      <h1 class="text-2xl font-semibold tracking-tight">Invii email</h1>
+      <h1 class="text-xl font-semibold tracking-tight md:text-2xl">Invii email</h1>
       <p class="mt-1 text-sm text-zinc-500">Stato delle campagne, prove e invii di massa scaglionati.</p>
     </div>
-    <div class="flex flex-wrap gap-2">
-      <%= link_to "Template", mail_templates_path, class: btn_secondary %>
+    <div class="flex w-full flex-wrap gap-2 sm:w-auto">
+      <%= link_to "Template", mail_templates_path, class: "#{btn_secondary} flex-1 sm:flex-none" %>
       <% if current_user.admin? %>
-        <%= link_to "Account SMTP", mail_identities_path, class: btn_secondary %>
+        <%= link_to "Account SMTP", mail_identities_path, class: "#{btn_secondary} flex-1 sm:flex-none" %>
       <% end %>
-      <%= link_to "Nuovo invio", new_mailing_path, class: btn_primary %>
+      <%= link_to "Nuovo invio", new_mailing_path, class: "#{btn_primary} flex-1 sm:flex-none" %>
     </div>
   </div>
 
@@ -25,7 +25,7 @@
     </div>
   <% end %>
 
-  <div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
+  <div class="grid grid-cols-2 gap-3 xl:grid-cols-4">
     <div class="<%= card_class %> p-4">
       <div class="text-xs uppercase tracking-wide text-zinc-500">In corso</div>
       <div class="mt-1 text-2xl font-semibold tabular-nums"><%= @active_mailings.size %></div>
@@ -56,11 +56,33 @@
     </section>
   <% end %>
 
-  <div class="overflow-hidden <%= card_class %>">
+  <div class="<%= card_class %>">
     <% if @mailings.empty? %>
       <p class="p-6 text-sm text-zinc-500">Nessun invio. Crea una bozza, fai una prova con dati manuali e poi autorizza l’invio di massa.</p>
     <% else %>
-      <table class="<%= table_class %>">
+      <div class="divide-y divide-zinc-100 dark:divide-zinc-800 md:hidden">
+        <% @mailings.each do |mailing| %>
+          <%= link_to mailing, class: "block p-4 active:bg-zinc-50 dark:active:bg-zinc-800" do %>
+            <div class="flex items-start justify-between gap-3">
+              <div class="min-w-0">
+                <div class="font-semibold"><%= mailing.name %></div>
+                <div class="mt-0.5 text-xs text-zinc-500 break-anywhere"><%= mailing.mail_identity.from_email %></div>
+              </div>
+              <%= mailing_status_badge(mailing.status) %>
+            </div>
+            <div class="mt-3"><%= progress_bar(mailing.progress_percentage) %></div>
+            <div class="mt-2 text-xs text-zinc-500">
+              <%= mailing.sent_count %> inviate · <%= mailing.pending_count %> in coda
+              <% if mailing.sending? && mailing.next_send_at.present? && mailing.next_send_at > Time.current %>
+                · Riparte <%= l(mailing.next_send_at, format: :short) %>
+              <% end %>
+            </div>
+          <% end %>
+        <% end %>
+      </div>
+      <div class="hidden md:block">
+        <div class="<%= table_wrap_class %>">
+          <table class="<%= table_class %>">
         <thead class="border-b border-zinc-100 bg-zinc-50 text-left text-xs font-medium uppercase tracking-wide text-zinc-500 dark:border-zinc-800 dark:bg-zinc-800 dark:text-zinc-400">
           <tr>
             <th class="px-4 py-3">Invio</th>
@@ -107,7 +129,9 @@
             </tr>
           <% end %>
         </tbody>
-      </table>
+          </table>
+        </div>
+      </div>
     <% end %>
   </div>
 <% end %>