Refine Duo Chat panel spacing and border radii

What does this MR do?

Refines the Duo Chat panel's visual rhythm so the input area, footer, and surrounding panel share a consistent spacing and border-radius scale, and removes a stale rule that produced a gap below the chat input.

Visual changes

CleanShot_2026-05-13_at_08.37.16_2x

  • Chat input wrapper — replaces the asymmetric corner radii (gl-rounded-bl-[12px] gl-rounded-br-[18px] gl-rounded-tl-[12px] gl-rounded-tr-[12px]) with a uniform gl-rounded-lg, so the input echoes the surrounding panel geometry.
  • Submit / cancel buttons — drops !gl-rounded-full so the buttons use the default Pajamas shape, and swaps the submit icon from paper-airplane to arrow-up to align with the visual direction Aura is moving toward.
  • Footer — replaces the bespoke duo-chat-drawer-footer class with utility padding (gl-px-3 gl-pb-3) and nudges the disclaimer with gl-ml-2 so the footer aligns with the input.

Both chat views (duo_agentic_chat_view.vue and duo_chat_view.vue) receive the same treatment to keep them visually consistent.

Fix gap below the chat input

CleanShot_2026-05-13_at_12.32.06

Removed a max-height rule on .ai-panel-body that used outdated SCSS variables and had a sign error, causing the panel body to be shorter than its flex container and leaving an empty strip below the chat input. The flex layout already sizes it correctly, so no replacement is needed.

References

N/A

Screenshots or screen recordings

Before After
Before_-_Agentic After_-_Agentic
Before_-Agentic__Focus After_-Agentic__Foucs
Before_-_Vanilla_chat After_-_Vanilla_chat

How to set up and validate locally

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Austin Regnery

Merge request reports

Loading