fix(editor): Refine instance AI visual styling (no-changelog)#28291
fix(editor): Refine instance AI visual styling (no-changelog)#28291
Conversation
…ents Remove header icon, task count, status badges, kind icons/badges, accordion behavior, and divider lines. Use N8nText, N8nInput components instead of raw HTML elements. Shorten approve button label to "Approve". Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
… mode contrast Restyle AnsweredQuestions to match user message alignment and appearance (right-aligned grey bubble). Use neutral design token for ConfirmationPreview background in dark mode for better contrast. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…section Extract communication style rules (conciseness, no emojis, always end with text) into a dedicated section, keeping Safety focused on actual safety concerns. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- ArtifactCard: replace hoverable prop with standard box-shadow hover - CredentialSetup & WorkflowSetup: remove green success border on completed/confirm cards, keep regular border Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…st spacing Use consistent medium-size buttons across all instance AI confirmation components, add background to gateway resource decision panel, and reduce thread item height to 32px with proper padding. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Use design system N8nHeading for artifacts/tasks panel titles, increase pagination button sizes, use ghost variant for credential nav buttons, and lighten question list hover states. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Remove accidentally committed debug mock messages. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Tuukkaa
changed the title
Tuukkaa
changed the title
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
Bundle ReportChanges will decrease total bundle size by 6.28kB (-0.01%) ⬇️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: editor-ui-esmAssets Changed:
Files in
|
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
1 issue found across 17 files
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiThreadList.vue">
<violation number="1" location="packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiThreadList.vue:245">
P2: Custom agent: **Design System Tokens**
Replace the hard-coded height with the design-system height token (Design System Style Rules §2 hard-coded visual values).</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review, or fix all with cubic.
| .threadItem { | ||
| display: flex; | ||
| align-items: center; | ||
| height: 32px; |
There was a problem hiding this comment.
P2: Custom agent: Design System Tokens
Replace the hard-coded height with the design-system height token (Design System Style Rules §2 hard-coded visual values).
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiThreadList.vue, line 245:
<comment>Replace the hard-coded height with the design-system height token (Design System Style Rules §2 hard-coded visual values).</comment>
<file context>
@@ -242,6 +242,7 @@ function handleThreadAction(action: string, threadId: string) {
.threadItem {
display: flex;
align-items: center;
+ height: 32px;
border-radius: var(--radius);
transition: background-color 0.1s ease;
</file context>
| height: 32px; | |
| height: var(--height--md); |
1 participant
Summary
Visual refinements to instance AI components for consistency with the n8n design system:
Related Linear tickets, Github issues, and Community forum posts
Review / Merge checklist
release/backport(if the PR is an urgent fix that needs to be backported)