mirror of
https://github.com/bitwarden/browser
synced 2026-01-27 14:53:44 +00:00
* WIP * add new link styles * update link stories * skip default screenshot as variations are covered in other stories * updated docs and story background * make default the default linkType value * remove references to primary link type in CL * use better bg colors in stories * remove duplicate linkType * update aria-disabled text to use new palette * add back primary link type to story * fix capitolization * add backticks to variant names in docs * remove important from link styles * fix generic selector to find correct button * fix capitolization * mark variants as deprecated in docs * fix link hover text colors
83 lines
2.4 KiB
HTML
83 lines
2.4 KiB
HTML
@for (breadcrumb of beforeOverflow(); track breadcrumb; let last = $last) {
|
|
@if (breadcrumb.route(); as route) {
|
|
<a
|
|
bitLink
|
|
class="tw-my-2 tw-inline-block"
|
|
[routerLink]="route"
|
|
[queryParams]="breadcrumb.queryParams()"
|
|
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
|
|
>
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</a>
|
|
} @else {
|
|
<button
|
|
type="button"
|
|
bitLink
|
|
class="tw-my-2 tw-inline-block"
|
|
(click)="breadcrumb.onClick($event)"
|
|
>
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</button>
|
|
}
|
|
@if (!last) {
|
|
<i class="bwi bwi-angle-right tw-mx-1.5 tw-text-main"></i>
|
|
}
|
|
}
|
|
|
|
@if (hasOverflow()) {
|
|
@if (beforeOverflow().length > 0) {
|
|
<i class="bwi bwi-angle-right tw-mx-1.5 tw-text-main"></i>
|
|
}
|
|
<button
|
|
type="button"
|
|
bitIconButton="bwi-ellipsis-h"
|
|
[bitMenuTriggerFor]="overflowMenu"
|
|
size="small"
|
|
[label]="'moreBreadcrumbs' | i18n"
|
|
></button>
|
|
<bit-menu #overflowMenu>
|
|
@for (breadcrumb of overflow(); track breadcrumb) {
|
|
@if (breadcrumb.route(); as route) {
|
|
<a
|
|
bitMenuItem
|
|
[routerLink]="route"
|
|
[queryParams]="breadcrumb.queryParams()"
|
|
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
|
|
>
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</a>
|
|
} @else {
|
|
<button type="button" bitMenuItem (click)="breadcrumb.onClick($event)">
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</button>
|
|
}
|
|
}
|
|
</bit-menu>
|
|
<i class="bwi bwi-angle-right tw-mx-1.5 tw-text-main"></i>
|
|
@for (breadcrumb of afterOverflow(); track breadcrumb; let last = $last) {
|
|
@if (breadcrumb.route(); as route) {
|
|
<a
|
|
bitLink
|
|
class="tw-my-2 tw-inline-block"
|
|
[routerLink]="route"
|
|
[queryParams]="breadcrumb.queryParams()"
|
|
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
|
|
>
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</a>
|
|
} @else {
|
|
<button
|
|
type="button"
|
|
bitLink
|
|
class="tw-my-2 tw-inline-block"
|
|
(click)="breadcrumb.onClick($event)"
|
|
>
|
|
<ng-container [ngTemplateOutlet]="breadcrumb.content()"></ng-container>
|
|
</button>
|
|
}
|
|
@if (!last) {
|
|
<i class="bwi bwi-angle-right tw-mx-1.5 tw-text-main"></i>
|
|
}
|
|
}
|
|
}
|