Riqualificazione energetica del complesso condominiale di via Alessandro Manzoni
responsabile.progetto.esteso@azienda-edile-esempio.it
Responsive component contract
Un solo componente conserva DOM, semantica e feature mentre la composizione reagisce allo spazio realmente disponibile.
@qoovex/uiMatrice, non breakpoint
Le cinque larghezze sono checkpoint QA. Il componente live usa contenuto intrinseco e una sola query locale motivata dalla propria composizione.
320px390px768px1024px1440pxLa viewport non descrive il componente
Nella stessa viewport larga, il primo host resta stretto e impila le azioni; il secondo riceve spazio dentro una composizione più complessa e le allinea lateralmente.
Host stretto
Riqualificazione energetica del complesso condominiale di via Alessandro Manzoni
responsabile.progetto.esteso@azienda-edile-esempio.it
Riqualificazione energetica del complesso condominiale di via Alessandro Manzoni
responsabile.progetto.esteso@azienda-edile-esempio.it
Reflow e viewport mobili
Il valore lungo resta leggibile, le azioni non spariscono e gli inset condivisi proteggono la composizione. Lo scroll verticale resta disponibile con tastiera software.
Riqualificazione energetica del complesso condominiale di via Alessandro Manzoni
responsabile.progetto.esteso@azienda-edile-esempio.it
Reflow
320px equivale al reflow di 640px al 200%.
Viewport height
Intrinsic di default; dvh per dinamica, svh per stabilità.
Motion
Il resize normale non anima né nasconde feature.
Ordine decisionale
Intrinsic first
Min-width: 0, wrap e grid/flex intrinseci risolvono il contenuto prima di introdurre query.
Container owns composition
Una query locale reagisce allo spazio assegnato al componente, anche dentro una viewport ampia.
Viewport owns the shell
Media query e unità viewport restano per shell, fixed layer e comportamento realmente viewport-bound.
Behavior may use JS
matchMedia è ammesso quando cambia una state machine, non per sostituire una regola CSS.