Ateração da autura dos icones
This commit is contained in:
@@ -18,7 +18,7 @@
|
||||
<div class="bg-[#1a1a1a] rounded-2xl border border-white/5 p-6">
|
||||
<div class="flex flex-wrap items-center justify-between gap-3 mb-4">
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold text-white flex items-center gap-2"><%= icone :planilha %> Planilha da operação</h2>
|
||||
<h2 class="text-lg font-semibold text-white flex items-center gap-2"><%= icone :planilha, espaco: false %> Planilha da operação</h2>
|
||||
<p class="text-gray-400 text-sm">Espelho por NF — pesquise por nota, motorista, unidade, ocorrência, veículo...</p>
|
||||
</div>
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<input type="hidden" name="<%= k %>" value="<%= v %>">
|
||||
<% end %>
|
||||
<div class="relative">
|
||||
<span class="pointer-events-none absolute left-3 top-1/2 -translate-y-1/2"><%= icone :buscar, cor: 'text-gray-500' %></span>
|
||||
<span class="pointer-events-none absolute left-3 top-1/2 -translate-y-1/2"><%= icone :buscar, cor: 'text-gray-500', espaco: false %></span>
|
||||
<input type="search" name="q" value="<%= @busca %>" placeholder="Pesquisar..."
|
||||
class="pl-9 pr-3 py-2 bg-[#0a0a0a] border border-white/10 rounded-xl text-white text-sm
|
||||
w-52 sm:w-72 focus:outline-none focus:border-orange-500 placeholder-gray-500">
|
||||
@@ -37,7 +37,7 @@
|
||||
Buscar
|
||||
</button>
|
||||
<% if @busca.present? %>
|
||||
<%= link_to rotulo(:fechar, 'Limpar', cor: nil, tamanho: 'w-3 h-3'), operacoes_planilha_path(request.query_parameters.except('q', 'pg')),
|
||||
<%= link_to rotulo(:fechar, 'Limpar', cor: nil, tamanho: 'w-3.5 h-3.5'), operacoes_planilha_path(request.query_parameters.except('q', 'pg')),
|
||||
data: { turbo: false }, class: 'text-xs text-orange-400 hover:text-orange-300 whitespace-nowrap' %>
|
||||
<% end %>
|
||||
</form>
|
||||
|
||||
@@ -12,12 +12,12 @@
|
||||
</div>
|
||||
<div class="map-toggle inline-flex rounded-lg overflow-hidden border border-white/10 text-xs">
|
||||
<button type="button" data-view="heat"
|
||||
class="px-3 py-1.5 bg-orange-500 text-black font-semibold"><%= icone :calor, cor: nil, tamanho: 'w-3.5 h-3.5' %> Calor</button>
|
||||
class="px-3 py-1.5 bg-orange-500 text-black font-semibold"><%= icone :calor, cor: nil, tamanho: 'w-4 h-4' %> Calor</button>
|
||||
<button type="button" data-view="pontos"
|
||||
class="px-3 py-1.5 text-gray-300 hover:text-white"><%= icone :local, cor: nil, tamanho: 'w-3.5 h-3.5' %> Pontos (<%= pontos.size %>)</button>
|
||||
class="px-3 py-1.5 text-gray-300 hover:text-white"><%= icone :local, cor: nil, tamanho: 'w-4 h-4' %> Pontos (<%= pontos.size %>)</button>
|
||||
</div>
|
||||
<button type="button" class="map-fullscreen px-3 py-1.5 rounded-lg border border-white/10 text-gray-300 hover:text-white text-xs" title="Ver em tela cheia">
|
||||
<%= icone :tela_cheia, cor: nil, tamanho: 'w-3.5 h-3.5' %> Tela cheia
|
||||
<%= icone :tela_cheia, cor: nil, tamanho: 'w-4 h-4' %> Tela cheia
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
<p class="text-gray-400 text-sm font-medium mb-1">Total de Entregas</p>
|
||||
<p class="text-6xl font-black text-white leading-none inline-block origin-left transition-transform duration-200 group-hover:scale-110"><%= metricas.total %></p>
|
||||
<p class="text-xs text-gray-500 mt-2 h-0 overflow-hidden opacity-0 transition-all duration-200 group-hover:h-4 group-hover:opacity-100">
|
||||
<%= icone :sucesso, cor: 'text-green-500', tamanho: 'w-3.5 h-3.5' %> <%= metricas.sucesso %> · <%= icone :ponto, cor: 'text-blue-500', tamanho: 'w-3.5 h-3.5' %> <%= metricas.recusas %> · <%= icone :parcial, cor: 'text-amber-400', tamanho: 'w-3.5 h-3.5' %> <%= metricas.pendentes %>
|
||||
<%= icone :sucesso, cor: 'text-green-500', tamanho: 'w-4 h-4' %> <%= metricas.sucesso %> · <%= icone :ponto, cor: 'text-blue-500', tamanho: 'w-4 h-4' %> <%= metricas.recusas %> · <%= icone :parcial, cor: 'text-amber-400', tamanho: 'w-4 h-4' %> <%= metricas.pendentes %>
|
||||
</p>
|
||||
</div>
|
||||
<div class="group bg-[#1a1a1a] rounded-2xl border border-white/5 p-7 transition-all duration-200 hover:border-green-500/40 hover:bg-[#202020] hover:-translate-y-0.5 hover:shadow-lg hover:shadow-black/40">
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
data: { turbo: false },
|
||||
title: (ativo ? 'Clique para remover o filtro' : "Filtrar por #{cel}"),
|
||||
class: "inline-flex items-center gap-1 hover:text-orange-400 #{'text-orange-400 font-semibold' if ativo}" do %>
|
||||
<%= cel %><% if ativo %> <%= icone :fechar, cor: nil, tamanho: 'w-3 h-3' %><% end %>
|
||||
<%= cel %><% if ativo %> <%= icone :fechar, cor: nil, tamanho: 'w-3.5 h-3.5' %><% end %>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= cel %>
|
||||
|
||||
@@ -69,7 +69,7 @@
|
||||
<% if @modo == 'global' %>
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
<div class="relative">
|
||||
<span class="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2"><%= icone :calendario %></span>
|
||||
<span class="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2"><%= icone :calendario, espaco: false %></span>
|
||||
<input type="text" id="periodo-range" readonly placeholder="Selecione o período"
|
||||
value="<%= @periodo_inicio.strftime('%d/%m/%Y') %> até <%= @periodo_fim.strftime('%d/%m/%Y') %>"
|
||||
class="cursor-pointer pl-4 pr-10 py-2.5 bg-[#1a1a1a] border border-white/10 rounded-xl
|
||||
@@ -125,7 +125,7 @@
|
||||
<% @chips.each do |chip| %>
|
||||
<span class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-orange-500/15 border border-orange-500/30 text-orange-300 text-xs">
|
||||
<%= chip[:rotulo] %>: <strong class="text-white"><%= chip[:display] || chip[:valor] %></strong>
|
||||
<%= link_to icone(:fechar, cor: nil, tamanho: 'w-3 h-3'), operacoes_dashboard_path(request.query_parameters.except(chip[:param])),
|
||||
<%= link_to icone(:fechar, cor: nil, tamanho: 'w-3.5 h-3.5'), operacoes_dashboard_path(request.query_parameters.except(chip[:param])),
|
||||
data: { turbo: false }, class: 'hover:text-white font-bold', title: 'Remover filtro' %>
|
||||
</span>
|
||||
<% end %>
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<%# ── Cabeçalho ─────────────────────────────────────────── %>
|
||||
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
|
||||
<div>
|
||||
<h1 class="text-2xl font-bold text-white flex items-center gap-2"><%= icone :planilha %> Planilha da Operação</h1>
|
||||
<h1 class="text-2xl font-bold text-white flex items-center gap-2"><%= icone :planilha, espaco: false %> Planilha da Operação</h1>
|
||||
<p class="text-gray-400 text-sm mt-0.5">
|
||||
<% if @modo == 'global' %>
|
||||
<%= icone :global %> Global · <%= @periodo_inicio.strftime('%d/%m/%Y') %> – <%= @periodo_fim.strftime('%d/%m/%Y') %>
|
||||
@@ -79,7 +79,7 @@
|
||||
<% @chips.each do |chip| %>
|
||||
<span class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-orange-500/15 border border-orange-500/30 text-orange-300 text-xs">
|
||||
<%= chip[:rotulo] %>: <strong class="text-white"><%= chip[:display] || chip[:valor] %></strong>
|
||||
<%= link_to icone(:fechar, cor: nil, tamanho: 'w-3 h-3'), operacoes_planilha_path(request.query_parameters.except(chip[:param], 'pg')),
|
||||
<%= link_to icone(:fechar, cor: nil, tamanho: 'w-3.5 h-3.5'), operacoes_planilha_path(request.query_parameters.except(chip[:param], 'pg')),
|
||||
data: { turbo: false }, class: 'hover:text-white font-bold', title: 'Remover filtro' %>
|
||||
</span>
|
||||
<% end %>
|
||||
|
||||
Reference in New Issue
Block a user