Skip to main content

Chat Input Dark Mode Visibility Update

Date: 05-08-2026 Project: quantago

Summary​

Adjusted the chat composer background in dark mode so the input area is visible when not focused.

What Changed​

Updated the composer wrapper in packages/chat-ui/src/StreamingChatPanel.tsx:

  • Before: always used bg-card
  • After: keeps bg-card when focused/streaming, but uses a slightly lighter dark-mode background when idle
className={`relative flex w-full flex-col rounded-[14px] transition-shadow ${isFocused || isStreaming ? 'bg-card' : 'bg-card dark:bg-white/[0.06]'}`}

Reasoning​

The previous dark-mode idle state blended too much into the page background, making the input appear hidden until focus. The new idle dark background keeps contrast subtle but clearly visible, while focused behavior remains unchanged.

Validation​

Ran:

  • pnpm typecheck
  • pnpm lint

Result:

  • No errors
  • Existing lint warnings remain in unrelated files; none introduced by this change