wanwu/sub2apipay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 暗色模式下支付方式选中时文字与背景色冲突不可见

Browse Source
This commit is contained in:
erio
2026-03-09 10:12:05 +08:00
parent 43e116a4f2
commit 5fb16f0ccf
2 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/PaymentForm.tsx
View File

@@ -258,7 +258,7 @@ export default function PaymentForm({
? 'cursor-not-allowed border-slate-700 bg-slate-800/50 opacity-50'
: 'cursor-not-allowed border-gray-200 bg-gray-50 opacity-50'
: isSelected
? `${meta?.selectedBorder || 'border-blue-500'} ${meta?.selectedBg || 'bg-blue-50'} ${dark ? 'text-slate-100' : 'text-slate-900'} shadow-sm`
? `${meta?.selectedBorder || 'border-blue-500'} ${dark ? (meta?.selectedBgDark || 'bg-blue-950') : (meta?.selectedBg || 'bg-blue-50')} ${dark ? 'text-slate-100' : 'text-slate-900'} shadow-sm`
: dark
? 'border-slate-700 bg-slate-900 text-slate-200 hover:border-slate-500'
: 'border-gray-300 bg-white text-slate-700 hover:border-gray-400',

7
src/lib/pay-utils.ts
View File

@@ -80,6 +80,8 @@ export interface PaymentTypeMeta {
color: string;
selectedBorder: string;
selectedBg: string;
/** 暗色模式选中背景 */
selectedBgDark: string;
iconBg: string;
/** 图标路径（Stripe 不使用外部图标） */
iconSrc?: string;
@@ -96,6 +98,7 @@ export const PAYMENT_TYPE_META: Record<string, PaymentTypeMeta> = {
color: '#00AEEF',
selectedBorder: 'border-cyan-400',
selectedBg: 'bg-cyan-50',
selectedBgDark: 'bg-cyan-950',
iconBg: 'bg-[#00AEEF]',
iconSrc: '/icons/alipay.svg',
chartBar: { light: 'bg-cyan-500', dark: 'bg-cyan-400' },
@@ -107,6 +110,7 @@ export const PAYMENT_TYPE_META: Record<string, PaymentTypeMeta> = {
color: '#1677FF',
selectedBorder: 'border-blue-500',
selectedBg: 'bg-blue-50',
selectedBgDark: 'bg-blue-950',
iconBg: 'bg-[#1677FF]',
iconSrc: '/icons/alipay.svg',
chartBar: { light: 'bg-blue-500', dark: 'bg-blue-400' },
@@ -118,6 +122,7 @@ export const PAYMENT_TYPE_META: Record<string, PaymentTypeMeta> = {
color: '#2BB741',
selectedBorder: 'border-green-500',
selectedBg: 'bg-green-50',
selectedBgDark: 'bg-green-950',
iconBg: 'bg-[#2BB741]',
iconSrc: '/icons/wxpay.svg',
chartBar: { light: 'bg-green-500', dark: 'bg-green-400' },
@@ -129,6 +134,7 @@ export const PAYMENT_TYPE_META: Record<string, PaymentTypeMeta> = {
color: '#07C160',
selectedBorder: 'border-green-600',
selectedBg: 'bg-green-50',
selectedBgDark: 'bg-green-950',
iconBg: 'bg-[#07C160]',
iconSrc: '/icons/wxpay.svg',
chartBar: { light: 'bg-emerald-500', dark: 'bg-emerald-400' },
@@ -140,6 +146,7 @@ export const PAYMENT_TYPE_META: Record<string, PaymentTypeMeta> = {
color: '#635bff',
selectedBorder: 'border-[#635bff]',
selectedBg: 'bg-[#635bff]/10',
selectedBgDark: 'bg-[#635bff]/20',
iconBg: 'bg-[#635bff]',
chartBar: { light: 'bg-purple-500', dark: 'bg-purple-400' },
buttonClass: 'bg-[#635bff] hover:bg-[#5249d9] active:bg-[#4840c4]',