chore(apparence): opt clawx apparence and i18n settings (#410)
This commit is contained in:
@@ -51,7 +51,7 @@ interface ChannelConfigModalProps {
|
||||
onChannelSaved?: (channelType: ChannelType) => void | Promise<void>;
|
||||
}
|
||||
|
||||
const inputClasses = 'h-[44px] rounded-xl font-mono text-[13px] bg-[#eeece3] dark:bg-[#151514] border-black/10 dark:border-white/10 focus-visible:ring-2 focus-visible:ring-blue-500/50 focus-visible:border-blue-500 shadow-sm transition-all text-foreground placeholder:text-foreground/40';
|
||||
const inputClasses = 'h-[44px] rounded-xl font-mono text-[13px] bg-[#eeece3] dark:bg-muted border-black/10 dark:border-white/10 focus-visible:ring-2 focus-visible:ring-blue-500/50 focus-visible:border-blue-500 shadow-sm transition-all text-foreground placeholder:text-foreground/40';
|
||||
const labelClasses = 'text-[14px] text-foreground/80 font-bold';
|
||||
const outlineButtonClasses = 'h-9 text-[13px] font-medium rounded-full px-4 border-black/10 dark:border-white/10 bg-transparent hover:bg-black/5 dark:hover:bg-white/5 shadow-none text-foreground/80 hover:text-foreground';
|
||||
const primaryButtonClasses = 'h-9 text-[13px] font-medium rounded-full px-4 shadow-none';
|
||||
@@ -371,7 +371,7 @@ export function ChannelConfigModal({
|
||||
return (
|
||||
<div className="fixed inset-0 z-50 bg-black/50 flex items-center justify-center p-4" onClick={onClose}>
|
||||
<Card
|
||||
className="w-full max-w-3xl max-h-[90vh] flex flex-col rounded-3xl border-0 shadow-2xl bg-[#f3f1e9] dark:bg-[#1a1a19] overflow-hidden"
|
||||
className="w-full max-w-3xl max-h-[90vh] flex flex-col rounded-3xl border-0 shadow-2xl bg-[#f3f1e9] dark:bg-card overflow-hidden"
|
||||
onClick={(event) => event.stopPropagation()}
|
||||
>
|
||||
<CardHeader className="flex flex-row items-start justify-between pb-2 shrink-0">
|
||||
@@ -409,7 +409,7 @@ export function ChannelConfigModal({
|
||||
key={type}
|
||||
onClick={() => setSelectedType(type)}
|
||||
className={cn(
|
||||
'group flex items-start gap-4 p-4 rounded-2xl transition-all text-left border relative overflow-hidden bg-[#eeece3] dark:bg-[#151514] shadow-sm',
|
||||
'group flex items-start gap-4 p-4 rounded-2xl transition-all text-left border relative overflow-hidden bg-[#eeece3] dark:bg-muted shadow-sm',
|
||||
isConfigured
|
||||
? 'border-green-500/40 bg-green-500/5 dark:bg-green-500/10'
|
||||
: 'border-black/5 dark:border-white/10 hover:bg-black/5 dark:hover:bg-white/5'
|
||||
@@ -448,7 +448,7 @@ export function ChannelConfigModal({
|
||||
</div>
|
||||
) : qrCode ? (
|
||||
<div className="text-center space-y-6">
|
||||
<div className="bg-[#eeece3] dark:bg-[#151514] p-4 rounded-3xl inline-block shadow-sm border border-black/10 dark:border-white/10">
|
||||
<div className="bg-[#eeece3] dark:bg-muted p-4 rounded-3xl inline-block shadow-sm border border-black/10 dark:border-white/10">
|
||||
{qrCode.startsWith('data:image') ? (
|
||||
<img src={qrCode} alt="Scan QR Code" className="w-64 h-64 object-contain rounded-2xl" />
|
||||
) : (
|
||||
@@ -474,7 +474,7 @@ export function ChannelConfigModal({
|
||||
</div>
|
||||
</div>
|
||||
) : loadingConfig ? (
|
||||
<div className="flex items-center justify-center py-10 rounded-2xl bg-[#eeece3] dark:bg-[#151514] border border-black/10 dark:border-white/10">
|
||||
<div className="flex items-center justify-center py-10 rounded-2xl bg-[#eeece3] dark:bg-muted border border-black/10 dark:border-white/10">
|
||||
<Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
|
||||
<span className="ml-2 text-[14px] text-muted-foreground">{t('dialog.loadingConfig')}</span>
|
||||
</div>
|
||||
@@ -487,7 +487,7 @@ export function ChannelConfigModal({
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="bg-[#eeece3] dark:bg-[#151514] p-4 rounded-2xl space-y-4 shadow-sm border border-black/10 dark:border-white/10">
|
||||
<div className="bg-[#eeece3] dark:bg-muted p-4 rounded-2xl space-y-4 shadow-sm border border-black/10 dark:border-white/10">
|
||||
<div className="flex items-center justify-between gap-3">
|
||||
<div>
|
||||
<p className={labelClasses}>{t('dialog.howToConnect')}</p>
|
||||
@@ -696,7 +696,7 @@ function ConfigField({ field, value, onChange, showSecret, onToggleSecret }: Con
|
||||
variant="outline"
|
||||
size="icon"
|
||||
onClick={onToggleSecret}
|
||||
className="h-[44px] w-[44px] rounded-xl bg-[#eeece3] dark:bg-[#151514] border-black/10 dark:border-white/10 text-muted-foreground hover:text-foreground shrink-0 shadow-sm"
|
||||
className="h-[44px] w-[44px] rounded-xl bg-[#eeece3] dark:bg-muted border-black/10 dark:border-white/10 text-muted-foreground hover:text-foreground shrink-0 shadow-sm"
|
||||
>
|
||||
{showSecret ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
|
||||
</Button>
|
||||
|
||||
Reference in New Issue
Block a user