fix(ui): unify the 2FA status badge into one x-two-factor-badge component
Replace three divergent 2FA indicator styles (cyan x-badge in users list, custom inline-flex chip in settings header, plain mono text in sidebar) with a single x-two-factor-badge component using the cyan x-badge + shield icon style and the canonical settings.two_factor_on/off lang keys throughout. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>feat/v1-foundation
parent
001f44d959
commit
ffc17966ef
|
|
@ -45,7 +45,7 @@
|
|||
<span class="grid h-8 w-8 shrink-0 place-items-center rounded-full bg-raised font-mono text-xs text-ink-2">{{ strtoupper(substr($u?->name ?? 'U', 0, 2)) }}</span>
|
||||
<span class="min-w-0 flex-1">
|
||||
<span class="block truncate text-sm text-ink">{{ $u?->name ?? '—' }}</span>
|
||||
<span class="block truncate font-mono text-[11px] {{ $u?->hasTwoFactorEnabled() ? 'text-online' : 'text-ink-3' }}">{{ $u?->hasTwoFactorEnabled() ? __('shell.twofa_on') : __('shell.twofa_off') }}</span>
|
||||
<x-two-factor-badge :enabled="$u?->hasTwoFactorEnabled() ?? false" />
|
||||
</span>
|
||||
</a>
|
||||
<form method="POST" action="{{ route('logout') }}" class="shrink-0">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
@props(['enabled' => false])
|
||||
@if ($enabled)
|
||||
<x-badge tone="cyan">
|
||||
<x-icon name="shield" class="h-3 w-3" /> {{ __('settings.two_factor_on') }}
|
||||
</x-badge>
|
||||
@else
|
||||
<x-badge tone="neutral">{{ __('settings.two_factor_off') }}</x-badge>
|
||||
@endif
|
||||
|
|
@ -26,13 +26,7 @@
|
|||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<x-badge tone="neutral">{{ __('settings.role_admin') }}</x-badge>
|
||||
<span @class([
|
||||
'inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 font-mono text-[11px]',
|
||||
'border-online/30 text-online' => $twoFactorEnabled,
|
||||
'border-line text-ink-3' => ! $twoFactorEnabled,
|
||||
])>
|
||||
<x-status-dot :status="$twoFactorEnabled ? 'online' : 'offline'" />{{ $twoFactorEnabled ? __('settings.two_factor_on') : __('settings.two_factor_off') }}
|
||||
</span>
|
||||
<x-two-factor-badge :enabled="$twoFactorEnabled" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -24,13 +24,7 @@
|
|||
@if ($isSelf)
|
||||
<x-badge tone="accent">{{ __('accounts.you') }}</x-badge>
|
||||
@endif
|
||||
@if ($user->hasTwoFactorEnabled())
|
||||
<x-badge tone="cyan">
|
||||
<x-icon name="shield" class="h-3 w-3" /> {{ __('accounts.twofa_on') }}
|
||||
</x-badge>
|
||||
@else
|
||||
<x-badge tone="neutral">{{ __('accounts.twofa_off') }}</x-badge>
|
||||
@endif
|
||||
<x-two-factor-badge :enabled="$user->hasTwoFactorEnabled()" />
|
||||
</div>
|
||||
<p class="truncate font-mono text-[11px] text-ink-3">{{ $user->email }}</p>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue