Dark mode keeps a black canvas, paints cards at #121212, and tints the sidebar purple-black. Active navigation, secondary buttons, and the view switcher use brand purple; warning yellow stays for real warnings.
Co-authored-by: Andras Bacsai <andrasbacsai@users.noreply.github.com>
- Cards use a soft outer box with an inset well; empty states match
- Smaller sidebar icon tiles; sidebar and brand block use the canvas color with faint borders
- Darker inputs in the dark well; floating panels stay opaque
- Faint purple tint on dark surfaces, menus, and logs
- Cloudflare icon for Cloudflare Tunnel
- DESIGN.md: add a portable design language part
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Refresh application, database and volume backup lists on BackupCreated
- Refresh backup execution, edit and service resource views on
ServiceStatusChanged as well as ServiceChecked
- Hide the deployments counter when only the current page's application
is deploying, since its heading already shows "Deploying…"
- Show storage section shortcuts in the service configuration sidebar
- Drive server sidebar Sentinel/Security active state from activeMenu
and activeSubMenu instead of route matching
- Start the app sidebar expanded for new users
- Drop a column from the backup executions table grid and adjust the
responsive breakpoints
- Update the related feature tests
Add a /dashboard/canvas page that renders every team server with its
resources and their running or queued deployments, backed by a new
ServerCanvasController::dashboard endpoint and a per-server usage
endpoint for zone headers. The dashboard remembers the list/canvas
choice and each section (projects, servers) its own table/grid view.
- Show Deploying/Queued pills on canvas cards and a foldable recent
deployments panel; add shared CanvasControls component
- Allow backup downloads from the server host via the S3 download
storage (PrepareFileDownloadJob accepts a null container)
- Extract backup toggle/run actions into ManagesDatabaseBackup and
surface them in backup execution headers; merge S3 and retention
sections into the general backup settings
- Move deployments indicator to the top bar and add a main nav
resource menu with submenus; simplify breadcrumbs and settings
layouts
- Add shared variables overview canvas and scheduled task modals
- Add feature tests for dashboard canvas, view modes, navbar
submenus, backup S3 downloads and scheduled task modals
Put the user menu above the toggle in the collapsed sidebar, make the
user menu a full-width 3D button with rounded corners, and use a new
sidebar toggle icon everywhere.
The floating bottom-left pill and its expanded list covered page content.
- Desktop: show a compact 'N deployments' row in the sticky sidebar footer
(spinner with count badge when the sidebar is collapsed); the list opens
to the right of the sidebar
- Mobile: show a spinner with the count in the top bar; the list opens
below the top bar
- Poll only the copy visible at the current breakpoint (wire:poll.visible)
- Show the indicator on the dashboard too, and drop the path-based
visibility logic and its navigate round trip
Honor an explicit sidebarCollapsed preference instead of always auto-collapsing with a second nav. Show the primary domain on the application access card, use a persisted GitLab name in the page title after delete, and shrink the compose view switcher.
Scroll active application settings sections with buttons instead of Livewire navigation, persist sidebar collapse even with auto-collapse, drop the unused modal id, and right-align destination status.
Auto-collapse the main sidebar on pages that have a settings rail (follows
the page when enabled; expanded elsewhere), with an animated slide and a
profile-menu toggle (localStorage) to disable it.
Rework the settings rail to position:fixed like the main sidebar: full
height (3rem -> viewport bottom), left tracks the sidebar's collapsing
width via --sidebar-w, content pinned to grid column 2. Fixes the sticky
scroll crop and top/bottom gaps.
Introduce theme-controls and theme-controls/picker Blade components
housing the theme/page-width/custom-color logic previously duplicated
in top-user-menu and profile/appearance, and fix custom theme surface
colors to use oklch mixes instead of raw white/black/hex for correct
contrast.
- Settings rail (application-settings-navigation) is now white in light mode
instead of a gray fill; separation comes from the hairline ring + soft lift.
- Mobile slide-over: replace the heavy shadow-modal with a soft left-casting
shadow (scrim handles content dimming, shadcn-style) + rounded-l corners.
- Unify scattered shadow-lg usages onto the shadow-dropdown / shadow-modal
tokens across dropdowns, tooltips, popups and slide-over.
- Light-mode semantic text + tertiary/nav contrast tuning for WCAG AA.
- status-summary: support right-aligned dropdown; use it on the app heading.
- Add reusable <x-section-heading> (title, muted subtitle, optional action)
with a compact contained "View all" button; migrate dashboard Projects/
Servers/Deployments and shared-variables environment headers to it.
- Dashboard: hide the empty active-deployments node so it no longer adds a
gap above the first section; align section actions with the title row.
- Mobile: use the panel-left sidebar-toggle icon (matching desktop) as the
drawer trigger instead of a hamburger.
Design tokens
- Fix WCAG AA text failures: darken light muted text and lighten dark
tertiary text so 13-14px copy clears 4.5:1 on every surface.
- Rebuild the dark surface ladder in correct values (oklch compresses to
near-black below ~15%), giving visible steps: content, chrome, cards.
- Establish a 3-layer shell (deep content, lighter sidebar/topbar chrome,
lifted cards) with crisp hairline rings and a restrained card shadow.
- Unify every surface to one neutral temperature (pure gray); neutralize
the cool-tinted sidebar text and legacy surface tokens.
- Convert all color tokens to oklch (neutrals + brand).
- Unify inputs to the recessed token; fix invisible dark placeholders.
- One shared --shadow-dropdown for all menus/listboxes/command palette.
Settings sidebar
- Sticky contained-card rail with subtle scrollbar; collapsible sub-section
groups (active open by default), cross-page section links.
- Mobile: collapsible disclosure with animated open, outside/Escape dismiss,
press feedback, and reduced-motion support.
Mobile
- Consolidate the resource header (title + status + links on one row).
- Tighten settings-page vertical rhythm.
- Rebuild the main sidebar as an animated shadcn-style sheet (slide/fade,
Escape, scroll lock, in-panel close, close-on-navigate).
Fixes
- #11532: selected server invisible in the light-mode terminal toolbar.
Docs: update DESIGN.md tokens, shell layering, and temperature rules.
Add a local preview route and test coverage for proxy-style failures, suppressing raw Livewire error responses and showing a user-friendly toast after gestures.
Use the warning accent for dark-mode loading indicators and simplify desktop navigation chrome by removing sidebar and top-bar separator borders. Add regression coverage for loading contrast and checkpoint spinner markup.
Add full-width and centered layout preferences across the app shell and workspaces.
Replace page-size selects with dropdowns and add searchable breadcrumb switching.
Add project icon storage and serving with local/S3 support, prevent deletion of compose-managed volumes, and optimize volume backups. Refine project and backup UI components with consistent styling and coverage.
Always reserve vertical scrollbar space on base and v5 body
layouts to prevent content shift. Match notification event
multiselect panel open/close transitions to other listboxes.
Add shared status-summary and icon-tooltip components and wire them into
application, service, and database headings, breadcrumbs, and previews.
Badge production and PR domain links, prefer helper popups below the
trigger, keep full wire targets for button loading, and cover the UI
with feature tests.
Support a custom accent theme across nav, terminal, scrollbars, and loaders.
Improve light-mode tokens, helper popup placement, and theme persistence
(including purple→custom migration). Cover with appearance and scrollbar tests.
Introduce x-table toolbar/search/filter/sort/loading components and
multi-select deployment history filters with OR within groups and AND
across groups. Add live database/service status for breadcrumbs, shared
variables layout controls, logs viewer toolbar polish, and infrastructure
list filter consistency. Document patterns in UI_REDESIGN.md and cover
with feature tests.
Group service domain tables with inline redirect controls, live-save
redirects without full refreshes, and only auto-pair www hosts when a
www redirect is active. Align helper tooltips, server-timing HUD, and
loading spinners with dark-theme accents; default theme-color to dark.
Move email verification and team invitation into x-auth.shell with
shared guidance/alert patterns. Truncate long team names in the mobile
header switcher so actions stay visible. Cover both with markup tests.
Add an application Internal access section that loads the running
container hostname (skipped for Compose apps), densify configuration
diff and popup-small defaults, dock the server-timing HUD into the
mobile top bar, restyle the 2FA challenge with the auth shell, and
enforce 16px mobile form fonts to prevent iOS zoom.
Andras Bacsai
Cursor AgentandAndras Bacsai
Aditya TripathiandAndras Bacsai
peaklabs-dev