Skip to content

CE: Extract dashboard inline styles and add 480px mobile breakpoint#282

Merged
ericflo merged 1 commit intomainfrom
ce/dashboard-inline-styles-cleanup
Apr 12, 2026
Merged

CE: Extract dashboard inline styles and add 480px mobile breakpoint#282
ericflo merged 1 commit intomainfrom
ce/dashboard-inline-styles-cleanup

Conversation

@ericflo
Copy link
Copy Markdown
Owner

@ericflo ericflo commented Apr 12, 2026

Summary

  • Extract inline style= attributes from JS-generated dashboard HTML into proper CSS classes
  • Add 480px mobile breakpoint for small phone screens on both subscriber and admin dashboards
  • Fix checkout error page inline margins with shared .back-link class
  • Replace skeleton loader inline widths with CSS utility classes (.skel-w-70, .skel-w-45, etc.)

Why

Dashboard is the most-used authenticated screen. Inline styles in JS strings prevent responsive adaptation and are inconsistent with the CSS-class approach used across all other overhauled screens.

Changes

  • dashboard.rs: New CSS classes for JS-injected elements (.relay-table, .relay-cta, .per-model-info, .relay-error, .provisioned-msg, .skel-wrap, skeleton width utils). 480px breakpoints for both subscriber and admin dashboards.
  • checkout.rs: Replace 6 instances of style="margin-top:16px;" with .back-link class.
  • templates.rs: Add .back-link utility class to shared page shell CSS.

@ericflo ericflo merged commit 20fba1f into main Apr 12, 2026
12 checks passed
@ericflo ericflo deleted the ce/dashboard-inline-styles-cleanup branch April 12, 2026 16:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant