fix: restore theme toggle in navbar account menu, Lumière button styling
Build and Deploy Verso / deploy (push) Successful in 21m51s

- logged-in-items: pass showThemeToggle to AccountMenuItems so the theme
  switcher is accessible from the top-right navbar (was lost when the
  sidebar account icons were removed); AccountMenuItems already gates on
  hasOverallThemes so it's a no-op on non-themed pages
- project-list-lumiere: restyle Account + Admin navbar buttons — rounded
  square (8px) instead of pill, teal resting tint on Account, subtle
  teal border on hover; matches Lumière design language
- ide-lumiere: extend rounded-square styling to all toolbar action buttons
  (Share, Present, History, Layout, File/Edit/Help menu buttons) via
  .ide-redesign-toolbar-actions and .ide-redesign-toolbar-menu selectors

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
claude
2026-06-11 14:59:48 +00:00
parent 62847fbc15
commit 9e618280b1
3 changed files with 60 additions and 6 deletions
@@ -35,6 +35,7 @@ export default function LoggedInItems({
<AccountMenuItems
sessionUser={sessionUser}
showSubscriptionLink={showSubscriptionLink}
showThemeToggle
/>
</NavDropdownMenu>
</>
@@ -132,6 +132,37 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
}
}
// ── Toolbar action buttons (Share, Present, History, Layout, etc.) ─────────
// Targets the right-hand action area of the toolbar; covers OLButton (btn),
// subdued icon buttons, and the layout dropdown toggle.
[data-lumiere='true'] .ide-redesign-toolbar-actions {
.btn {
border-radius: 7px !important;
}
.ide-redesign-toolbar-button-subdued,
.ide-redesign-toolbar-button-icon {
border-radius: 7px !important;
&:hover:not(:disabled) {
background-color: rgba(42, 157, 143, 0.10) !important;
color: $lum-teal !important;
}
}
.layout-dropdown .dropdown-toggle {
border-radius: 7px !important;
}
}
// Also round the left-hand menu-bar subdued buttons (File, Edit, Help…)
[data-lumiere='true'] .ide-redesign-toolbar-menu {
.ide-redesign-toolbar-button-subdued,
.ide-redesign-toolbar-button-icon {
border-radius: 7px !important;
}
}
// ── Compile button — teal gradient ────────────────────────────────────────
// .compile-button-group wraps the Recompile button in the toolbar actions
@@ -39,22 +39,44 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
z-index: 10;
}
// Nav link pill hover
// Nav link hover — shared base
.navbar-nav > li > .nav-link,
.navbar-nav > li > .dropdown-toggle {
border-color: transparent !important;
border-radius: 20px;
transition: background-color 0.15s ease, color 0.15s ease;
border-radius: 8px !important;
transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
border: 1px solid transparent !important;
&:hover,
&:focus,
&.show {
background-color: rgba($lum-teal, 0.08) !important;
background-color: rgba($lum-teal, 0.09) !important;
color: $lum-teal !important;
border-color: transparent !important;
border-color: rgba($lum-teal, 0.18) !important;
}
}
// Account button — slightly more prominent (has a resting tint)
.nav-item-account > .dropdown-toggle {
background-color: rgba($lum-teal, 0.06) !important;
color: $lum-text !important;
font-weight: 500;
&:hover,
&:focus,
&.show {
background-color: rgba($lum-teal, 0.14) !important;
color: $lum-teal !important;
border-color: rgba($lum-teal, 0.25) !important;
}
}
// Admin button
.subdued > .dropdown-toggle {
color: $lum-text-sub !important;
font-size: 0.8rem;
font-weight: 500;
}
.navbar-title {
color: $lum-text !important;
font-weight: 600;