github-mirror/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2026-05-30 08:17:06 +02:00
Code Issues Actions 14 Packages Projects Releases Wiki Activity Graph

fix(editor): Fix Code Node "Ask AI" UI issues (no-changelog) (#19915)

Browse Source
This commit is contained in:
Daria 2025-09-23 16:02:11 +03:00 committed by GitHub
parent 8049da2971
commit 2b38c4373e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 34 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
packages/frontend/editor-ui/src/components/CodeNodeEditor/AskAI/AskAI.vue
View File

@ -262,6 +262,17 @@ onMounted(() => {
<div>
<p :class="$style.intro" v-text="i18n.baseText('codeNodeEditor.askAi.intro')" />
<div :class="$style.inputContainer">
<N8nInput
v-model="prompt"
:class="$style.input"
type="textarea"
:rows="6"
:maxlength="ASK_AI_MAX_PROMPT_LENGTH"
:placeholder="i18n.baseText('codeNodeEditor.askAi.placeholder')"
data-test-id="ask-ai-prompt-input"
:readonly="props.isReadOnly"
@input="onPromptInput"
/>
<div :class="$style.meta">
<span
v-show="prompt.length > 1"
@ -275,17 +286,6 @@ onMounted(() => {
}}
</a>
</div>
<N8nInput
v-model="prompt"
:class="$style.input"
type="textarea"
:rows="6"
:maxlength="ASK_AI_MAX_PROMPT_LENGTH"
:placeholder="i18n.baseText('codeNodeEditor.askAi.placeholder')"
data-test-id="ask-ai-prompt-input"
:readonly="props.isReadOnly"
@input="onPromptInput"
/>
</div>
<div :class="$style.controls">
<div v-if="isLoading" :class="$style.loader">
@ -357,12 +357,27 @@ onMounted(() => {
<style module lang="scss">
.input * {
border: 0 !important;
border-radius: 0 !important;
}
.input textarea {
font-size: var(--font-size-2xs);
padding-bottom: var(--spacing-2xl);
font-family: var(--font-family);
resize: none;
/* Custom scrollbar */
&::-webkit-scrollbar {
width: 4px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-thumb {
background: var(--color-foreground-base);
border-radius: 2px;
}
&::-webkit-scrollbar-thumb:hover {
background: var(--color-foreground-dark);
}
}
.intro {
font-weight: var(--font-weight-bold);
@ -381,6 +396,9 @@ onMounted(() => {
position: relative;
}
.help {
display: flex;
align-items: center;
gap: var(--spacing-4xs);
text-decoration: underline;
margin-left: auto;
color: #909399;
@ -388,11 +406,10 @@ onMounted(() => {
.meta {
display: flex;
justify-content: space-between;
position: absolute;
bottom: var(--spacing-2xs);
left: var(--spacing-xs);
right: var(--spacing-xs);
z-index: 1;
align-items: center;
padding: var(--spacing-2xs) var(--spacing-xs);
background-color: var(--color-foreground-xlight);
border-top: 1px solid var(--border-color-base);
* {
font-size: var(--font-size-2xs);