feat: update UI components to use CSS variables for dark mode compatibility
This commit is contained in:
@@ -293,30 +293,30 @@ function SmsWalletPageInner() {
|
||||
<div style={{
|
||||
display: 'flex', alignItems: 'center', gap: 10,
|
||||
padding: '10px 14px', borderRadius: 8,
|
||||
background: '#fef9c3', border: '1px solid #fbbf24', fontSize: 13,
|
||||
background: 'var(--warning-bg)', border: '1px solid var(--warning)', fontSize: 13,
|
||||
}}>
|
||||
<ClockIcon style={{ width: 16, color: '#b45309', flexShrink: 0 }} />
|
||||
<span style={{ color: '#92400e' }}>در انتظار تأیید ادمین</span>
|
||||
<ClockIcon style={{ width: 16, color: 'var(--warning)', flexShrink: 0 }} />
|
||||
<span style={{ color: 'var(--warning)' }}>در انتظار تأیید ادمین</span>
|
||||
</div>
|
||||
)}
|
||||
{currentSettings.post_visit_text_status === 'approved' && (
|
||||
<div style={{
|
||||
display: 'flex', alignItems: 'center', gap: 10,
|
||||
padding: '10px 14px', borderRadius: 8,
|
||||
background: '#dcfce7', border: '1px solid #86efac', fontSize: 13,
|
||||
background: 'var(--success-bg)', border: '1px solid var(--success)', fontSize: 13,
|
||||
}}>
|
||||
<CheckCircleIcon style={{ width: 16, color: '#16a34a', flexShrink: 0 }} />
|
||||
<span style={{ color: '#15803d' }}>تأیید شده و فعال است</span>
|
||||
<CheckCircleIcon style={{ width: 16, color: 'var(--success)', flexShrink: 0 }} />
|
||||
<span style={{ color: 'var(--success)' }}>تأیید شده و فعال است</span>
|
||||
</div>
|
||||
)}
|
||||
{currentSettings.post_visit_text_status === 'rejected' && (
|
||||
<div style={{
|
||||
display: 'flex', alignItems: 'flex-start', gap: 10,
|
||||
padding: '10px 14px', borderRadius: 8,
|
||||
background: '#fee2e2', border: '1px solid #fca5a5', fontSize: 13,
|
||||
background: 'var(--danger-bg)', border: '1px solid var(--danger)', fontSize: 13,
|
||||
}}>
|
||||
<XCircleIcon style={{ width: 16, color: '#dc2626', flexShrink: 0, marginTop: 1 }} />
|
||||
<div style={{ color: '#dc2626' }}>
|
||||
<XCircleIcon style={{ width: 16, color: 'var(--danger)', flexShrink: 0, marginTop: 1 }} />
|
||||
<div style={{ color: 'var(--danger)' }}>
|
||||
<div>متن پیامک رد شد</div>
|
||||
{currentSettings.post_visit_text_reject_reason && (
|
||||
<div style={{ marginTop: 3, fontSize: 12, opacity: 0.85 }}>دلیل: {currentSettings.post_visit_text_reject_reason}</div>
|
||||
@@ -422,16 +422,16 @@ function SmsWalletPageInner() {
|
||||
{/* انتخاب درگاه */}
|
||||
{isTestMode ? (
|
||||
<div style={{
|
||||
background: '#fef9c3',
|
||||
border: '1px solid #fbbf24',
|
||||
background: 'var(--warning-bg)',
|
||||
border: '1px solid var(--warning)',
|
||||
borderRadius: 10,
|
||||
padding: '12px 16px',
|
||||
display: 'flex', alignItems: 'center', gap: 10,
|
||||
}}>
|
||||
<span style={{ fontSize: 20 }}>⚠️</span>
|
||||
<div>
|
||||
<div style={{ fontWeight: 700, fontSize: 13.5, color: '#92400e' }}>درگاه آزمایشی فعال است</div>
|
||||
<div style={{ fontSize: 12, color: '#b45309', marginTop: 2 }}>پول واقعی کسر نخواهد شد — این تراکنش آزمایشی است</div>
|
||||
<div style={{ fontWeight: 700, fontSize: 13.5, color: 'var(--warning)' }}>درگاه آزمایشی فعال است</div>
|
||||
<div style={{ fontSize: 12, color: 'var(--warning)', marginTop: 2, opacity: 0.8 }}>پول واقعی کسر نخواهد شد — این تراکنش آزمایشی است</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
@@ -476,10 +476,10 @@ function SmsWalletPageInner() {
|
||||
|
||||
{watchAmount && Number(watchAmount) >= 10000 && (
|
||||
<div style={{
|
||||
background: isTestMode ? '#fef9c3' : 'var(--primary-subtle)',
|
||||
border: `1px solid ${isTestMode ? '#fbbf24' : 'oklch(0.85 0.06 256)'}`,
|
||||
background: isTestMode ? 'var(--warning-bg)' : 'var(--primary-soft)',
|
||||
border: `1px solid ${isTestMode ? 'var(--warning)' : 'color-mix(in oklch, var(--primary) 40%, transparent)'}`,
|
||||
borderRadius: 8, padding: '10px 14px',
|
||||
fontSize: 13, color: isTestMode ? '#92400e' : 'var(--primary)', fontWeight: 500,
|
||||
fontSize: 13, color: isTestMode ? 'var(--warning)' : 'var(--primary)', fontWeight: 500,
|
||||
}}>
|
||||
{isTestMode
|
||||
? `پرداخت آزمایشی ${formatRial(Number(watchAmount))}`
|
||||
|
||||
Reference in New Issue
Block a user