diff --git a/packages/design-system/src/components/N8nActionBox/ActionBox.vue b/packages/design-system/src/components/N8nActionBox/ActionBox.vue index 7aa6e57a7cb0e..032b2bb385ea3 100644 --- a/packages/design-system/src/components/N8nActionBox/ActionBox.vue +++ b/packages/design-system/src/components/N8nActionBox/ActionBox.vue @@ -2,7 +2,7 @@
{{ props.heading }} - +
*:first-child { - margin-bottom: var(--spacing-2xs); + margin-bottom: var(--spacing-xs); } } diff --git a/packages/design-system/src/components/N8nActionToggle/ActionToggle.vue b/packages/design-system/src/components/N8nActionToggle/ActionToggle.vue index 3a617ef2fd956..c73f324309495 100644 --- a/packages/design-system/src/components/N8nActionToggle/ActionToggle.vue +++ b/packages/design-system/src/components/N8nActionToggle/ActionToggle.vue @@ -59,6 +59,7 @@ export default { } .button { + cursor: pointer; padding: var(--spacing-4xs); border-radius: var(--border-radius-base); color: var(--color-text-dark); diff --git a/packages/design-system/src/components/N8nAvatar/Avatar.vue b/packages/design-system/src/components/N8nAvatar/Avatar.vue index 3983fa263ce6c..122d7c159f876 100644 --- a/packages/design-system/src/components/N8nAvatar/Avatar.vue +++ b/packages/design-system/src/components/N8nAvatar/Avatar.vue @@ -1,10 +1,10 @@ @@ -28,7 +29,10 @@ const sizes: {[size: string]: number} = { export default { name: 'n8n-avatar', props: { - name: { + firstName: { + type: String, + }, + lastName: { type: String, }, size: { @@ -43,6 +47,9 @@ export default { Avatar, }, methods: { + getInitials({firstName, lastName}) { + return firstName.charAt(0) + lastName.charAt(0); + }, getBlankStyles(size): {height: string, width: string} { const px = sizes[size]; return { height: `${px}px`, width: `${px}px` }; @@ -60,7 +67,10 @@ export default { diff --git a/packages/design-system/src/components/N8nFormInputs/FormInputs.vue b/packages/design-system/src/components/N8nFormInputs/FormInputs.vue index 897daa99e06b8..c721f0067799a 100644 --- a/packages/design-system/src/components/N8nFormInputs/FormInputs.vue +++ b/packages/design-system/src/components/N8nFormInputs/FormInputs.vue @@ -99,7 +99,9 @@ export default Vue.extend({ this.showValidationWarnings = true; if (this.isReadyToSubmit) { const toSubmit = this.filteredInputs.reduce((accu, input: IFormInput) => { - accu[input.name] = this.values[input.name]; + if (this.values[input.name]) { + accu[input.name] = this.values[input.name]; + } return accu; }, {}); this.$emit('submit', toSubmit); diff --git a/packages/design-system/src/components/N8nUserInfo/UserInfo.stories.js b/packages/design-system/src/components/N8nUserInfo/UserInfo.stories.js index 927d02458c780..53ee48deb4c6f 100644 --- a/packages/design-system/src/components/N8nUserInfo/UserInfo.stories.js +++ b/packages/design-system/src/components/N8nUserInfo/UserInfo.stories.js @@ -19,13 +19,15 @@ const Template = (args, { argTypes }) => ({ export const Member = Template.bind({}); Member.args = { - fullName: "M A", + firstName: 'Oscar', + lastName: 'Wilde', email: 'test@n8n.io', }; export const Current = Template.bind({}); Current.args = { - fullName: "M A", + firstName: 'Ham', + lastName: 'Sam', email: 'test@n8n.io', isCurrentUser: true, }; diff --git a/packages/design-system/src/components/N8nUserInfo/UserInfo.vue b/packages/design-system/src/components/N8nUserInfo/UserInfo.vue index f819e49e618ed..12bcc800a9edd 100644 --- a/packages/design-system/src/components/N8nUserInfo/UserInfo.vue +++ b/packages/design-system/src/components/N8nUserInfo/UserInfo.vue @@ -1,7 +1,7 @@