admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 18:12:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): Tweak split execute button style (no-changelog) (#16661)

Browse Source
This commit is contained in:
Suguru Inoue
2025-06-24 13:24:09 +02:00
committed by GitHub
parent 20c63436d2
commit f133736b54
1 changed files with 14 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
packages/frontend/editor-ui/src/components/canvas/elements/buttons/CanvasRunWorkflowButton.vue
View File

@@ -51,7 +51,7 @@ const actions = computed(() =>
}) })
.map<ActionDropdownItem>((node) => ({ .map<ActionDropdownItem>((node) => ({
label: truncateBeforeLast(node.name, 25), label: truncateBeforeLast(node.name, 25),
disabled: !!node.disabled, disabled: !!node.disabled || props.executing,
id: node.name, id: node.name,
checked: props.selectedTriggerNodeName === node.name, checked: props.selectedTriggerNodeName === node.name,
})), })),
@@ -105,6 +105,7 @@ function getNodeTypeByName(name: string): INodeTypeDescription | null {
</N8nButton> </N8nButton>
</KeyboardShortcutTooltip> </KeyboardShortcutTooltip>
<template v-if="isSplitButton"> <template v-if="isSplitButton">
<div role="presentation" :class="$style.divider" />
<N8nActionDropdown <N8nActionDropdown
:class="$style.menu" :class="$style.menu"
:items="actions" :items="actions"
@@ -115,8 +116,8 @@ function getNodeTypeByName(name: string): INodeTypeDescription | null {
<template #activator> <template #activator>
<N8nButton <N8nButton
type="primary" type="primary"
size="large" icon-size="large"
:disabled="disabled || executing" :disabled="disabled"
:class="$style.chevron" :class="$style.chevron"
aria-label="Select trigger node" aria-label="Select trigger node"
icon="angle-down" icon="angle-down"
@@ -151,28 +152,21 @@ function getNodeTypeByName(name: string): INodeTypeDescription | null {
height: var(--spacing-2xl); height: var(--spacing-2xl);
padding-inline-start: var(--spacing-xs); padding-inline-start: var(--spacing-xs);
padding-inline-end: var(--spacing-xl);
padding-block: 0; padding-block: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
} }
} }
.divider {
width: 1px;
background-color: var(--button-font-color, var(--color-button-primary-font));
}
.chevron { .chevron {
position: absolute; width: 40px;
right: var(--spacing-3xs); border-top-left-radius: 0;
top: var(--spacing-3xs); border-bottom-left-radius: 0;
width: 18px;
height: calc(100% - var(--spacing-3xs) * 2);
border: none;
padding: 0;
background-color: transparent;
&:not(:disabled):hover {
background-color: var(--prim-color-primary-tint-100);
}
&:disabled {
background-color: transparent !important;
}
} }
.menu :global(.el-dropdown) { .menu :global(.el-dropdown) {