diff options
| author |   Sudarshan Kumar <sudarshan.kumar@att.com> | 2020-07-28 14:49:12 +0530 |
|---|---|---|
| committer | Sudarshan Kumar <sudarshan.kumar@att.com> | 2020-07-28 14:50:31 +0530 |
| commit | d40f33fbd54f5af5ce0c925f6d110f9569710349 (patch) | |
| tree | cdeadd5a35c265691b4b3c3482f0a6478bab467f /portal-FE-common/src/app | |
| parent | 5e143ef255badb5e0304dd4370461c5b5b158bde (diff) | |
Multitab-Implemented z-index
Multitab-Implemented z-index
Issue-ID: PORTAL-936
Change-Id: Ifad254d70516f3ae62c1e5d975723fa85dd7714d
Signed-off-by: Sudarshan Kumar <sudarshan.kumar@att.com>
Diffstat (limited to 'portal-FE-common/src/app')
| -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> |