mempool/frontend/src/app/master-page/master-page.component.html

<header>
  <nav class="navbar navbar-expand-md navbar-dark bg-dark">
  <a class="navbar-brand" routerLink="/"><img src="/assets/mempool-space-logo.png" width="180" class="logo"> <span class="badge badge-warning" style="margin-left: 10px;" *ngIf="isOffline">Offline</span></a>
  
  <button class="navbar-toggler" type="button" (click)="collapse()" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  
  <div class="navbar-collapse collapse" id="navbarCollapse" [ngClass]="{'show': navCollapsed}">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item" routerLinkActive="active" [ngClass]="{'active': txActive.isActive}" [routerLinkActiveOptions]="{exact: true}">
        <a class="nav-link" routerLink="/" (click)="collapse()">Blocks</a>
        <a class="nav-link" routerLink="/tx" routerLinkActive #txActive="routerLinkActive" style="display: none;"></a>
      </li>
      <li class="nav-item" routerLinkActive="active">
        <a class="nav-link" routerLink="/graphs" (click)="collapse()">Graphs</a>
      </li>
      <li class="nav-item" routerLinkActive="active">
        <a class="nav-link" routerLink="/tv" (click)="collapse()">TV view &nbsp;<img src="./assets/expand.png" width="15"/></a>
      </li>
      <li class="nav-item" routerLinkActive="active" *ngIf="isEsploraEnabled">
        <a class="nav-link" routerLink="/explorer" (click)="collapse()">Explorer</a>
      </li>
      <li class="nav-item" routerLinkActive="active">
        <a class="nav-link" routerLink="/about" (click)="collapse()">About</a>
      </li>
    </ul>
    <form [formGroup]="searchForm" class="form-inline mt-2 mt-md-0 mr-4" (submit)="searchForm.valid && search()" novalidate>
      
      <ng-template [ngIf]="currentBaseRoot === 'explorer'" [ngIfElse]="defaultSearchBar">
        <input formControlName="txId" required style="width: 310px;" class="form-control mr-sm-2" type="text" placeholder="Search transaction id or address..." aria-label="Search">
        <button class="btn btn-primary my-2 my-sm-0" type="submit" style="width: 78px;">Search</button>
      </ng-template>
      
      <ng-template #defaultSearchBar>
        <input formControlName="txId" required style="width: 310px;" class="form-control mr-sm-2" type="text" placeholder="Track transaction (txid)" aria-label="Search">
        <button class="btn btn-primary my-2 my-sm-0" type="submit" style="width: 78px;">Track</button>
      </ng-template>
    </form>
  </div>
</nav>
</header>

<br />

<router-outlet></router-outlet>