fix(editor): Fix alignment in Workflow Settings modal (no-changelog) (#19645)

This commit is contained in:
Milorad FIlipović
2025-09-17 14:15:20 +02:00
committed by GitHub
parent 14a7c36673
commit d1b8cad16f

View File

@@ -496,9 +496,13 @@ onBeforeUnmount(() => {
:scrollable="true"
>
<template #content>
<div v-loading="isLoading" class="workflow-settings" data-test-id="workflow-settings-dialog">
<div
v-loading="isLoading"
:class="$style['workflow-settings']"
data-test-id="workflow-settings-dialog"
>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.executionOrder') }}
</el-col>
<el-col :span="14" class="ignore-key-press-canvas">
@@ -523,7 +527,7 @@ onBeforeUnmount(() => {
</el-row>
<el-row data-test-id="error-workflow">
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.errorWorkflow') }}
<N8nTooltip placement="top">
<template #content>
@@ -556,7 +560,7 @@ onBeforeUnmount(() => {
</el-row>
<div v-if="isSharingEnabled" data-test-id="workflow-caller-policy">
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.callerPolicy') }}
<N8nTooltip placement="top">
<template #content>
@@ -585,7 +589,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row v-if="workflowSettings.callerPolicy === 'workflowsFromAList'">
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.callerIds') }}
<N8nTooltip placement="top">
<template #content>
@@ -607,7 +611,7 @@ onBeforeUnmount(() => {
</el-row>
</div>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.timezone') }}
<N8nTooltip placement="top">
<template #content>
@@ -636,7 +640,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.saveDataErrorExecution') }}
<N8nTooltip placement="top">
<template #content>
@@ -665,7 +669,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.saveDataSuccessExecution') }}
<N8nTooltip placement="top">
<template #content>
@@ -694,7 +698,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.saveManualExecutions') }}
<N8nTooltip placement="top">
<template #content>
@@ -723,7 +727,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.saveExecutionProgress') }}
<N8nTooltip placement="top">
<template #content>
@@ -752,7 +756,7 @@ onBeforeUnmount(() => {
</el-col>
</el-row>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.timeoutWorkflow') }}
<N8nTooltip placement="top">
<template #content>
@@ -779,7 +783,7 @@ onBeforeUnmount(() => {
data-test-id="workflow-settings-timeout-form"
>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
{{ i18n.baseText('workflowSettings.timeoutAfter') }}
<N8nTooltip placement="top">
<template #content>
@@ -798,7 +802,7 @@ onBeforeUnmount(() => {
<template #append>{{ i18n.baseText('workflowSettings.hours') }}</template>
</N8nInput>
</el-col>
<el-col :span="4" class="timeout-input">
<el-col :span="4" :class="$style['timeout-input']">
<N8nInput
:disabled="readOnlyEnv || !workflowPermissions.update"
:model-value="timeoutHMS.minutes"
@@ -809,7 +813,7 @@ onBeforeUnmount(() => {
<template #append>{{ i18n.baseText('workflowSettings.minutes') }}</template>
</N8nInput>
</el-col>
<el-col :span="4" class="timeout-input">
<el-col :span="4" :class="$style['timeout-input']">
<N8nInput
:disabled="readOnlyEnv || !workflowPermissions.update"
:model-value="timeoutHMS.seconds"
@@ -823,7 +827,7 @@ onBeforeUnmount(() => {
</el-row>
</div>
<el-row>
<el-col :span="10" class="setting-name">
<el-col :span="10" :class="$style['setting-name']">
<label for="timeSavedPerExecution">
{{ i18n.baseText('workflowSettings.timeSavedPerExecution') }}
<N8nTooltip placement="top">
@@ -835,7 +839,7 @@ onBeforeUnmount(() => {
</label>
</el-col>
<el-col :span="14">
<div class="time-saved">
<div :class="$style['time-saved']">
<N8nInput
id="timeSavedPerExecution"
v-model="workflowSettings.timeSavedPerExecution"
@@ -852,7 +856,7 @@ onBeforeUnmount(() => {
</div>
</template>
<template #footer>
<div class="action-buttons" data-test-id="workflow-settings-save-button">
<div :class="$style['action-buttons']" data-test-id="workflow-settings-save-button">
<N8nButton
:disabled="readOnlyEnv || !workflowPermissions.update"
:label="i18n.baseText('workflowSettings.save')"
@@ -865,16 +869,30 @@ onBeforeUnmount(() => {
</Modal>
</template>
<style scoped lang="scss">
<style module lang="scss">
.workflow-settings {
font-size: var(--font-size-s);
.el-row {
padding: 0.25em 0;
display: flex;
flex-direction: column;
gap: var(--spacing-3xs);
:global(.el-row) {
display: flex;
align-items: center;
}
:global(.el-switch) {
padding: var(--spacing-m) 0;
}
}
.setting-name {
line-height: 32px;
&,
& label {
display: flex;
align-items: center;
gap: var(--spacing-4xs);
}
svg {
display: inline-flex;
@@ -890,15 +908,15 @@ onBeforeUnmount(() => {
}
.timeout-input {
margin-left: 5px;
margin-left: var(--spacing-3xs);
}
.time-saved {
display: flex;
align-items: center;
:deep(.el-input) {
width: 64px;
:global(.el-input) {
width: var(--spacing-3xl);
}
span {