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

Customize mobile nav button appearance point

Browse Source 
Since there are different numbers of topics across
bitcoin, liquid, bisq, faq, etc.
This commit is contained in:
hunicus 2021-12-17 14:39:22 -05:00
parent 086b14e816
commit 5f9bc4497a
No known key found for this signature in database
GPG Key ID: 24837C51B6D81FD9
2 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/components/docs/api-docs.component.html
View File

@ -22,7 +22,7 @@
</div> </div>
</div> </div>
<div id="mobile-top-doc-nav" class="hide-on-desktop"><app-api-docs-nav [network]="{ val: network$ | async }"></app-api-docs-nav></div> <div id="mobile-top-doc-nav" #mobileFixedApiNav class="hide-on-desktop"><app-api-docs-nav [network]="{ val: network$ | async }"></app-api-docs-nav></div>
<div class="api-category" *ngIf="network.val !== 'bisq' && network.val !== 'liquid'"> <div class="api-category" *ngIf="network.val !== 'bisq' && network.val !== 'liquid'">

20
frontend/src/app/components/docs/api-docs.component.ts
View File

@ -1,4 +1,4 @@
import { Component, OnInit, Input } from '@angular/core'; import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
import { Env, StateService } from 'src/app/services/state.service'; import { Env, StateService } from 'src/app/services/state.service';
import { Observable, merge, of } from 'rxjs'; import { Observable, merge, of } from 'rxjs';
import { SeoService } from 'src/app/services/seo.service'; import { SeoService } from 'src/app/services/seo.service';
@ -17,6 +17,7 @@ export class ApiDocsComponent implements OnInit {
code: any; code: any;
baseNetworkUrl = ''; baseNetworkUrl = '';
@Input() restTabActivated: Boolean; @Input() restTabActivated: Boolean;
@ViewChild( "mobileFixedApiNav", { static: false } ) mobileFixedApiNav: ElementRef;
desktopDocsNavPosition = "relative"; desktopDocsNavPosition = "relative";
showFloatingDocsNav = false; showFloatingDocsNav = false;
mobileMenuOpen = true; mobileMenuOpen = true;
@ -26,6 +27,16 @@ export class ApiDocsComponent implements OnInit {
private seoService: SeoService, private seoService: SeoService,
) { } ) { }
ngAfterViewInit() {
const that = this;
setTimeout( () => {
window.addEventListener('scroll', function() {
that.desktopDocsNavPosition = ( window.pageYOffset > 182 ) ? "fixed" : "relative";
that.showFloatingDocsNav = ( window.pageYOffset > ( that.mobileFixedApiNav.nativeElement.offsetHeight + 188 ) ) ? true : false;
});
}, 1 );
}
ngOnInit(): void { ngOnInit(): void {
this.env = this.stateService.env; this.env = this.stateService.env;
this.seoService.setTitle($localize`:@@e351b40b3869a5c7d19c3d4918cb1ac7aaab95c4:API`); this.seoService.setTitle($localize`:@@e351b40b3869a5c7d19c3d4918cb1ac7aaab95c4:API`);
@ -38,13 +49,6 @@ export class ApiDocsComponent implements OnInit {
}) })
); );
//to toggle fixed menu for desktop navigation
const that = this;
window.addEventListener('scroll', function() {
that.desktopDocsNavPosition = ( window.pageYOffset > 182 ) ? "fixed" : "relative";
that.showFloatingDocsNav = ( window.pageYOffset > 1425 ) ? true : false;
});
if (document.location.port !== '') { if (document.location.port !== '') {
this.hostname = `${this.hostname}:${document.location.port}`; this.hostname = `${this.hostname}:${document.location.port}`;
} }