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.
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.
Teleport application/database/service heading actions into a fixed
#resource-action-hud-slot so they no longer overlay page content.
Render the account menu in the sidebar footer (with collapse-aware
layout) instead of the header, and drop the project card hover arrow.
Store deployment configuration snapshots on application deployment queues and compare them against the current application state. Surface grouped pending changes in the configuration checker and use build-impact diffs to decide when an existing image can skip the build step.
Move the deployments indicator inside the app layout state scope so it can react to the sidebar collapsed state, and add a layout test covering the responsive positioning.
Sidebar collapses to icon-only mode on lg breakpoint. State persists
in localStorage. Collapsed state shows logo icon, team initial button
with flyout menu, and hover tooltips for nav items.
- Adjusted CSS styles in the navbar for improved readability and responsiveness.
- Updated the layout of the sidebar and navbar components to enhance user experience on different screen sizes.
- Ensured consistent alignment and spacing for elements within the navbar and sidebar.
- Moved global search component from navbar to main app layout
- Fixed issue where navbar was included twice (mobile & desktop)
- Created single instance that handles all keyboard shortcuts
- Added search button in navbar that triggers global search modal
- Resolves issue where two modals opened when using Ctrl+K, Cmd+K, Ctrl+/, Cmd+/
Fixes#6715
Co-authored-by: Andras Bacsai <andrasbacsai@users.noreply.github.com>
Especially in full width and mobile view, the navbar looked cramped
because there was very little padding to the left end of the screen.
This commit adds horizontal padding to the navbar
and increases its width from 48 to 56 tailwind units.