-
Placeholder.
+
+ Placeholder.
diff --git a/frontend/src/app/components/docs/api-docs.component.scss b/frontend/src/app/components/docs/api-docs.component.scss
index 077bc3dc2..8049ef9aa 100644
--- a/frontend/src/app/components/docs/api-docs.component.scss
+++ b/frontend/src/app/components/docs/api-docs.component.scss
@@ -74,9 +74,18 @@ li.nav-item {
.doc-nav-desktop {
width: 25%;
+}
+
+.doc-nav-desktop.relative {
float: left;
}
+.doc-nav-desktop.fixed {
+ float: unset;
+ position: fixed;
+ top: 20px;
+}
+
.doc-content {
width: 75%;
float: right;
diff --git a/frontend/src/app/components/docs/api-docs.component.ts b/frontend/src/app/components/docs/api-docs.component.ts
index a38ded836..724ecdc3f 100644
--- a/frontend/src/app/components/docs/api-docs.component.ts
+++ b/frontend/src/app/components/docs/api-docs.component.ts
@@ -17,6 +17,7 @@ export class ApiDocsComponent implements OnInit {
code: any;
baseNetworkUrl = '';
@Input() restTabActivated: Boolean;
+ docsNavPosition = "relative";
constructor(
private stateService: StateService,
@@ -35,6 +36,16 @@ export class ApiDocsComponent implements OnInit {
})
);
+ //to toggle fixed menu for desktop navigation
+ let that = this;
+ window.addEventListener('scroll', function() {
+ if( window.pageYOffset > 182 ) {
+ that.docsNavPosition = "fixed";
+ } else {
+ that.docsNavPosition = "relative";
+ }
+ });
+
if (document.location.port !== '') {
this.hostname = `${this.hostname}:${document.location.port}`;
}