machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix graph menu styling

Browse Source
This commit is contained in:
natsoni 2024-05-04 16:56:02 +02:00
parent 453a2224cd
commit 6d595dcdb6
No known key found for this signature in database
GPG Key ID: C65917583181743B
4 changed files with 11 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/app/components/graphs/graphs.component.html
View File

@ -1,9 +1,9 @@
<div *ngIf="stateService.env.MINING_DASHBOARD || stateService.env.LIGHTNING || stateService.env.ACCELERATOR" class="mb-3 d-flex menu"> <div *ngIf="stateService.env.MINING_DASHBOARD || stateService.env.LIGHTNING || stateService.env.ACCELERATOR" class="mb-3 d-flex menu" [style]="{'flex-wrap': flexWrap ? 'wrap' : ''}">
<a routerLinkActive="active" class="btn btn-primary" [class]="padding" <a routerLinkActive="active" class="btn btn-primary w-33"
[routerLink]="['/graphs/mempool' | relativeUrl]">Mempool</a> [routerLink]="['/graphs/mempool' | relativeUrl]">Mempool</a>
<div ngbDropdown [class]="padding" *ngIf="stateService.env.MINING_DASHBOARD"> <div ngbDropdown class="w-33" *ngIf="stateService.env.MINING_DASHBOARD">
<button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="mining">Mining</button> <button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="mining">Mining</button>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1"> <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/mining/pools' | relativeUrl]" <a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/mining/pools' | relativeUrl]"
@ -28,7 +28,7 @@
</div> </div>
</div> </div>
<div ngbDropdown [class]="padding" *ngIf="stateService.env.LIGHTNING"> <div ngbDropdown class="w-33" *ngIf="stateService.env.LIGHTNING">
<button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="lightning">Lightning</button> <button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="lightning">Lightning</button>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1"> <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]" <a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/lightning/nodes-networks' | relativeUrl]"
@ -46,12 +46,11 @@
</div> </div>
</div> </div>
<div ngbDropdown [class]="padding" *ngIf="stateService.env.ACCELERATOR"> <div ngbDropdown class="w-33" *ngIf="stateService.env.ACCELERATOR">
<button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="accelerator.accelerations">Accelerations</button> <button class="btn btn-primary w-100" id="dropdownBasic1" ngbDropdownToggle i18n="accelerator.accelerations">Accelerations</button>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1"> <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/acceleration/fees' | relativeUrl]" <a class="dropdown-item" routerLinkActive="active" [routerLink]="['/graphs/acceleration/fees' | relativeUrl]"
i18n="accelerator.acceleration-fees">Acceleration Fees</a> i18n="accelerator.acceleration-fees">Acceleration Fees</a>
</div> </div>
</div> </div>
</div> </div>

4
frontend/src/app/components/graphs/graphs.component.scss
View File

@ -1,5 +1,5 @@
.menu { .menu {
flex-wrap: wrap; flex-grow: 1;
padding: 0 35px; padding: 0 35px;
@media (min-width: 576px) { @media (min-width: 576px) {
max-width: 600px; max-width: 600px;
@ -11,6 +11,6 @@
&.last-child { &.last-child {
margin-inline-end: 0; margin-inline-end: 0;
} }
margin-bottom: 5px; margin-bottom: 5px;
} }
} }

6
frontend/src/app/components/graphs/graphs.component.ts
View File

@ -8,7 +8,7 @@ import { WebsocketService } from '../../services/websocket.service';
styleUrls: ['./graphs.component.scss'], styleUrls: ['./graphs.component.scss'],
}) })
export class GraphsComponent implements OnInit { export class GraphsComponent implements OnInit {
padding = 'w-50'; flexWrap = false;
constructor( constructor(
public stateService: StateService, public stateService: StateService,
@ -18,8 +18,8 @@ export class GraphsComponent implements OnInit {
ngOnInit(): void { ngOnInit(): void {
this.websocketService.want(['blocks']); this.websocketService.want(['blocks']);
if (this.stateService.env.MINING_DASHBOARD === true && this.stateService.env.LIGHTNING === true) { if (this.stateService.env.ACCELERATOR === true && (this.stateService.env.MINING_DASHBOARD === true || this.stateService.env.LIGHTNING === true)) {
this.padding = 'w-33'; this.flexWrap = true;
} }
} }
} }

2
frontend/src/app/components/statistics/statistics.component.scss
View File

@ -53,7 +53,7 @@
} }
} }
.formRadioGroup.mining { .formRadioGroup.mining {
@media (min-width: 1035px) { @media (min-width: 1200px) {
position: relative; position: relative;
top: -100px; top: -100px;
} }