EmbeddedChat icon indicating copy to clipboard operation
EmbeddedChat copied to clipboard

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

Open gaurirathi opened this issue 1 month ago • 1 comments

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

https://github.com/user-attachments/assets/d2798b2c-99fc-4127-84d3-2fd034d524bb

gaurirathi avatar Jan 15 '26 14:01 gaurirathi