mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-07-15 09:06:07 +00:00
fix(ui): polish across routing, groups, inbounds, mobile sidebar
A bundle of small UI fixes that surfaced together while reviewing the panel. Routing rules — stale Edit after drag: - Dragging a rule and then clicking its Edit button used to open the modal with the *previous* rule's content. Root cause: desktopColumns was memoized with [t, isMobile, rows.length] (rows.length doesn't change on reorder), so the cached render function kept handing AntD the openEdit closure that captured the pre-drag rules array. Fix is a rulesRef updated each render and read inside openEdit, so even the cached closure sees the live array. - Mobile rule cards on the same page were hard to tell apart: bumped the inter-card gap, slightly stronger border, soft shadow, and a small centered divider line between adjacent cards. Mobile drawer (dark / ultra): - The AntD Menu inside the mobile drawer was rendering with its own darkItemBg (#15161a / #050507) while the drawer body used the lighter colorBgElevated, producing visible two-tone seams. Force the drawer-content / drawer-body to the same dark color that the desktop sider uses, and make the menus transparent so they inherit. Row menus — visual grouping: - Groups page row menu: moved Rename above the divider so the ordering reads safe → divider → destructive (Remove from group, Delete clients, Delete group only) instead of mixing the two groups. - Inbounds page row menu: inserted a divider before delAllClients / delete so the destructive items sit visually separated from the earlier safe actions. Dropdown affordances: - Non-danger dropdown items had no perceivable hover state (default colorBgTextHover is too subtle, especially under the light theme). Apply the same primary-tint pattern the sider/drawer menu uses: 14% primary background and primary color on label + icon. - ant-dropdown-menu-item-divider now uses var(--ant-color-border) (and an explicit rgba in dark) so the separator is actually visible in the light theme. Clients toolbar — narrow-desktop wrap: - Between 769px and 920px, the bulk-action bar (Attach / Detach / Add to group / Ungroup / more + Delete) wrapped to two rows with Delete stranded alone on the right. In that range, switch the toolbar buttons to icon-only, tighten gap to 6px and inline padding to 8px so everything stays on one line.
This commit is contained in:
@@ -247,6 +247,24 @@
|
||||
}
|
||||
}
|
||||
|
||||
body.dark .ant-drawer-content,
|
||||
body.dark .ant-drawer-body {
|
||||
background-color: #15161a;
|
||||
}
|
||||
|
||||
html[data-theme="ultra-dark"] body.dark .ant-drawer-content,
|
||||
html[data-theme="ultra-dark"] body.dark .ant-drawer-body {
|
||||
background-color: #050507;
|
||||
}
|
||||
|
||||
body.dark .ant-drawer-body .drawer-menu,
|
||||
body.dark .ant-drawer-body .drawer-menu.ant-menu-dark,
|
||||
body.dark .ant-drawer-body .drawer-menu .ant-menu-item,
|
||||
body.dark .ant-drawer-body .drawer-menu .ant-menu-sub,
|
||||
body.dark .ant-drawer-body .drawer-menu .ant-menu-item-group-list {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.sider-nav .ant-menu-item-selected,
|
||||
.sider-utility .ant-menu-item-selected,
|
||||
.drawer-menu .ant-menu-item-selected {
|
||||
|
||||
Reference in New Issue
Block a user