mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2024-12-29 09:44:26 +01:00
Code Issues Projects Releases Wiki Activity

Removing hamburger menu on mobile. Adjusted icon sizes.

Browse Source
This commit is contained in:
softsimon 2020-09-22 06:13:27 +07:00
parent b67b025dc2
commit 9e3fad610c
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
2 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/app/components/master-page/master-page.component.html
View File

@ -23,42 +23,38 @@
</div> </div>
</div> </div>
<button class="navbar-toggler" type="button" (click)="collapse()"> <div class="navbar-collapse" id="navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="navbarCollapse" [ngClass]="{'show': navCollapsed}">
<ul class="navbar-nav mr-auto pt-2 pb-2 pb-md-0 pt-md-0 {{ network.val }}"> <ul class="navbar-nav mr-auto pt-2 pb-2 pb-md-0 pt-md-0 {{ network.val }}">
<ng-template [ngIf]="network.val === 'bisq'" [ngIfElse]="notBisq"> <ng-template [ngIf]="network.val === 'bisq'" [ngIfElse]="notBisq">
<li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"> <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
<a class="nav-link" [routerLink]="['/bisq']" (click)="collapse()"><fa-icon [icon]="['fas', 'list']" size="lg" [fixedWidth]="true" title="Transactions"></fa-icon></a> <a class="nav-link" [routerLink]="['/bisq']" (click)="collapse()"><fa-icon [icon]="['fas', 'list']" [fixedWidth]="true" title="Transactions"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/bisq/blocks']" (click)="collapse()"><fa-icon [icon]="['fas', 'th-list']" size="lg" [fixedWidth]="true" title="Blocks"></fa-icon></a> <a class="nav-link" [routerLink]="['/bisq/blocks']" (click)="collapse()"><fa-icon [icon]="['fas', 'th-list']" [fixedWidth]="true" title="Blocks"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/bisq/stats']" (click)="collapse()"><fa-icon [icon]="['fas', 'tachometer-alt']" size="lg" [fixedWidth]="true" title="Stats"></fa-icon></a> <a class="nav-link" [routerLink]="['/bisq/stats']" (click)="collapse()"><fa-icon [icon]="['fas', 'tachometer-alt']" [fixedWidth]="true" title="Stats"></fa-icon></a>
</li> </li>
</ng-template> </ng-template>
<ng-template #notBisq> <ng-template #notBisq>
<li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"> <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
<a class="nav-link" [routerLink]="['/' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'cube']" size="lg" [fixedWidth]="true" title="Dashboard"></fa-icon></a> <a class="nav-link" [routerLink]="['/' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'cube']" [fixedWidth]="true" title="Dashboard"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/blocks' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'th-list']" size="lg" [fixedWidth]="true" title="Blocks"></fa-icon></a> <a class="nav-link" [routerLink]="['/blocks' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'th-list']" [fixedWidth]="true" title="Blocks"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/graphs' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'chart-area']" size="lg" [fixedWidth]="true" title="Graphs"></fa-icon></a> <a class="nav-link" [routerLink]="['/graphs' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'chart-area']" [fixedWidth]="true" title="Graphs"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/tv' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'tv']" size="lg" [fixedWidth]="true" title="Full screen TV view"></fa-icon></a> <a class="nav-link" [routerLink]="['/tv' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'tv']" [fixedWidth]="true" title="Full screen TV view"></fa-icon></a>
</li> </li>
</ng-template> </ng-template>
<li *ngIf="network.val === 'liquid'" class="nav-item" routerLinkActive="active"> <li *ngIf="network.val === 'liquid'" class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/liquid/assets']" (click)="collapse()"><fa-icon [icon]="['fas', 'database']" size="lg" [fixedWidth]="true" title="Assets"></fa-icon></a> <a class="nav-link" [routerLink]="['/liquid/assets']" (click)="collapse()"><fa-icon [icon]="['fas', 'database']" [fixedWidth]="true" title="Assets"></fa-icon></a>
</li> </li>
<li class="nav-item" routerLinkActive="active"> <li class="nav-item" routerLinkActive="active">
<a class="nav-link" [routerLink]="['/about' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'info-circle']" size="lg" [fixedWidth]="true" title="About"></fa-icon></a> <a class="nav-link" [routerLink]="['/about' | relativeUrl]" (click)="collapse()"><fa-icon [icon]="['fas', 'info-circle']" [fixedWidth]="true" title="About"></fa-icon></a>
</li> </li>
</ul> </ul>
<app-search-form location="top" (searchTriggered)="collapse()"></app-search-form> <app-search-form location="top" (searchTriggered)="collapse()"></app-search-form>

7
frontend/src/app/components/master-page/master-page.component.scss
View File

@ -6,6 +6,10 @@ li.nav-item {
padding: 10px; padding: 10px;
} }
fa-icon {
font-size: 1.5em;
}
.navbar { .navbar {
z-index: 100; z-index: 100;
} }
@ -14,6 +18,9 @@ li.nav-item {
.navbar { .navbar {
padding: 0rem 1rem; padding: 0rem 1rem;
} }
fa-icon {
font-size: 1.2em;
}
} }
.logo { .logo {