fix: restore theme toggle in navbar account menu, Lumière button styling
Build and Deploy Verso / deploy (push) Successful in 21m51s
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:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user