55 lines
1.7 KiB
HTML
55 lines
1.7 KiB
HTML
<button
|
|
*ngIf="account.id !== specialAccountAddId"
|
|
type="button"
|
|
class="account-switcher-row tw-flex tw-w-full tw-items-center tw-gap-3 tw-rounded-md tw-border-none tw-p-3"
|
|
(click)="selectAccount(account.id)"
|
|
>
|
|
<div class="tw-flex-shrink-0">
|
|
<bit-avatar
|
|
[id]="account.id"
|
|
[text]="account.name"
|
|
[color]="account.avatarColor"
|
|
size="small"
|
|
aria-hidden="true"
|
|
></bit-avatar>
|
|
</div>
|
|
<div class="tw-text-left">
|
|
<span class="tw-sr-only" *ngIf="status.text === 'active'"> {{ "activeAccount" | i18n }}: </span>
|
|
<span class="tw-sr-only" *ngIf="status.text !== 'active'">
|
|
{{ "switchToAccount" | i18n }}
|
|
</span>
|
|
<div class="tw-max-w-64 tw-truncate">
|
|
{{ account.email }}
|
|
</div>
|
|
<div class="account-switcher-row-details tw-max-w-64 tw-truncate tw-text-sm">
|
|
<span class="tw-sr-only">{{ "hostedAt" | i18n }}</span>
|
|
{{ account.server }}
|
|
</div>
|
|
<div
|
|
class="account-switcher-row-details tw-text-sm tw-italic"
|
|
[attr.aria-hidden]="status.text === 'active'"
|
|
>
|
|
<span class="tw-sr-only">(</span>
|
|
<span [ngClass]="status.text === 'active' ? 'tw-font-bold tw-text-success' : ''">{{
|
|
status.text
|
|
}}</span>
|
|
<span class="tw-sr-only">)</span>
|
|
</div>
|
|
</div>
|
|
<div class="tw-ml-auto tw-flex-shrink-0">
|
|
<i class="bwi tw-text-2xl" [ngClass]="status.icon" aria-hidden="true"></i>
|
|
</div>
|
|
</button>
|
|
|
|
<button
|
|
*ngIf="account.id === specialAccountAddId"
|
|
type="button"
|
|
class="account-switcher-row tw-flex tw-w-full tw-items-center tw-gap-3 tw-rounded-md tw-border-none tw-p-3"
|
|
(click)="selectAccount(account.id)"
|
|
>
|
|
<i class="bwi bwi-plus tw-text-2xl" aria-hidden="true"></i>
|
|
<div>
|
|
{{ account.name }}
|
|
</div>
|
|
</button>
|