victor/Reem-Notas
SHA256
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Correção de responsividade

Browse Source
This commit is contained in:
victor
2026-07-22 01:21:32 -03:00
parent dc1b5c1b41
commit 3dbb65efd2
3 changed files with 44 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
app/views/consolidacoes/index.html.erb
View File

@@ -71,28 +71,37 @@
</div>
<%# ── Filtros ──────────────────────────────────────────── %>
<%# Filtros em flex-wrap, NÃO em grade de 6 colunas fixas.
Motivo: os breakpoints do Tailwind (md:, lg:…) enxergam a JANELA, mas o
conteúdo perde 256px para a sidebar (`main.md:ml-64`). A mesma janela de
1280px tem duas larguras conforme o menu esteja aberto ou recolhido, então
`md:grid-cols-6` espremia os campos a ~150px e o texto do botão "Filtrar"
vazava para fora do fundo. Com flex-wrap + largura mínima, cada campo mantém
tamanho legível e a linha quebra sozinha conforme o espaço REAL. %>
<%= form_with url: consolidacoes_path, method: :get,
class: 'bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-6 grid grid-cols-1 md:grid-cols-6 gap-3' do |f| %>
class: 'bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-6 flex flex-wrap items-center gap-3' do |f| %>
<%= f.text_field :nome, value: params[:nome], placeholder: 'Buscar por nome…',
class: 'bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5 focus:border-orange-500 focus:outline-none' %>
class: 'flex-1 basis-48 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5 focus:border-orange-500 focus:outline-none' %>
<%= f.select :status,
options_for_select([['Todos os status', ''], ['Rascunho', 'rascunho'], ['Finalizada', 'finalizada']], params[:status]),
{}, class: 'bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
{}, class: 'flex-1 basis-40 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
<%= f.select :pagamento,
options_for_select([['Pagamento (todos)', ''], ['Pagas', 'pago'], ['Parciais', 'parcial'], ['Pendentes', 'pendente']], params[:pagamento]),
{}, class: 'bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
{}, class: 'flex-1 basis-44 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
<%= f.date_field :inicio, value: params[:inicio],
class: 'bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
class: 'flex-1 basis-36 max-w-[13rem] min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
<%= f.date_field :fim, value: params[:fim],
class: 'bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
class: 'flex-1 basis-36 max-w-[13rem] min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
<div class="flex gap-2">
<%= f.submit 'Filtrar', class: 'flex-1 bg-orange-500 hover:bg-orange-600 text-black font-bold rounded-lg cursor-pointer' %>
<%= link_to 'Limpar', consolidacoes_path, class: 'px-4 py-2.5 text-gray-400 hover:text-white border border-[#2a2a2a] rounded-lg' %>
<%# shrink-0 + whitespace-nowrap: os botões nunca são espremidos a ponto de
cortar o texto — se faltar espaço, a linha quebra e eles descem inteiros. %>
<div class="flex gap-2 shrink-0">
<%= f.submit 'Filtrar', class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold rounded-lg cursor-pointer px-5 py-2.5 whitespace-nowrap' %>
<%= link_to 'Limpar', consolidacoes_path, class: 'px-4 py-2.5 text-gray-400 hover:text-white border border-[#2a2a2a] rounded-lg whitespace-nowrap' %>
</div>
<% end %>