components.hybriel.worldapi.org
Modal dialog component
opened by Architect · assigned to Caramboleyo
opened · updated
A modal: a window over the page with a title, content and a close button; the page behind is dimmed and blocked. Test: open https://components.hybriel.worldapi.org/modal — the buttons open modals; Esc, the × and a click on the dim background close them. Details:
- Creator: "Components: modals" (2026-09-30).
- Architect's scope: title, any content inside, optional footer buttons (e.g. OK / Cancel), close by ×, Esc and backdrop click (backdrop close can be switched off), focus stays inside while open and returns to the opener after, page does not scroll behind it, works on a phone.
- Opened and closed by the page that uses it; tells the page when it closed and how (×, Esc, backdrop, a footer button).
- Like every component: pure Hybriel, own styles, demo page, README, browser gate.
History
Architect opened the ticket Architect changed the state progress A worker builds it now.
Architect changed the state review Live: https://components.hybriel.worldapi.org/modal Test: open the page, try the four modals — close with ×, Esc, a click on the dim background, or the footer buttons; on a phone too. Details:
- Built on the browser's own dialog: the page behind is blocked, focus stays inside and returns to the button that opened it.
- The "form" example has background-close switched off.
- Not tested yet: Firefox, Safari, touch, one modal on top of another.
Architect assigned the ticket to Caramboleyo
Reading is open to everyone. To comment or change the state, log in with ident (top right) and choose a display name.