yumoqing/dashboard_for_sage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: sidebar collapse width, CRUD height overflow, dashboard VScrollPanel

Browse Source
This commit is contained in:
yumoqing 2026-05-30 21:20:29 +08:00
parent d8ec4e7142
commit c36ada56b1
3 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
wwwroot/index.ui
View File

@ -4,6 +4,12 @@
"width": "100%",
"height": "100%"
},
"subwidgets": [
{
"widgettype": "VScrollPanel",
"options": {
"css": "filler"
},
"subwidgets": [
{
"widgettype": "HBox",
@ -531,4 +537,6 @@
]
}
]
}
]
}

3
wwwroot/shell_theme.css
View File

@ -178,11 +178,12 @@ body {
.sage-main {
flex: 1;
overflow-y: auto;
overflow: hidden;
overflow-x: hidden;
padding: 24px;
background-color: var(--sage-bg-primary);
min-width: 0; /* Prevent flex item from overflowing */
min-height: 0; /* Allow flex children to shrink below content size */
transition: margin-left 0.3s ease;
}

10
wwwroot/shell_theme.js
View File

@ -51,6 +51,7 @@
var sidebar = document.getElementById('sage_sidebar');
if (sidebar && collapsed) {
sidebar.classList.add('collapsed');
sidebar.style.width = '64px';
}
}
@ -61,6 +62,7 @@
if (isMobile() && !sidebar.classList.contains('collapsed')) {
sidebar.classList.add('collapsed');
sidebar.style.width = '64px';
try { localStorage.setItem(SIDEBAR_KEY, 'true'); } catch(e) {}
updateSidebarIcon(true);
}
@ -81,6 +83,7 @@
// If click is outside sidebar and toggle button, close sidebar
if (!sidebar.contains(e.target) && (!toggleBtn || !toggleBtn.contains(e.target))) {
sidebar.classList.add('collapsed');
sidebar.style.width = '64px';
try { localStorage.setItem(SIDEBAR_KEY, 'true'); } catch(ex) {}
updateSidebarIcon(true);
}
@ -105,6 +108,8 @@
var isCollapsed = sidebar.classList.contains('collapsed');
try { localStorage.setItem(SIDEBAR_KEY, isCollapsed); } catch(e) {}
updateSidebarIcon(isCollapsed);
// Override inline width style (bricks sets inline style which beats CSS class)
sidebar.style.width = isCollapsed ? '64px' : '240px';
// Toggle Menu widget collapse state
if (typeof bricks !== 'undefined') {
var menu = bricks.getWidgetById('global_nav_menu', bricks.app);
@ -151,8 +156,9 @@
var w = await bricks.widgetBuild(desc, sidebar);
if (w) {
sidebar.addSubWidget(w);
// Re-apply collapsed state to newly built menu
// Re-apply collapsed state and inline width to newly built menu
if (isCollapsed) {
sidebar.el.style.width = '64px';
var menu = bricks.getWidgetById('global_nav_menu', bricks.app);
if (menu && menu.collapse) {
menu.collapse();
@ -201,6 +207,8 @@
if (btn && sidebar) {
var isCollapsed = sidebar.classList.contains('collapsed');
updateSidebarIcon(isCollapsed);
// Sync inline width with collapsed state (bricks may have overridden it)
sidebar.style.width = isCollapsed ? '64px' : '240px';
// Apply collapsed state to Menu if sidebar was already collapsed
if (isCollapsed && typeof bricks !== 'undefined') {
var menu = bricks.getWidgetById('global_nav_menu', bricks.app);