4284: Adjust Chat Input Colors

[bahaaTuffaha]

Short Description

Adjust the neutral colors of the input composer to create a clearer visual hierarchy:

Use Neutral 38% for:

• Input field outline
• Inactive send button

Use Neutral 60% for:

• Placeholder text
• Datenschutz icon

Proposed Changes

• Added grayNeutral38 and grayNeutral60 to TypeChat at ThemeType.ts.
• at colors.ts added grayNeutral38 and grayNeutral60as rgba colors to match the actual color.

Used grayNeutral38 for:

• Added a notchedOutline rule to StyledTextField that sets the input outline to grayNeutral38 and borderWidth: 2.
• The inactive send button.

Used grayNeutral60 for:

• The placeholder color.
• The privacy policy icon in ChatIconButton.
• The hover outline color.

Side Effects

N/A

Checklist

• Followed the contributing guidelines and conventions
• Considered accessibility impacts and made the necessary adjustments
• Added or updated unit tests (if applicable)
• Added or updated documentation (if applicable)
• Added a release note for native (if applicable)

Testing

• Go to Testumgebung and open the chat.
• Check the input's place holder color, icon colors, the hovering and contrast more.

Resolved Issues

Fixes: #4284

---

[lunars97]

i am not sure whether there should be rgba because all the colors here are hex colors 🤔 Maybe we could convert them to hex through converter?

[bahaaTuffaha]

converting them to hex I think wont be accurate but I will try

[lunars97]

@ulyanahoy-cloud do you probably have hex version? 🤔