diff options
| author |   Sunder Tattavarada <statta@research.att.com> | 2020-07-31 02:42:56 +0000 |
|---|---|---|
| committer |   Gerrit Code Review <gerrit@onap.org> | 2020-07-31 02:42:56 +0000 |
| commit | 2b5bd61f8db925c2331ae5dbb377840ad6eb1e3b (patch) | |
| tree | 8ca7cc86304bb5966fafbbbcc94d896561b89fe7 | |
| parent | f9bdb313d02b46317a44a3e11f2ba548fbcc8307 (diff) | |
| parent | d40f33fbd54f5af5ce0c925f6d110f9569710349 (diff) | |
Merge "Multitab-Implemented z-index"
| -rw-r--r-- | portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html | 39 |
1 files changed, 23 insertions, 16 deletions
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html index 65ccf1dc..db0b6afd 100644 --- a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html +++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html @@ -35,6 +35,17 @@ --> + <style> + .apps-tab { + position: absolute; + width: 100%; + height: 100%; + top: 100px; + left: 5px; + background-color: white; + } + </style> + <div style="display: flex; flex-direction:column"> <mat-tab-group [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)" @@ -79,19 +90,15 @@ </mat-tab-group> - - - - - <div *ngFor="let tab of tabs; let index = index" - [style.display]='tab.active? "inline" : "none"' - [style.position]='tab.active? "static" : "absolute"' - [style.height]='tab.active? "calc(100vh)" : "calc(0vh)"'> - - <iframe id="tabframe-{{tab.label.split(' ').join('-')}}-{{index}}" scrolling='yes' frameBorder='0' width='100%' - scrolling='yes' frameBorder='0' width='100%' height='90%' [src]='tab.url'></iframe> - - </div> - - - </div> + <div class="apps-tab" *ngFor="let tab of tabs; let index = index" + [style.display]='"inline"' + [style.position]='"absolute"' + [style.height]='"calc(100vh)"' + [style.z-index]="tab.active? 1 : 0" + [style.opacity]="tab.active? 1 : 0" + > + <iframe id="tabframe-{{tab.label.split(' ').join('-')}}-{{index}}" scrolling='yes' frameBorder='0' + scrolling='yes' frameBorder='0' width='100%' height='90%' [src]='tab.url'> + </iframe> + </div> +</div> |