<%# Prévia do PDF em POP-UP, com navegação de veículo igual à do carrossel do motorista (setas grandes + contador "3 de 72"). ── POR QUE É CSS PURO E NÃO JAVASCRIPT ──────────────────────────────────── Abrir/fechar sai do `:target`: o botão é um link para `#previa` e o pop-up só aparece quando ele é o alvo da URL. As setas são links de verdade para `?veiculo=X#previa`, então trocar de folha mantém o pop-up aberto. Isso não é preciosismo: a prévia é a ÚNICA conferência antes de imprimir e já morreu três vezes junto com o JavaScript (assets 404 no servidor, com a tela abrindo normal e o botão sem reação). Do jeito atual ela funciona com o JS quebrado, sem JS, no celular, e continua endereçável — dá para mandar o link já com a prévia aberta. `loading="lazy"` no iframe: fechado, o pop-up é `display:none` e o navegador NÃO busca o PDF. É o que preserva a economia de não gerar um documento a cada carregamento da tela. <%# Controles no mesmo desenho do carrossel do motorista (redondos, 56px, próximo em laranja), mas como LINKS: cada folha é uma URL. Na ponta vira apagado em vez de sumir — botão que some muda o layout no meio da conferência e o operador perde o alvo do clique. %>
<% if anterior %> <%= link_to admin_romaneio_path(@romaneio, veiculo: anterior, anchor: 'previa'), 'aria-label': "Folha anterior (#{anterior})", class: 'w-14 h-14 rounded-full flex items-center justify-center bg-[#1a1a1a]/90 backdrop-blur border border-white/15 text-white hover:border-orange-500 transition-colors' do %> <%= icone :voltar, cor: nil, tamanho: 'w-6 h-6', espaco: false %> <% end %> <% else %> <%= icone :voltar, cor: nil, tamanho: 'w-6 h-6', espaco: false %> <% end %> <%= posicao ? posicao + 1 : 1 %> de <%= nomes.size %> · <%= @veiculo %> <% if proximo %> <%= link_to admin_romaneio_path(@romaneio, veiculo: proximo, anchor: 'previa'), 'aria-label': "Próxima folha (#{proximo})", class: 'w-14 h-14 rounded-full flex items-center justify-center bg-orange-500/90 backdrop-blur border border-orange-400 text-black hover:bg-orange-500 transition-colors' do %> <%= icone :avancar, cor: nil, tamanho: 'w-6 h-6', espaco: false %> <% end %> <% else %> <%= icone :avancar, cor: nil, tamanho: 'w-6 h-6', espaco: false %> <% end %>