fix(right-click-restorer): prevent domain overflow in domain card

- Add truncate/min-w-0/flex-1 to domain code block for ellipsis
- Add shrink-0 to Badge to prevent compression
- Add gap-2 for consistent spacing
This commit is contained in:
雨霖铃
2026-05-23 12:41:42 +08:00
parent fa0f1bdcad
commit 4c08e17b19
+6 -4
View File
@@ -25,15 +25,17 @@ export default function RightClickRestorerPage() {
<div className="w-full rounded-xl border border-border bg-card text-card-foreground shadow-sm overflow-hidden transition-all"> <div className="w-full rounded-xl border border-border bg-card text-card-foreground shadow-sm overflow-hidden transition-all">
<div className="p-4"> <div className="p-4">
<Label className="text-sm font-medium">{t('rightClickRestorer:currentDomain')}</Label> <Label className="text-sm font-medium">{t('rightClickRestorer:currentDomain')}</Label>
<div className="mt-2 flex items-center justify-between"> <div className="mt-2 flex items-center justify-between gap-2">
<code className="text-sm bg-muted px-2 py-1 rounded">{domain || '—'}</code> <code className="text-sm bg-muted px-2 py-1 rounded truncate min-w-0 flex-1">
{domain || '—'}
</code>
{isUnlocked ? ( {isUnlocked ? (
<Badge variant="default" className="gap-1 bg-green-600 hover:bg-green-700"> <Badge variant="default" className="gap-1 bg-green-600 hover:bg-green-700 shrink-0">
<ShieldCheck className="h-3 w-3" /> <ShieldCheck className="h-3 w-3" />
{t('rightClickRestorer:statusUnlocked')} {t('rightClickRestorer:statusUnlocked')}
</Badge> </Badge>
) : ( ) : (
<Badge variant="secondary" className="gap-1"> <Badge variant="secondary" className="gap-1 shrink-0">
<Shield className="h-3 w-3" /> <Shield className="h-3 w-3" />
{t('rightClickRestorer:statusLocked')} {t('rightClickRestorer:statusLocked')}
</Badge> </Badge>