yusufipek/YTChatHub
1
0
Fork 0
mirror of https://github.com/yusufipk/YTChatHub.git synced 2026-09-11 10:56:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: enhance chat UI with badges, superchat and membership display

Browse Source
This commit is contained in:
Yusuf İpek
2025-10-05 04:42:47 +03:00
parent 99e1762068
commit 47c9a67362
7 changed files with 552 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/app/overlay/page.tsx
+27 -1
View File
@@ -39,7 +39,33 @@ export default function OverlayPage() {
<main className="overlay">
{message ? (
<div className="overlay__card">
<span className="overlay__author">{message.author}</span>
<div className="overlay__header">
{message.authorPhoto && (
<img src={message.authorPhoto} alt={message.author} className="overlay__avatar" />
)}
<div>
<div className="overlay__authorLine">
<span className="overlay__author">{message.author}</span>
{message.badges && message.badges.map((badge, i) => (
<span key={i} className={`overlay__badge overlay__badge--${badge.type}`} title={badge.label}>
{badge.type === 'moderator' && '🛡️'}
{badge.type === 'member' && '⭐'}
{badge.type === 'verified' && '✓'}
</span>
))}
</div>
</div>
</div>
{message.superChat && (
<div className="overlay__superchat" style={{ backgroundColor: message.superChat.color }}>
💰 {message.superChat.amount}
</div>
)}
{message.membershipGift && (
<div className="overlay__membership">
🎁 New Member!
</div>
)}
<p className="overlay__text">{message.text}</p>
</div>
) : (