LotusGuild/cinny
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(tds): resolve send-status and read-receipt colors from --lt-* vars

Browse Source 
DP14: Message send-status icon and ReadReceiptAvatars pill hardcoded
dark-theme accent hex/rgba, so TDS light mode kept bright cyan/red
instead of the theme-overridden darker values. Route all colors/glows
through the theme-aware --lt-* CSS variables (mirroring EventReaders),
using color-mix for translucent tints and accent-alpha icon colors.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Jared Vititoe
2026-07-07 22:40:54 -04:00
parent 6cf18c3bd9
commit 165714e133
2 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/read-receipt-avatars/ReadReceiptAvatars.tsx
+3 -3
View File
@@ -106,12 +106,12 @@ export function ReadReceiptAvatars({
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
backgroundColor: lotusTerminal backgroundColor: lotusTerminal
? 'rgba(0,212,255,0.07)' ? 'color-mix(in srgb, var(--lt-accent-cyan) 7%, transparent)'
: color.SurfaceVariant.Container, : color.SurfaceVariant.Container,
border: lotusTerminal border: lotusTerminal
? `${config.borderWidth.B300} solid rgba(0,212,255,0.30)` ? `${config.borderWidth.B300} solid color-mix(in srgb, var(--lt-accent-cyan) 30%, transparent)`
: `${config.borderWidth.B300} solid transparent`, : `${config.borderWidth.B300} solid transparent`,
boxShadow: lotusTerminal ? '0 0 10px rgba(0,212,255,0.12)' : 'none', boxShadow: lotusTerminal ? 'var(--lt-box-glow-cyan)' : 'none',
borderRadius: config.radii.Pill, borderRadius: config.radii.Pill,
padding: `${config.space.S100} ${config.space.S200}`, padding: `${config.space.S100} ${config.space.S200}`,
gap: '0px', gap: '0px',
src/app/features/room/message/Message.tsx
+8 -4
View File
@@ -104,15 +104,19 @@ function DeliveryStatus({
if (status === EventStatus.NOT_SENT || status === EventStatus.CANCELLED) { if (status === EventStatus.NOT_SENT || status === EventStatus.CANCELLED) {
iconSrc = Icons.Cross; iconSrc = Icons.Cross;
label = 'Failed to send'; label = 'Failed to send';
colorStyle = lotusTerminal ? '#FF3B3B' : color.Critical.Main; colorStyle = lotusTerminal ? 'var(--lt-accent-red)' : color.Critical.Main;
} else if (status === EventStatus.QUEUED || isSending) { } else if (status === EventStatus.QUEUED || isSending) {
iconSrc = Icons.Send; iconSrc = Icons.Send;
label = isSending ? 'Sending...' : 'Queued'; label = isSending ? 'Sending...' : 'Queued';
colorStyle = lotusTerminal ? 'rgba(0,212,255,0.60)' : color.Secondary.Main; colorStyle = lotusTerminal
? 'color-mix(in srgb, var(--lt-accent-cyan) 60%, transparent)'
: color.Secondary.Main;
} else { } else {
iconSrc = Icons.Check; iconSrc = Icons.Check;
label = 'Sent'; label = 'Sent';
colorStyle = lotusTerminal ? 'rgba(0,212,255,0.70)' : color.Secondary.Main; colorStyle = lotusTerminal
? 'color-mix(in srgb, var(--lt-accent-cyan) 70%, transparent)'
: color.Secondary.Main;
} }
return ( return (
<Box <Box
@@ -128,7 +132,7 @@ function DeliveryStatus({
opacity: 0.85, opacity: 0.85,
userSelect: 'none', userSelect: 'none',
...(lotusTerminal && status === EventStatus.NOT_SENT ...(lotusTerminal && status === EventStatus.NOT_SENT
? { textShadow: '0 0 6px #FF3B3B' } ? { textShadow: 'var(--lt-glow-red)' }
: {}), : {}),
}} }}
> >