diff --git a/frontend/src/App.css b/frontend/src/App.css index 7f20cfa..8bc0a44 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -63,6 +63,25 @@ body, #root { .sidebar-tree-scroll-shell .ant-tree .ant-tree-node-content-wrapper { width: auto !important; min-width: 0; + display: flex !important; + align-items: center; + gap: 8px; +} + +.sidebar-tree-scroll-shell .ant-tree .ant-tree-switcher { + flex: 0 0 24px; + width: 24px; + min-width: 24px; +} + +.sidebar-tree-scroll-shell .ant-tree .ant-tree-iconEle { + flex: 0 0 16px; + width: 16px; + min-width: 16px; + display: inline-flex; + align-items: center; + justify-content: center; + margin-inline-end: 0; } .sidebar-tree-scroll-shell .ant-tree .ant-tree-title { diff --git a/frontend/src/sidebarTreeScrollCss.test.ts b/frontend/src/sidebarTreeScrollCss.test.ts index 7f540be..96c507c 100644 --- a/frontend/src/sidebarTreeScrollCss.test.ts +++ b/frontend/src/sidebarTreeScrollCss.test.ts @@ -18,6 +18,9 @@ describe('sidebar tree horizontal scroll css', () => { expect(appCss).toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-node-content-wrapper\s*\{[^}]*width:\s*auto\s*!important;[^}]*min-width:\s*0;/s); expect(appCss).not.toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-node-content-wrapper\s*\{[^}]*max-content/s); + expect(appCss).toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-switcher\s*\{[^}]*width:\s*24px;[^}]*min-width:\s*24px;/s); + expect(appCss).toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-iconEle\s*\{[^}]*width:\s*16px;[^}]*min-width:\s*16px;/s); + expect(appCss).toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-title\s*\{[^}]*min-width:\s*0;[^}]*overflow:\s*visible;/s); expect(appCss).not.toMatch(/\.sidebar-tree-scroll-shell\s+\.ant-tree\s+\.ant-tree-title\s*\{[^}]*max-content/s); });