From: Sunder Tattavarada <statta@research.att.com>
Date: Fri, 31 Jul 2020 02:42:56 +0000 (+0000)
Subject: Merge "Multitab-Implemented z-index"
X-Git-Tag: 3.4.0~38
X-Git-Url: https://gerrit.onap.org/r/gitweb?p=portal.git;a=commitdiff_plain;h=2b5bd61f8db925c2331ae5dbb377840ad6eb1e3b;hp=f9bdb313d02b46317a44a3e11f2ba548fbcc8307

Merge "Multitab-Implemented z-index"
---

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>