From 879a3c55dd009f297903145cd512037a63816dbb Mon Sep 17 00:00:00 2001 From: Mahendra Suthar Date: Fri, 16 Aug 2024 16:13:28 +0530 Subject: [PATCH 1/3] fix submenu open animation in pinned sidebar Signed-off-by: Mahendra Suthar --- .../core-components/src/layout/Sidebar/SidebarSubmenu.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx b/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx index e05cc90fa9..2e27cbdd54 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx @@ -43,11 +43,12 @@ const useStyles = makeStyles< flexFlow: 'column nowrap', alignItems: 'flex-start', position: 'fixed', + opacity: 0, [theme.breakpoints.up('sm')]: { marginLeft: props.left, - transition: theme.transitions.create('margin-left', { + transition: theme.transitions.create(['margin-left', 'opacity'], { easing: theme.transitions.easing.sharp, - duration: theme.transitions.duration.shortest, + duration: props.submenuConfig.defaultOpenDelayMs, }), }, top: 0, @@ -68,6 +69,8 @@ const useStyles = makeStyles< }, }), drawerOpen: props => ({ + marginLeft: props.left, + opacity: 1, width: props.submenuConfig.drawerWidthOpen, [theme.breakpoints.down('xs')]: { width: '100%', From 83e288760d1293324a79786fb206436a6139a4ac Mon Sep 17 00:00:00 2001 From: Mahendra Suthar Date: Fri, 16 Aug 2024 16:16:08 +0530 Subject: [PATCH 2/3] add changeset for core-component Signed-off-by: Mahendra Suthar --- .changeset/honest-impalas-rescue.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/honest-impalas-rescue.md diff --git a/.changeset/honest-impalas-rescue.md b/.changeset/honest-impalas-rescue.md new file mode 100644 index 0000000000..e0aecfe42f --- /dev/null +++ b/.changeset/honest-impalas-rescue.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Fixed a bug in the SidebarSubmenu core component that caused the submenu to overlap with the sidebar when the user hovers over the pinned sidebar. From 57bf3e1c39e89a53db692941ab7d2e6a85efd7e5 Mon Sep 17 00:00:00 2001 From: Mahendra Suthar Date: Wed, 4 Sep 2024 22:24:11 +0530 Subject: [PATCH 3/3] chore: update changeset Signed-off-by: Mahendra Suthar --- .changeset/honest-impalas-rescue.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/honest-impalas-rescue.md b/.changeset/honest-impalas-rescue.md index e0aecfe42f..bac076bba6 100644 --- a/.changeset/honest-impalas-rescue.md +++ b/.changeset/honest-impalas-rescue.md @@ -2,4 +2,4 @@ '@backstage/core-components': patch --- -Fixed a bug in the SidebarSubmenu core component that caused the submenu to overlap with the sidebar when the user hovers over the pinned sidebar. +Fixed a bug in the `SidebarSubmenu` core component that caused the nested menu to overlap with the sidebar when the user hovers over the pinned sidebar.