Catalog widget styling: styled_module!, merge_attributes, auth utility CSS
Catalog widget styling: styled_module!, merge_attributes, auth utility CSS
#23 in Riparion/arium — merged 2026-06-01
Summary
Three independent threads, bundled because they all surfaced while chasing the "catalog widgets render unstyled" symptom in a downstream consumer:
styled_module!macro +merge_attributesadoption across catalog widgets. The const-asset/css-module declaration was duplicated in every widget, and several widgets (Card,Input,Label,Badge,Pagination,AlertDialog,Checkbox) emitted twoclass=attributes when a caller passedclass:. The HTML parser silently dropped one, so caller-supplied utility classes vanished. The macro collapses the duplicated declaration;merge_attributesguarantees exactly one composed class attribute.auth_utility.cssfor global.auth-form/.auth-field/.auth-label/.auth-error/.auth-success/.auth-submitrules. These class names are referenced as literal strings throughout the auth + admin screens (AccountSettings,AuditLog, password-reset, MFA, tokens) but no CSS file defined them. Result: orphan classes, default block flow, broken vertical spacing on every page that used them. Added in botharium-dioxus(pinned viaAuthStylesheets) andarium-leptos(added to theinclude_str!bundle inauth_stylesheets::bundle()).MfaSetupembedded mode keeps card chrome, drops the dead back-link. The previousembedded: truepath inlinedborder:none;box-shadow:none;background:none;onto its innerCard— fine when MFA was nested inside anotherCard, broken when it was a sibling panel (the common case on account screens). Narrowsembeddedto "skip the centering shell"; keeps the card chrome; removes the redundant "Back to account" link that pointed to the screen the embedded user was already on.
Test plan
- Local
dx servein a downstream consumer that mountsAccountSettingsandMfaSetup { embedded: true }as siblings: confirm the Account-settings card and the Two-factor-auth card both render with border + background, no card-in-a-card nesting, vertical spacing between sections, and no broken "Back to account" link. -
cargo clippy -p arium-dioxus --features ui,mfa -- -D warnings -A clippy::too_many_arguments(clean locally). -
cargo clippy -p arium-leptos --features ui,mfa(clean locally). - Confirm a
LoginPanelinstance with a caller-suppliedclass:prop renders a single composedclass=attribute in SSR HTML.
🤖 Generated with Claude Code
Last updated 2026-06-02
Links to this note
Credits
Merged pull requests, newest first.