27 lines
1.0 KiB
HTML
27 lines
1.0 KiB
HTML
<div class="w-screen bg-none backdrop-blur-md">
|
|
<p-menubar
|
|
[model]="items"
|
|
[style]="{ background: 'none', height: '4rem'}"
|
|
>
|
|
<ng-template #item let-item let-root="root">
|
|
<a pRipple class="flex items-center p-menubar-item-link">
|
|
<span>{{ item.label }}</span>
|
|
<p-badge *ngIf="item.badge" [ngClass]="{ 'ml-auto': !root, 'ml-2': root }" [value]="item.badge" />
|
|
<span *ngIf="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
|
|
<i *ngIf="item.items" [ngClass]="['ml-auto pi', root ? 'pi-angle-down' : 'pi-angle-right']"></i>
|
|
</a>
|
|
</ng-template>
|
|
<ng-template #end>
|
|
<div class="flex items-center gap-2">
|
|
<input
|
|
type="text"
|
|
pInputText
|
|
placeholder="Search"
|
|
class="w-36"
|
|
/>
|
|
<p-avatar image="https://primefaces.org/cdn/primeng/images/demo/avatar/amyelsner.png" shape="circle" />
|
|
</div>
|
|
</ng-template>
|
|
</p-menubar>
|
|
</div>
|