diff --git a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue index 7affae987..399e331e5 100644 --- a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue +++ b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue @@ -153,10 +153,12 @@ export default Vue.extend({ .submenu { + background: none !important; + :global(.el-submenu__title) { display: flex; align-items: center; - border-radius: var(--border-radius-base); + border-radius: var(--border-radius-base) !important; padding: var(--spacing-2xs) var(--spacing-xs) !important; user-select: none; @@ -205,9 +207,11 @@ export default Vue.extend({ } .active { - background-color: var(--color-foreground-base); - border-radius: var(--border-radius-base); - .icon { color: var(--color-text-dark) } + &, & :global(.el-submenu__title) { + background-color: var(--color-foreground-base); + border-radius: var(--border-radius-base); + .icon { color: var(--color-text-dark) } + } } .menuItem { diff --git a/packages/editor-ui/src/components/MainSidebar.vue b/packages/editor-ui/src/components/MainSidebar.vue index 8d4828c46..eaf85a60f 100644 --- a/packages/editor-ui/src/components/MainSidebar.vue +++ b/packages/editor-ui/src/components/MainSidebar.vue @@ -82,6 +82,7 @@ import { } from '@/constants'; import { userHelpers } from './mixins/userHelpers'; import { debounceHelper } from './mixins/debounce'; +import Vue from 'vue'; export default mixins( genericHelpers, @@ -160,7 +161,6 @@ export default mixins( // @ts-ignore label: item.properties ? item.properties.title : '', position: item.position, - activateOnRouteNames: [ VIEWS.TEMPLATES ], type: item.properties?.href ? 'link' : 'regular', properties: item.properties, } as IMenuItem, @@ -277,8 +277,7 @@ export default mixins( return [ ...items, ...regularItems ]; }, }, - mounted() { - this.fullyExpanded = !this.isCollapsed; + async mounted() { if (this.$refs.user) { this.$externalHooks().run('mainSidebar.mounted', { userRef: this.$refs.user }); } @@ -286,6 +285,8 @@ export default mixins( this.$store.commit('ui/expandSidebarMenu'); } this.checkWidthAndAdjustSidebar(window.innerWidth); + await Vue.nextTick(); + this.fullyExpanded = !this.isCollapsed; }, created() { window.addEventListener("resize", this.onResize);