mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
54 lines
1.7 KiB
HTML
54 lines
1.7 KiB
HTML
<nav #navBar mat-tab-nav-bar [color]="'accent'">
|
|
<div id="nav-buttons">
|
|
<button mat-icon-button color="primary" (click)="toggleInspector()">
|
|
<mat-icon [ngClass]="{ 'inspector-active': inspectorRunning }">
|
|
pin_end
|
|
</mat-icon>
|
|
</button>
|
|
<button mat-icon-button color="primary" (click)="refresh()">
|
|
<mat-icon>
|
|
refresh
|
|
</mat-icon>
|
|
</button>
|
|
<button mat-icon-button color="primary" [matMenuTriggerFor]="menu">
|
|
<mat-icon>
|
|
settings
|
|
</mat-icon>
|
|
</button>
|
|
</div>
|
|
<a class="mat-tab-link" mat-tab-link *ngFor="let tab of tabs" (click)="changeTab(tab)" [active]="activeTab === tab">
|
|
{{ tab }}
|
|
</a>
|
|
<section *ngIf="angularVersion" id="app-angular-version">
|
|
Angular version:
|
|
<span id="version-number">
|
|
{{ angularVersion }}
|
|
</span>
|
|
<ng-container *ngIf="latestSHA; let sha"> | DevTools SHA: {{ sha }} </ng-container>
|
|
</section>
|
|
</nav>
|
|
|
|
<div class="tab-content">
|
|
<ng-directive-explorer
|
|
[ngClass]="{ hidden: activeTab !== 'Components' }"
|
|
(toggleInspector)="toggleInspector()"
|
|
></ng-directive-explorer>
|
|
<ng-profiler [ngClass]="{ hidden: activeTab !== 'Profiler' }"></ng-profiler>
|
|
<ng-router-tree [routes]="routes" [ngClass]="{ hidden: activeTab !== 'Router Tree' }"></ng-router-tree>
|
|
</div>
|
|
|
|
<mat-menu #menu="matMenu" class="options-menu">
|
|
<mat-slide-toggle (change)="toggleTimingAPI($event)" class="menu-toggle-button" (click)="$event.stopPropagation()">
|
|
Enable timing API
|
|
</mat-slide-toggle>
|
|
<br />
|
|
<br />
|
|
<mat-slide-toggle
|
|
[checked]="currentTheme === 'dark-theme'"
|
|
(change)="themeService.toggleDarkMode($event.checked)"
|
|
class="menu-toggle-button"
|
|
(click)="$event.stopPropagation()"
|
|
>
|
|
Dark Mode
|
|
</mat-slide-toggle>
|
|
</mat-menu>
|