|
|
|
<div fxLayout="column" id="rtl-container" class="rtl-container" [ngClass]="settings.theme" [class.horizontal]="settings.menu === 'Horizontal'" [class.compact]="settings.menuType === 'Compact'" [class.mini]="settings.menuType === 'Mini'">
|
|
|
|
<mat-sidenav-container>
|
|
|
|
<mat-sidenav perfectScrollbar *ngIf="settings.menu === 'Vertical'" [opened]="settings.flgSidenavOpened" [mode]="(settings.flgSidenavPinned) ? 'side' : 'over'"
|
|
|
|
#sideNavigation class="sidenav mat-elevation-z6 overflow-auto">
|
|
|
|
<rtl-side-navigation (ChildNavClicked)="onNavigationClicked($event)"></rtl-side-navigation>
|
|
|
|
</mat-sidenav>
|
|
|
|
<mat-sidenav-content perfectScrollbar class="overflow-auto">
|
|
|
|
<mat-toolbar fxLayout="row" fxLayoutAlign="space-between center" class="padding-gap-x bg-primary">
|
|
|
|
<div fxLayoutAlign="center center">
|
|
|
|
<button *ngIf="settings.menu === 'Vertical'" mat-icon-button (click)="sideNavToggle()">
|
|
|
|
<mat-icon>menu</mat-icon>
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<h2>Ride The Lightning <span class="font-60-percent">(Beta)</span></h2>
|
|
|
|
</div>
|
|
|
|
<div fxLayoutAlign="space-between center">
|
|
|
|
<rtl-top-menu></rtl-top-menu>
|
|
|
|
</div>
|
|
|
|
</mat-toolbar>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="center center" class="bg-primary flex-wrap pubkey-info-top" rtlClipboard [payload]="information?.identity_pubkey" (copied)="copiedText($event)">
|
|
|
|
<mat-icon [ngClass]="{'icon-smaller': smallScreen}">vpn_key</mat-icon>
|
|
|
|
<div [ngClass]="{'word-break font-9px': smallScreen, 'word-break': !smallScreen}"> {{information?.identity_pubkey}}
|
|
|
|
<mat-spinner [diameter]="20" *ngIf="flgLoading[0]" class="inline-spinner foreground"></mat-spinner>
|
|
|
|
<fa-icon [icon]="faCopy"></fa-icon>
|
|
|
|
<span [hidden]="!flgCopied">Copied</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<mat-toolbar color="primary" *ngIf="settings.menu === 'Horizontal'" class="padding-gap-x horizontal-nav">
|
|
|
|
<div fxLayout="row" fxFlex="100" fxLayoutAlign="center center" class="h-100">
|
|
|
|
<rtl-horizontal-navigation></rtl-horizontal-navigation>
|
|
|
|
</div>
|
|
|
|
</mat-toolbar>
|
|
|
|
<div [ngClass]="{'mt-minus-1': smallScreen, 'inner-sidenav-content': true}">
|
|
|
|
<router-outlet></router-outlet>
|
|
|
|
</div>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="center center" class="bg-primary settings-icon" (click)="settingSidenav.toggle()">
|
|
|
|
<mat-icon class="animate-settings">settings</mat-icon>
|
|
|
|
</div>
|
|
|
|
</mat-sidenav-content>
|
|
|
|
<mat-sidenav #settingSidenav position="end" class="settings mat-elevation-z6" mode="side">
|
|
|
|
<rtl-settings-nav (done)="settingSidenav.toggle()"></rtl-settings-nav>
|
|
|
|
</mat-sidenav>
|
|
|
|
</mat-sidenav-container>
|
|
|
|
<div class="rtl-spinner" *ngIf="undefined === settings.theme">
|
|
|
|
<mat-spinner color="accent"></mat-spinner>
|
|
|
|
<h4>Loading RTL...</h4>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- <div perfectScrollbar id="rtl-container" class="rtl-container purple-white-light-theme">
|
|
|
|
<mat-toolbar class="bg-alternate-primary toolbar-nodes">
|
|
|
|
<div class="toolbar-node-info">Node 1</div>
|
|
|
|
<div class="toolbar-node-info">Node 2</div>
|
|
|
|
<span class="spacer"></span>
|
|
|
|
<div fxLayoutAlign="space-between center">
|
|
|
|
<rtl-top-menu></rtl-top-menu>
|
|
|
|
</div>
|
|
|
|
</mat-toolbar>
|
|
|
|
<mat-sidenav-container class="container">
|
|
|
|
<mat-sidenav #sidenav class="bg-primary mat-elevation-z24" mode="side">
|
|
|
|
<p><button mat-raised-button class="bg-accent" (click)="sidenav.toggle()">Toggle</button></p>
|
|
|
|
</mat-sidenav>
|
|
|
|
<mat-sidenav-content>
|
|
|
|
<mat-toolbar class="bg-primary toolbar">
|
|
|
|
<span>Lightning Menu</span>
|
|
|
|
<span class="spacer"></span>
|
|
|
|
<p><button mat-raised-button class="btn-primary-darker" (click)="sidenav.toggle()">show public key</button></p>
|
|
|
|
</mat-toolbar>
|
|
|
|
<router-outlet></router-outlet>
|
|
|
|
</mat-sidenav-content>
|
|
|
|
</mat-sidenav-container>
|
|
|
|
</div> -->
|