- Spegnimento
- 5 settembre 2026 alle ore 18:05 UTC
- Autore
- Kamo
- Impegno
- 4a6ad5b
Ogni percorso ora rende all'interno .kamo-pane: una scheda inset 15px dal browser bordo con un raggio di 14px, un'ombra morbida e troppo pieno: nascosto, quindi una pagina è propria il contenuto è clipped al rettangolo arrotondato. Il pannello porta anche un translateZ(0), che è ciò che lo rende il blocco contenente per `posizione: fisso` discendenti — senza di esso la pillola Powered-by e lo sfondo Capcha ancora a il viewport e sfuggire completamente alla clip, che è esattamente il caso è stato chiesto il ritaglio. Il nastro "Welcome Back!" è tre strati intorno a quel pannello, ordinato all'interno .kamo-shell: le code più scure dietro di esso, il pannello, poi la banda rossa davanti. La banda è ruotata di 45 gradi in senso orario sulla diagonale dell'angolo in alto a destra e clipped da una scatola ancorata 8px all'esterno di quell'angolo, in modo da sporge la parte superiore e bordi a destra esattamente 8px, tagliare il filo con il gap. Il taglio a filo non è una scorciatoia, è l'unico modo per colpire 8px. Un gruppo con le estremità quadrate perpendicolari a se stessa non possono sporgere un bordo da meno della sua proprio spessore su radice due — 24px a una banda di 34px leggibile, molto più di un 15px gap ha spazio per. Tagliando le estremità parallele ai bordi incrociati decouples lo strapiombo dallo spessore della band, e dà entrambi i bordi lo stesso 8px. Le code iniziano la larghezza di una band dall'angolo in modo che le loro estremità vicine finiscano sotto di esso, correre lungo ogni bordo attraverso il gap, e sono poi inghiottiti da il pannello. Solo --ribbon-over dello spessore di ogni coda sgombera mai il pannello, quindi la tacca di coda di rondine è tagliata dentro quella striscia; nulla più profondo non mostra mai. Ogni dimensione è una proprietà personalizzata su :root, e l'intero assemblaggio scale sotto i 640px. Ogni percorso si è dimensionato sul viewport, e così ha traboccato il nuovo pannello da 30px. Ogni radice ora riempie il pannello invece — 100% al posto di --app-dvh, 100dvh, 100vh e min-h-screen — e l'imbottitura di zona sicura si sposta fino alla fase, che è dove l'inizio è ora applicato. La tappa torna a 100 dvh per le rotte che non misurano visualViewport in --app-dvh stessi. Verificato in un browser a 1440x900 e 390x844: il pannello misura 15px da ogni bordo, la scatola di clip siede 8px fuori dall'angolo, entrambe le code atterrare dove la geometria prevede, e la pillola Powered-by è contenuta 16px all'interno del pannello piuttosto che il viewport.