- Shipped
- 19. August 2026 um 03:43 UTC
- Author
- Kamo
- Commit
- 646db37
PREVIEW BANNER - sein CSS lebte in einem "<style jsx"-Block innerhalb der Komponente. Im App Router verwendet Styled-jsx kein Server-Render-Cein-Cein für Client-Komponenten, so lieferte das SSR HTML den Banner-Markup (es ist das erste Element in <body>) mit Klassennamen, die zu keinem Stylesheet passen, und das <style"-Tag erschien nur einmal das JS-Bundle lief. Bestätigt gegen Produktion: Null inline <style"-Blöcke in die servierte HTML, und keine der Regeln in der CSS-Bundle entweder. Die Regeln bewegen sich zu globals.css, das ein Render-Blocking-Stylesheet in <head> ist, so dass sie sich bewerben auf die erste Farbe. Das Banner ist positioniert und seine Höhe wurde nur durch einen Effekt reserviert Schreiben document.body.style.paddingTop, so Inhalt saß darunter, bis Hydratation und dann gesprungen. Körper { Polsterung-Top: var(--banner-h, 38px) . reserviert es von der ersten Farbe; der Effekt überschreibt noch die Variable mit die gemessene Höhe, die zählt, wo die Kopie auf kleine Bildschirme gewickelt. FEATURE CARDS - der vorherige Fix verwendet ein gestrecktes ::after bei z-index 1, aber die Karte <h3" und <p" tragen "relative z-10" . Sie malten über dem Overlay und schluckte den Klick über die meisten der Karte, so war es immer noch überall tot das war wichtig. Anstatt z-Index gegen Inhalte zu eskalieren, die legitim muss über den Schwebeschichten sitzen, der Anker wickelt nun die gesamte Karte ein. Das ist die richtige Semantik für eine Karte, die als Ganzes navigiert und gibt es eine tab stoppen statt zwei; das innere "Lernen mehr" kehrt zu schlichtem Markup zurück, da ein Link innerhalb eines Links ist ungültig.