[PR #72] [MERGED] feat: enhance style for chat-ui #98

Closed
opened 2026-02-16 03:15:07 -05:00 by yindo · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/run-llama/chat-ui/pull/72
Author: @thucpn
Created: 4/16/2025
Status: Merged
Merged: 4/18/2025
Merged by: @thucpn

Base: mainHead: tp/enhance-style-of-chat-ui


📝 Commits (10+)

📊 Changes

15 files changed (+500 additions, -418 deletions)

View changed files

.changeset/clean-lemons-cheat.md (+5 -0)
apps/web/app/custom-demo.tsx (+0 -261)
apps/web/app/demo/custom/page.tsx (+236 -0)
apps/web/app/demo/simple/page.tsx (+36 -0)
📝 apps/web/app/page.tsx (+25 -15)
apps/web/app/simple-demo.tsx (+0 -75)
📝 packages/chat-ui/src/chat/chat-input.tsx (+49 -22)
📝 packages/chat-ui/src/chat/chat-message.tsx (+54 -26)
📝 packages/chat-ui/src/chat/chat-messages.tsx (+59 -7)
📝 packages/chat-ui/src/chat/chat-section.tsx (+3 -1)
📝 packages/chat-ui/src/styles/pdf.css (+12 -1)
📝 packages/chat-ui/src/widgets/file-uploader.tsx (+3 -1)
📝 packages/chat-ui/src/widgets/markdown.tsx (+8 -3)
📝 packages/chat-ui/src/widgets/pdf-dialog.tsx (+6 -4)
📝 packages/chat-ui/src/widgets/starter-questions.tsx (+4 -2)

📄 Description

  • Update overall styles: color, background, shadow, padding in chat components
  • Show welcome message at start
  • Rearrange chat-input component:
    • make it as auto resizable textarea
    • move upload button and submit button inside chat-input
    • move stop button inside chat-input also (same as vercel and chatgpt)
  • Update style of chat-message:
    • remove avatar of user message, also set background black for it and move to the right
    • move re-generate button under copy button (in last assistant message)

image


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/run-llama/chat-ui/pull/72 **Author:** [@thucpn](https://github.com/thucpn) **Created:** 4/16/2025 **Status:** ✅ Merged **Merged:** 4/18/2025 **Merged by:** [@thucpn](https://github.com/thucpn) **Base:** `main` ← **Head:** `tp/enhance-style-of-chat-ui` --- ### 📝 Commits (10+) - [`e5a6fe5`](https://github.com/run-llama/chat-ui/commit/e5a6fe50178236354dd0b61a96e8976ebbcdd12c) feat: enhance style for chat-ui - [`14d45fd`](https://github.com/run-llama/chat-ui/commit/14d45fd8186a9527353b90f1fb78404aa073ca81) dont show upload by default - [`137681a`](https://github.com/run-llama/chat-ui/commit/137681a7e5147d3124bf5fc9a62573f58204e8e9) move stop button to chat input - [`56c58dc`](https://github.com/run-llama/chat-ui/commit/56c58dc831c5cf81b0d7bab021f4c62123783da4) update avatar - [`2ae3ebc`](https://github.com/run-llama/chat-ui/commit/2ae3ebc87afa6f85110e189845d0f98a3f57c8a3) enhance UI - [`087f410`](https://github.com/run-llama/chat-ui/commit/087f4109fec302fe6b4b411f3a1a5a4424cf1a19) move regenerate to the right side - [`bf0ea71`](https://github.com/run-llama/chat-ui/commit/bf0ea710c07a22b5011205446a27bf8883b28e0b) fix: lint - [`f40029c`](https://github.com/run-llama/chat-ui/commit/f40029ca0889ad590e31cedb10b108d228486ba9) move chat message to the right - [`b50a1e1`](https://github.com/run-llama/chat-ui/commit/b50a1e19831b2290506a4c285be078f5cefadb59) reduce padding - [`d73cbfe`](https://github.com/run-llama/chat-ui/commit/d73cbfe168088b3d6eff3bf5a7e87b447540df27) update demo ### 📊 Changes **15 files changed** (+500 additions, -418 deletions) <details> <summary>View changed files</summary> ➕ `.changeset/clean-lemons-cheat.md` (+5 -0) ➖ `apps/web/app/custom-demo.tsx` (+0 -261) ➕ `apps/web/app/demo/custom/page.tsx` (+236 -0) ➕ `apps/web/app/demo/simple/page.tsx` (+36 -0) 📝 `apps/web/app/page.tsx` (+25 -15) ➖ `apps/web/app/simple-demo.tsx` (+0 -75) 📝 `packages/chat-ui/src/chat/chat-input.tsx` (+49 -22) 📝 `packages/chat-ui/src/chat/chat-message.tsx` (+54 -26) 📝 `packages/chat-ui/src/chat/chat-messages.tsx` (+59 -7) 📝 `packages/chat-ui/src/chat/chat-section.tsx` (+3 -1) 📝 `packages/chat-ui/src/styles/pdf.css` (+12 -1) 📝 `packages/chat-ui/src/widgets/file-uploader.tsx` (+3 -1) 📝 `packages/chat-ui/src/widgets/markdown.tsx` (+8 -3) 📝 `packages/chat-ui/src/widgets/pdf-dialog.tsx` (+6 -4) 📝 `packages/chat-ui/src/widgets/starter-questions.tsx` (+4 -2) </details> ### 📄 Description - Update overall styles: color, background, shadow, padding in chat components - Show welcome message at start - Rearrange chat-input component: + make it as auto resizable textarea + move upload button and submit button inside chat-input + move stop button inside chat-input also (same as vercel and chatgpt) - Update style of chat-message: + remove avatar of user message, also set background black for it and move to the right + move re-generate button under copy button (in last assistant message) ![image](https://github.com/user-attachments/assets/e9531df7-f4f7-4662-a5b3-8b35eaeb6887) --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
yindo added the pull-request label 2026-02-16 03:15:07 -05:00
yindo closed this issue 2026-02-16 03:15:07 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: run-llama/chat-ui#98