Added BG to tab pages

src/app/home/home.page.scss

@@ -52,7 +52,7 @@ ion-slides {
         text-align: left;
         height: 100%;
         position: relative;
-        box-shadow: 10px 10px 15px -7px darken($brand-blue, 10%);
+        box-shadow: 10px 10px 15px -7px darken($brand-blue, 30%);
         transition: transform 0.3s;
         transform: scale(0.9);
 

src/app/live/live.page.html

@@ -48,7 +48,7 @@
                         <thead>
                             <tr>
                                 <th>
-                                    Batsman
+                                    {{ currentMatch.Teams[inning.Battingteam].Name_Short }}
                                 </th>
                                 <th>
                                     Score

src/app/match-details/match-details.page.html

@@ -4,8 +4,17 @@
         <div class="nav">
             <button (click)="back()"> <ion-icon name="chevron-back-outline"></ion-icon> <span> BACK </span> </button>
         </div>
-        <header> {{ currentMatch.Teams[currentMatch.Matchdetail.Team_Home].Name_Short }} v/s {{ currentMatch.Teams[currentMatch.Matchdetail.Team_Away].Name_Short }} <br> 
-            <span> {{ currentMatch.Matchdetail.Venue.Name }} </span> </header>
+        <header> 
+            <ng-container *ngIf="!currentMatch.Innings">
+                {{ currentMatch.Teams[currentMatch.Matchdetail.Team_Home].Name_Short }} v/s {{ currentMatch.Teams[currentMatch.Matchdetail.Team_Away].Name_Short }} <br>
+            </ng-container>
+            <ng-container *ngIf="currentMatch.Innings">
+                <ng-container  *ngFor="let inning of getReversedArray(currentMatch.Innings)">
+                    {{ currentMatch.Teams[inning.Battingteam].Name_Short }} {{ inning.Total }}/{{ inning.Wickets }} <span> ({{ inning.Overs }}) </span> <br>
+                </ng-container>
+            </ng-container>
+            <span> {{ currentMatch.Matchdetail.Venue.Name }} </span> 
+        </header>
         <div class="action" (click)="shareMatchDetails()">
             <button> <ion-icon name="share-social"></ion-icon> </button>
         </div>
@@ -149,11 +158,11 @@
     <ng-container *ngIf="selectedSegment === 'MATCH'">
         <div class="commentary-container" *ngIf="selectedRoster === 'LIVE' && commentaryList">
 
-            <section class="score-card" *ngIf="currentMatch.Innings">
+            <!-- <section class="score-card" *ngIf="currentMatch.Innings">
                 <div class="team" *ngFor="let inning of getReversedArray(currentMatch.Innings)">
                     <header> <h5> {{ currentMatch.Teams[inning.Battingteam].Name_Short }} </h5> {{ inning.Total }}/{{ inning.Wickets }} <span> ({{ inning.Overs }}) </span> </header>
                 </div>
-            </section>
+            </section> -->
             
             <ul *ngFor="let list of getReversedArray(commentaryList)">
                 <header>

src/app/match-details/match-details.page.scss

@@ -1,6 +1,11 @@
 @import '../colors';
 
 
+ion-content {
+    // background: linear-gradient(to bottom, white 50%, darken($brand-blue, 20%) 100%);
+    --background: white;
+}
+
 .commentary-container {
     padding-bottom: 60px;
     width: 100%;
@@ -14,11 +19,11 @@
     }
 
     .score-card {
-        box-shadow: 0px 0px 15px -6px darken($brand-blue, 10%);
+        box-shadow: 0px 0px 15px 5px #cecece;
         margin: 0px auto 30px;
         position: sticky;
         position: -webkit-sticky;
-        top: 140px;
+        top: 100px;
         z-index: 1;
     }
 

src/global.scss

@@ -37,8 +37,8 @@
 }
 
 ion-content {
-    --background: #f4f4f4;
-    // background: linear-gradient(to bottom, darken($brand-blue, 20%), $brand-blue 80%);
+    --background: transparent;
+    background: linear-gradient(to bottom, white, darken($brand-blue, 20%) 100%);
 }
 
 .common-heading-holder {