Skip to content

Add dark/light theme support for chat input container in EmbeddedChat #1068

@gaurirathi

Description

@gaurirathi

Problem

The chat input container in EmbeddedChat does not fully adapt to dark and light themes.
While some components react to theme changes, the input area background, border, and text colors remain unchanged, which affects readability and visual consistency.

Additionally, there is inconsistent terminology used in the UI (Login vs Sign in).

Expected Behavior

  • Chat input container background should:
    • Be dark in dark mode
    • Be light in light mode
  • Input text and placeholder should remain readable in both modes
  • Border styling should adapt to the active theme
  • UI text should be consistent (Sign in instead of Login)

Current Behavior

  • Chat input container styling remains mostly static
  • Background and border colors do not reflect the active theme
  • Some UI text uses inconsistent wording

Proposed Solution

  • Apply theme-aware styles to:
    • Chat input container
    • Text input background and text color
  • Align UI text to use Sign in consistently
  • Reuse existing theme/context utilities without introducing new dependencies

Before

Image

#After

20260115-1434-34.5663691.mp4

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions