fix(editor): menu UI fixes (no-changelog) (#4316)

* N8N-4964-menu-fixes

* 👌 Addressing PR review comments
This commit is contained in:
Milorad FIlipović 2022-10-11 17:10:35 +02:00 committed by GitHub
parent a82fd3f33f
commit 51e8f5ff22
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 7 deletions

View file

@ -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 {

View file

@ -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);