Skip to content

Refine builder chrome to match dashboard styling#17

Draft
Copilot wants to merge 1 commit into
mainfrom
copilot/redesign-navbar-and-sidebars
Draft

Refine builder chrome to match dashboard styling#17
Copilot wants to merge 1 commit into
mainfrom
copilot/redesign-navbar-and-sidebars

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 25, 2026

Builder sidebars/nav were visually off-brand versus the dashboard, command palette, and shortcuts menu; their chrome needed to align with the shared “film” aesthetic without changing behavior.

  • Navbar refresh
    • Glassy film-gradient shell, accent glow bar, refined separators
    • Toolbar buttons rebuilt with blurred plates, amber focus rings, richer active/hover states while preserving commands (palette, shortcuts, sidebars, fullscreen, undo/redo, reset, GitHub)
  • Sidebar shell overhaul
    • SidebarLayout now uses layered gradients, subtle noise/glow, inset borders, and softened scroll area to match modal/palette styling
    • Layer panel and Inspector headers restyled with amber-lined toggles and elevated pills; logic and tabs unchanged
    • Sidebars adopt transparent chrome (borders handled by inner shells) for cohesive framing with canvas

Example snippet (new sidebar shell):

<SidebarLayout
  header={<div className="rounded-xl p-0.5" style={{ background: 'linear-gradient(120deg, rgba(196,124,46,0.08), rgba(18,16,13,0.9))', border: '1px solid rgba(196,124,46,0.15)' }}>
    {/* tab buttons */}
  </div>}
>
  {/* panel body */}
</SidebarLayout>

Co-authored-by: ikrdikhit <155148519+ikrdikhit@users.noreply.github.com>
Agent-Logs-Url: https://github.com/a5sh/freeposterapi/sessions/09c2a939-189a-43ce-b01c-5027b6e878c5
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.

2 participants