Skip to content

Commit 140c034

Browse files
mrmeesclaude
andcommitted
feat: add expandable sidebar with persistent toggle and hover-to-expand
- Logo click toggles sidebar expansion to show link titles (persisted) - Layout button hover temporarily expands sidebar - More/Bookmarks menus open on hover, close when hovering other items - Context menus on More/Bookmarks activators (show all, add link) - Theme-colored dividers between menu sections - Tooltips suppressed when sidebar expanded - Settings sub-nav coexists with expanded sidebar (wider drawer) - Layout button always visible, navigates home on click - Icon type hints added to NavLinkDialog - Navigation settings reordered, confirm hidden when new-tab enabled Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
1 parent 0a8c4c1 commit 140c034

File tree

11 files changed

+360
-123
lines changed

11 files changed

+360
-123
lines changed

src/App.vue

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,10 @@
44
:class="{ 'no-pointer-events': dragState }"
55
>
66
<app-tools-drawer v-model="toolsdrawer" />
7-
<app-nav-drawer v-model="navdrawer" />
7+
<app-nav-drawer
8+
v-model="navdrawer"
9+
:sidebar-expanded.sync="sidebarExpanded"
10+
/>
811

912
<inline-svg
1013
v-if="showBackgroundLogo && !isMobileViewport"
@@ -15,6 +18,7 @@
1518
<app-bar
1619
@toolsdrawer="handleToolsDrawerChange"
1720
@navdrawer="handleNavDrawerChange"
21+
@sidebarExpand="handleSidebarExpandToggle"
1822
/>
1923

2024
<flash-message
@@ -380,6 +384,22 @@ export default class App extends Mixins(StateMixin, FilesMixin, BrowserMixin) {
380384
this.navdrawer = !this.navdrawer
381385
}
382386
387+
get sidebarExpanded (): boolean {
388+
return this.$typedState.config.uiSettings.navigation?.sidebarExpanded ?? false
389+
}
390+
391+
set sidebarExpanded (value: boolean) {
392+
this.$typedDispatch('config/saveByPath', {
393+
path: 'uiSettings.navigation.sidebarExpanded',
394+
value,
395+
server: true
396+
})
397+
}
398+
399+
handleSidebarExpandToggle () {
400+
this.sidebarExpanded = !this.sidebarExpanded
401+
}
402+
383403
handleDragOver (event: DragEvent) {
384404
if (
385405
this.socketConnected &&

src/components/layout/AppBar.vue

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,14 @@
66
:color="$vuetify.theme.currentTheme.appbar"
77
:height="$globals.HEADER_HEIGHT"
88
>
9-
<router-link
9+
<div
1010
v-if="!isMobileViewport"
11-
:to="{ name: 'home' }"
1211
class="toolbar-logo"
12+
style="cursor: pointer;"
13+
@click="$emit('sidebarExpand')"
1314
>
1415
<app-icon />
15-
</router-link>
16+
</div>
1617

1718
<div class="toolbar-title">
1819
<app-btn

0 commit comments

Comments
 (0)