Correção de responsividade

This commit is contained in:
2026-07-22 01:21:32 -03:00
parent dc1b5c1b41
commit 3dbb65efd2
3 changed files with 44 additions and 27 deletions

View File

@@ -24,19 +24,21 @@
<%# basis-40: o nome não pode ser espremido até virar "P…" — se não couber
com o resto, a linha quebra em vez de esmagar a identificação. %>
<div class="min-w-0 flex-1 basis-40">
<h1 class="text-lg lg:text-xl font-bold text-white flex items-center gap-2 truncate"><%= icone :caminhao, espaco: false %> <%= @motorista %></h1>
<p class="text-gray-400 text-xs truncate"><%= @consolidacao.nome %> · <%= l @consolidacao.data_inicio, format: :short %> → <%= l @consolidacao.data_fim, format: :short %></p>
<h1 class="text-xl lg:text-2xl font-bold text-white flex items-center gap-2 truncate"><%= icone :caminhao, espaco: false %> <%= @motorista %></h1>
<p class="text-gray-400 text-sm truncate"><%= @consolidacao.nome %> · <%= l @consolidacao.data_inicio, format: :short %> → <%= l @consolidacao.data_fim, format: :short %></p>
</div>
<%# Progresso ao lado do título (em vez de um card de 70px só p/ ele). No
celular vai para uma linha própria, no fim, para não brigar pelo espaço. %>
<p class="order-last w-full text-left sm:order-none sm:w-auto sm:shrink-0 sm:text-right text-xs text-gray-300">
<% if @veiculos_sel.any? %><%= icone :caminhao %> <%= @veiculos_sel.join(', ') %> — <% end %>
<span data-validacao-target="contadorClassificadas"><%= @classificadas %></span>/<span data-validacao-target="contadorTotal"><%= @total_entregas %></span>
<span class="hidden sm:inline">classificadas</span>
celular vai para uma linha própria, no fim, para não brigar pelo espaço.
Números em branco/negrito: esta é a informação que o ADM confere o tempo
todo enquanto classifica — compactar não pode custar a leitura dela. %>
<p class="order-last w-full text-left sm:order-none sm:w-auto sm:shrink-0 sm:text-right text-sm text-gray-400">
<% if @veiculos_sel.any? %><span class="text-gray-300"><%= icone :caminhao %> <%= @veiculos_sel.join(', ') %></span> — <% end %>
<span class="text-white font-semibold"><span data-validacao-target="contadorClassificadas"><%= @classificadas %></span>/<span data-validacao-target="contadorTotal"><%= @total_entregas %></span></span>
classificadas
<span data-validacao-target="manuaisInfo" class="<%= 'hidden' unless @manuais.positive? %> text-blue-400">·
+<span data-validacao-target="contadorManuais"><%= @manuais %></span> manuais</span>
<span class="text-orange-500 font-bold ml-1" data-validacao-target="percentual"></span>
<span class="text-orange-500 font-bold ml-1 text-base" data-validacao-target="percentual"></span>
</p>
<%= link_to revisar_consolidacao_consolidacao_entregas_path(@consolidacao, motorista: @motorista),
@@ -46,9 +48,9 @@
</div>
<%# Barra com 2 segmentos: laranja = elegíveis classificadas · azul = manuais %>
<div class="w-full bg-[#0a0a0a] rounded-full h-1.5 flex overflow-hidden mb-2">
<div data-validacao-target="barra" class="h-1.5 bg-orange-500 transition-all duration-300" style="width: 0%"></div>
<div data-validacao-target="barraManuais" class="h-1.5 bg-blue-500 transition-all duration-300" style="width: 0%"></div>
<div class="w-full bg-[#0a0a0a] rounded-full h-2 flex overflow-hidden mb-2">
<div data-validacao-target="barra" class="h-2 bg-orange-500 transition-all duration-300" style="width: 0%"></div>
<div data-validacao-target="barraManuais" class="h-2 bg-blue-500 transition-all duration-300" style="width: 0%"></div>
</div>
<%# Fechar por veículo — filtra a tela por carro, mostra o estado (pronto/