From d8330074d5017ef9690ea0ee1a6da19659e0b393 Mon Sep 17 00:00:00 2001
From: HardiReady <hardi@noarch.de>
Date: Sun, 17 Feb 2019 12:17:28 +0100
Subject: [PATCH] use sass for war header

---
 ...omponent.css => war-header.component.scss} | 74 ++++++++++---------
 .../war/war-header/war-header.component.ts    |  2 +-
 2 files changed, 39 insertions(+), 37 deletions(-)
 rename static/src/app/statistic/war/war-header/{war-header.component.css => war-header.component.scss} (50%)

diff --git a/static/src/app/statistic/war/war-header/war-header.component.css b/static/src/app/statistic/war/war-header/war-header.component.scss
similarity index 50%
rename from static/src/app/statistic/war/war-header/war-header.component.css
rename to static/src/app/statistic/war/war-header/war-header.component.scss
index 9d1fb07..2edb9b1 100644
--- a/static/src/app/statistic/war/war-header/war-header.component.css
+++ b/static/src/app/statistic/war/war-header/war-header.component.scss
@@ -20,25 +20,6 @@ span.tab-control {
   padding: 4px 16px;
 }
 
-.nav-tabs > li.active > a {
-  background: #ffffff;
-  border-bottom: none;
-}
-
-.nav-tabs > li.active {
-  position: relative;
-  top: 1px;
-  z-index: 10;
-}
-
-.nav-tabs mat-icon {
-  color: #666666;
-  height: 26px;
-  width: 26px;
-  display: inline-block;
-  vertical-align: middle;
-}
-
 :host /deep/ .mat-icon-stats-performance g {
   stroke: #666666;
 }
@@ -48,30 +29,51 @@ span.tab-control {
   margin: auto;
   clear: both;
   border-bottom: 0;
+
+  mat-icon {
+    color: #666666;
+    height: 26px;
+    width: 26px;
+    display: inline-block;
+    vertical-align: middle;
+  }
+
+  > li {
+    > a {
+      background: #e7e7e7;
+      border: 1px solid #dadada;
+    }
+  }
+
+  > li.active {
+    position: relative;
+    top: 1px;
+    z-index: 10;
+
+    > a {
+      background: #ffffff;
+      border-bottom: none;
+    }
+  }
+
+  > li:not(.active) > a:hover {
+    background: #afafaf;
+  }
+
+  > li.deactivated > a.nav-link {
+    cursor: not-allowed !important;
+  }
+
+  > li:last-child {
+    margin-left: 65px;
+  }
 }
 
 .nav-tab-hidden {
   visibility: hidden;
 }
 
-.nav-tabs > li > a {
-  background: #e7e7e7;
-  border: 1px solid #dadada;
-}
-
-.nav-tabs > li:not(.active) > a:hover {
-  background: #afafaf;
-}
-
-.nav-tabs > li:last-child {
-  margin-left: 65px;
-}
-
 .nav-link {
   cursor: pointer !important;
   color: #666666 !important;
 }
-
-.nav-tabs > li.deactivated > a.nav-link {
-  cursor: not-allowed !important;
-}
diff --git a/static/src/app/statistic/war/war-header/war-header.component.ts b/static/src/app/statistic/war/war-header/war-header.component.ts
index 88245ac..9bcacc3 100644
--- a/static/src/app/statistic/war/war-header/war-header.component.ts
+++ b/static/src/app/statistic/war/war-header/war-header.component.ts
@@ -11,7 +11,7 @@ import {ScoreboardComponent} from '../scoreboard/scoreboard.component';
 @Component({
   selector: 'war-detail',
   templateUrl: './war-header.component.html',
-  styleUrls: ['./war-header.component.css', '../../../style/list-entry.css', '../../../style/hide-scrollbar.css']
+  styleUrls: ['./war-header.component.scss']
 })
 export class WarHeaderComponent implements OnInit {