44 lines
1.1 KiB
HTML
44 lines
1.1 KiB
HTML
|
<aside
|
||
|
|
class="nav-rail"
|
||
|
|
[class.nav-rail--expanded]="expanded()"
|
||
|
|
[attr.aria-label]="'Navigation'"
|
||
|
|
>
|
||
|
|
<!-- Header with OpenClaw brand -->
|
||
|
|
<div class="nav-rail__header">
|
||
|
|
<button
|
||
|
|
class="nav-rail__toggle"
|
||
|
|
(click)="toggleExpand()"
|
||
|
|
[attr.aria-label]="expanded() ? 'Collapse navigation' : 'Expand navigation'"
|
||
|
|
[attr.aria-expanded]="expanded()"
|
||
|
|
>
|
||
|
|
<mat-icon>menu</mat-icon>
|
||
|
|
</button>
|
||
|
|
@if (expanded()) {
|
||
|
|
<span class="nav-rail__brand">OpenClaw</span>
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Navigation destinations -->
|
||
|
|
<nav class="nav-rail__nav">
|
||
|
|
@for (dest of destinations; track dest.route) {
|
||
|
|
<a
|
||
|
|
[routerLink]="dest.route"
|
||
|
|
routerLinkActive="nav-rail__item--active"
|
||
|
|
[attr.aria-label]="dest.label"
|
||
|
|
class="nav-rail__item"
|
||
|
|
>
|
||
|
|
<mat-icon
|
||
|
|
[matBadge]="dest.badge ?? 0"
|
||
|
|
[matBadgeHidden]="!dest.badge"
|
||
|
|
matBadgePosition="above after"
|
||
|
|
matBadgeSize="small"
|
||
|
|
>
|
||
|
|
{{ dest.icon }}
|
||
|
|
</mat-icon>
|
||
|
|
@if (expanded()) {
|
||
|
|
<span class="nav-rail__label">{{ dest.label }}</span>
|
||
|
|
}
|
||
|
|
</a>
|
||
|
|
}
|
||
|
|
</nav>
|
||
|
|
</aside>
|