fix: 'Root' retiré du path + menu dropdown clippé par overflow sidebar
- folderStack: supprimé {id:0, name:'Root'} dans init() et navigateToRoot()
→ breadcrumb n'affiche plus 'Workspace / Root' mais juste 'Workspace / dossier'
- Sidebar: overflow-y:auto déplacé de .sidebar vers .sidebar-scroll (flex child)
→ le header et son dropdown ne sont PLUS clippés par overflow
→ position: absolute + top:100% fonctionne maintenant sur le dropdown
- .sidebar-scroll wrapper autour du contenu scrollable (nav row → footer)
This commit is contained in:
@@ -104,6 +104,7 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-scroll">
|
||||||
<!-- Workspace -->
|
<!-- Workspace -->
|
||||||
<div class="sidebar-section">
|
<div class="sidebar-section">
|
||||||
<div class="sidebar-section-header" @click="toggleSection('workspace')">
|
<div class="sidebar-section-header" @click="toggleSection('workspace')">
|
||||||
@@ -329,6 +330,7 @@
|
|||||||
<button class="sidebar-footer-btn" style="width:36px; justify-content:center;" @click="toggleTheme()">🌓</button>
|
<button class="sidebar-footer-btn" style="width:36px; justify-content:center;" @click="toggleTheme()">🌓</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div><!-- /sidebar-scroll -->
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
<!-- Uncollapse button (visible when sidebar hidden) -->
|
<!-- Uncollapse button (visible when sidebar hidden) -->
|
||||||
|
|||||||
@@ -907,7 +907,7 @@ document.addEventListener('alpine:init', function() {
|
|||||||
},
|
},
|
||||||
|
|
||||||
async navigateToRoot() {
|
async navigateToRoot() {
|
||||||
this.folderStack = [{id: 0, name: 'Root'}];
|
this.folderStack = [];
|
||||||
this.navIndex = 0;
|
this.navIndex = 0;
|
||||||
this._saveExpandedState();
|
this._saveExpandedState();
|
||||||
await this._loadFolder(0);
|
await this._loadFolder(0);
|
||||||
@@ -980,15 +980,7 @@ document.addEventListener('alpine:init', function() {
|
|||||||
this.loaded = true;
|
this.loaded = true;
|
||||||
// Initialize folder stack from breadcrumb
|
// Initialize folder stack from breadcrumb
|
||||||
this.folderStack = (this.breadcrumb || []).map(function(b) { return {id: b.id, name: b.name}; });
|
this.folderStack = (this.breadcrumb || []).map(function(b) { return {id: b.id, name: b.name}; });
|
||||||
if (this.currentFolder && this.currentFolder > 0 && this.folderStack.length === 0) {
|
|
||||||
this.folderStack = [{id: 0, name: 'Root'}];
|
|
||||||
// Add current folder name from tree if present
|
|
||||||
if (this.tree.length > 0) {
|
|
||||||
// The current folder's children are in breadcrumb, parent is the last
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.navIndex = this.folderStack.length > 0 ? this.folderStack.length - 1 : 0;
|
this.navIndex = this.folderStack.length > 0 ? this.folderStack.length - 1 : 0;
|
||||||
if (this.folderStack.length === 0) this.folderStack = [{id: 0, name: 'Root'}];
|
|
||||||
// Expose globally for renderChildren onclick handlers
|
// Expose globally for renderChildren onclick handlers
|
||||||
window._wsData = this;
|
window._wsData = this;
|
||||||
// Listen for online/offline
|
// Listen for online/offline
|
||||||
|
|||||||
+6
-2
@@ -114,10 +114,14 @@ input, select, textarea { font-family: inherit; color: inherit; }
|
|||||||
background: var(--bg-sidebar);
|
background: var(--bg-sidebar);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow-y: auto;
|
overflow: visible;
|
||||||
overflow-x: hidden;
|
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
}
|
||||||
|
.sidebar-scroll {
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
padding-bottom: var(--space-sm);
|
padding-bottom: var(--space-sm);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user