Parar o banner piscando sem estilo, fazer cartões inteiros recursos clicáveis

Fixkamo-marketing
Shipped
19 de agosto de 2026 às 03:43 UTC
Author
Kamo
Commit
646db37

PREVISÃO BANNER — seu CSS viveu em um `<style jsx>` bloco dentro do componente. No App Router styled-jsx não é servidor-render CSS para componentes do cliente, assim, o SSR HTML enviou a marca de banner (é o primeiro elemento em <body>) com nomes de classe correspondentes a nenhuma folha de estilo, e a tag <style> só apareceu uma vez O pacote JS correu. Confirmado contra a produção: zero inline <style> blocos em o HTML servido, e nenhuma das regras no pacote CSS também. As regras movem-se para globals.css, que é uma folha de estilo de renderização em <head>, então eles se aplicam na primeira pintura. O banner é posição: fixo e sua altura foi reservada apenas por um efeito escrever document.body.style.paddingTop, então conteúdo sentou-se sob ele até hidratação e depois saltou. Corpo { tampo: var(--banner-h, 38px)}` agora reserva- a da primeira pintura; o efeito ainda substitui a variável com a altura medida, que importa onde a cópia envolve em telas pequenas. CARTAS DE CARACTERÍSTICAS — a correção anterior usou um esticado ::after em z-index 1, mas o Os cartões <h3> e <p> carregam `relativo z-10`. Eles pintaram acima da sobreposição e engoliu o clique através da maioria do cartão, por isso ainda estava morto em todos os lugares Isso importava. Em vez de aumentar o índice z contra o conteúdo que legitimamente precisa sentar-se acima das camadas hover, a âncora agora envolve todo o cartão. Isso. é a semântica certa para um cartão que navega como um todo e lhe dá um tab stop em vez de dois; o "Saiba mais" interno reverte para uma marcação simples, uma vez que um link dentro de um link é inválido.

All changes

Como o que vês no transporte?

Cada uma dessas atualizações pousa automaticamente em seu espaço de trabalho. Comece grátis e veja crescer semana após semana.

Começar Livre Para SempreVer Preços