- button.templ: Button(ButtonProps) renders <button type=...> with class from ui.ButtonClass(); Attrs spread for hx-* pass-through - button.css: .ui-button base + .ui-button-solid-default-md variant with non-nested :hover and :focus-visible (Codex concern #7) - card.templ: Card(attrs) accepts children via templ child syntax - card.css: slate-50 panel, slate-200 border - badge.templ: Badge(BadgeProps) renders <span class=...> - badge.css: info / success / danger variants (warning deferred)
28 lines
564 B
CSS
28 lines
564 B
CSS
/* badge.css — Phase 1 ships info / success / danger.
|
|
* `warning` is declared in variants.go for forward compatibility but has no
|
|
* CSS rule in Phase 1 — it lands when a page first needs it.
|
|
*/
|
|
|
|
.ui-badge {
|
|
display: inline-block;
|
|
padding: 0.125rem 0.5rem;
|
|
font-size: 0.75rem;
|
|
font-weight: 600;
|
|
border-radius: 0.25rem;
|
|
line-height: 1.25;
|
|
}
|
|
|
|
.ui-badge-info {
|
|
background-color: #dbeafe;
|
|
color: #1d4ed8;
|
|
}
|
|
|
|
.ui-badge-success {
|
|
background-color: #dcfce7;
|
|
color: #16a34a;
|
|
}
|
|
|
|
.ui-badge-danger {
|
|
background-color: #fee2e2;
|
|
color: #dc2626;
|
|
}
|