Appearance
Tailwind #54 — Shared helpers (notifications, modals, enum)
| Field | Value |
|---|---|
| GitLab | sourcecontrollers/safecall#54 |
| Parent | #52 |
| Roadmap | tailwind-roadmap.md |
| Depends on | #53 (closed) |
| Workflow | open |
Goal
Point shared web/lib UI helpers at the Tailwind component catalog: notifications, modal open/close, visibility (hidden), and replace BulmaNotification with a framework-neutral enum whose values are catalog class names. Feature-page Bulma markup stays until later steps.
Design principles
- Helpers emit catalog classes (
notification-success,btn,modal-backdrop) — not Bulmais-*strings as the long-term API. - During coexistence, accept legacy Bulma class inputs only if needed for a soft transition; prefer mapping inside the helper so call sites can migrate gradually.
- Soft/solid: never invent
is-light; use*-softcatalog variants. - Keep
data-themerules from #53.
Acceptance criteria
- [x]
BulmaNotificationrenamed (e.g.UiNotification) inlib/src/types/enums.ts; consumers updated; values map to catalog classes - [x] Notification show/hide helpers use catalog notification classes
- [x] Modal helpers use catalog modal/backdrop classes (Bulma aliases OK until #62 if documented)
- [x] Visibility helper prefers
.hidden;.is-hiddenalias allowed until #62 - [x] Shared class builders used across many pages updated (buttons/tags/notifications)
- [x] Lib + web typecheck; server typecheck if lib enum export changes affect it
Implementation notes
- Primary touch:
lib/src/types/enums.ts,web/src/lib/util.ts, notification/modal call sites (~40+ files may import the enum). - Prefer one mapping table in the helper so pages can pass semantic names.
- Do not rewrite full page templates here — only shared strings/helpers.
Out of scope
| Work | Issue |
|---|---|
| Navbar / login / settings templates | #55 |
| User / admin page bulk markup | #56–#61 |
| Remove Bulma | #62 |
Key paths
lib/src/types/enums.tsweb/src/lib/util.tsweb/src/lib/version-check.ts(if it builds HTML classes)- Grep:
BulmaNotification,is-hidden,notification,modal-background
Verification
cd lib && bun run typecheck;cd web && bun run typecheck;cd server && bun run typecheckif lib used by server.- Smoke: toast success/error; open/close a modal; element hide/show.
- Grep: no remaining
BulmaNotificationsymbol (unless deprecated re-export removed).
Done when / handoff
- Operator verifies → commit with
Closes #54→ pushgitlab. - Next: #55 shell + auth + settings.