From af3aea77bc6d1bac89152ce2a314ed97479a5bde Mon Sep 17 00:00:00 2001
From: RaidMax <raidmax@live.com>
Date: Sat, 2 Mar 2019 14:29:09 -0600
Subject: [PATCH] finish UI tweaks for issue #39

---
 Plugins/Web/StatsWeb/Views/Stats/Index.cshtml |  6 ++--
 .../Views/Client/Privileged/Index.cshtml      |  2 +-
 WebfrontCore/Views/Penalty/List.cshtml        |  2 +-
 WebfrontCore/wwwroot/css/bootstrap-custom.css | 34 +++++++++---------
 .../wwwroot/css/bootstrap-custom.scss         | 36 ++++++++++---------
 5 files changed, 42 insertions(+), 38 deletions(-)

diff --git a/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml b/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
index 26c03c37..1ae050cc 100644
--- a/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
+++ b/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
@@ -1,4 +1,4 @@
-<ul class="nav nav-tabs border-top" role="tablist" id="stats_top_players">
+<ul class="nav nav-tabs border-top border-bottom nav-fill" role="tablist" id="stats_top_players">
     <li class="nav-item">
         <a class="nav-link active top-players-link" href="#server_0" role="tab" data-toggle="tab" aria-selected="true" data-serverid="0">All Servers</a>
     </li>
@@ -12,13 +12,13 @@
 </ul>
 
 <div class="tab-content border-bottom">
-    <div role="tabpanel" class="tab-pane active" id="server_0">
+    <div role="tabpanel" class="tab-pane active striped" id="server_0">
         @await Component.InvokeAsync("TopPlayers", new { count = 10, offset = 0 })
     </div>
 
     @foreach (var server in ViewBag.Servers)
     {
-        <div role="tabpanel" class="tab-pane" id="server_@server.ID">
+        <div role="tabpanel" class="tab-pane striped" id="server_@server.ID">
         </div>
     }
 </div>
diff --git a/WebfrontCore/Views/Client/Privileged/Index.cshtml b/WebfrontCore/Views/Client/Privileged/Index.cshtml
index f38247da..2a3565d9 100644
--- a/WebfrontCore/Views/Client/Privileged/Index.cshtml
+++ b/WebfrontCore/Views/Client/Privileged/Index.cshtml
@@ -1,6 +1,6 @@
 @model Dictionary<SharedLibraryCore.Database.Models.EFClient.Permission, IList<SharedLibraryCore.Dtos.ClientInfo>>
 
-<h4 class="pb-2 text-center ">@ViewBag.Title</h4>
+<h4 class="pb-3 text-center ">@ViewBag.Title</h4>
 
 <div class="row border-bottom">
     @{
diff --git a/WebfrontCore/Views/Penalty/List.cshtml b/WebfrontCore/Views/Penalty/List.cshtml
index dec24ca7..9d97d39a 100644
--- a/WebfrontCore/Views/Penalty/List.cshtml
+++ b/WebfrontCore/Views/Penalty/List.cshtml
@@ -2,7 +2,7 @@
 @{
     var loc = SharedLibraryCore.Utilities.CurrentLocalization.LocalizationIndex;
 }
-<h4 class="pb-2 text-center ">@ViewBag.Title</h4>
+<h4 class="pb-3 text-center ">@ViewBag.Title</h4>
 <div class="row">
     <select class="form-control bg-dark text-muted" id="penalty_filter_selection">
         @{
diff --git a/WebfrontCore/wwwroot/css/bootstrap-custom.css b/WebfrontCore/wwwroot/css/bootstrap-custom.css
index 40897494..7cab0b48 100644
--- a/WebfrontCore/wwwroot/css/bootstrap-custom.css
+++ b/WebfrontCore/wwwroot/css/bootstrap-custom.css
@@ -6297,7 +6297,7 @@ a.nav-link {
 .server-activity,
 #mobile_seperator,
 .border-bottom {
-  border-bottom: 2px solid #007ACC !important; }
+  border-bottom: 1px solid #007ACC !important; }
 
 .border-top {
   border-top: 1px solid #007ACC !important; }
@@ -6418,27 +6418,29 @@ form *, select {
   right: 1em; }
 
 .nav-tabs, .nav-tabs .nav-link.active {
-  border-width: 0;
-  color: #007ACC;
-  background-color: rgba(0, 0, 0, 0.2);
-  color: #fff !important; }
-
-.nav-tabs .nav-link.active {
-  border-bottom-width: 1px;
-  border-bottom-color: #007ACC !important; }
+  color: #fff;
+  color: #fff !important;
+  border: none; }
 
 .nav-tabs .nav-link:hover {
-  background-color: #222222;
   color: #007ACC;
-  border-width: 0 0 1px 0;
-  border-bottom-color: #007ACC; }
+  background-color: rgba(24, 24, 24, 0.75);
+  border: none; }
 
 .nav-tabs .nav-link {
   border-radius: 0;
-  padding: 1rem;
+  padding: 1.5rem;
   color: #6c757d;
-  border-width: 0 0 1px 0;
-  border-bottom-color: transparent; }
+  border: none;
+  min-width: 20rem;
+  background-color: #181818; }
 
 .nav-tabs .nav-link.active {
-  border-bottom-color: transparent; }
+  border: none;
+  background-color: #007ACC; }
+
+.nav-tabs .nav-link.active:hover {
+  background-color: rgba(0, 122, 204, 0.75); }
+
+.nav-tabs .nav-item {
+  margin-bottom: 0; }
diff --git a/WebfrontCore/wwwroot/css/bootstrap-custom.scss b/WebfrontCore/wwwroot/css/bootstrap-custom.scss
index aec92860..931d99b6 100644
--- a/WebfrontCore/wwwroot/css/bootstrap-custom.scss
+++ b/WebfrontCore/wwwroot/css/bootstrap-custom.scss
@@ -64,7 +64,7 @@ a.nav-link {
 .server-activity,
 #mobile_seperator,
 .border-bottom {
-    border-bottom: 2px solid $primary !important;
+    border-bottom: 1px solid $primary !important;
 }
 
 .border-top {
@@ -221,33 +221,35 @@ form *, select {
 }
 
 .nav-tabs, .nav-tabs .nav-link.active {
-    border-width: 0;
-    color: $blue;
-    background-color: rgba(0, 0, 0, 0.2);
+    color: $white;
     color: $white !important;
-}
-
-.nav-tabs .nav-link.active
-{
-    border-bottom-width: 1px;
-    border-bottom-color: $blue !important;
+    border: none;
 }
 
 .nav-tabs .nav-link:hover {
-    background-color: #222222;
     color: $blue;
-    border-width: 0 0 1px 0;
-    border-bottom-color: $blue;
+    background-color: rgba(24, 24, 24, 0.75);
+    border: none;
 }
 
 .nav-tabs .nav-link {
     border-radius: 0;
-    padding: 1rem;
+    padding: 1.5rem;
     color: #6c757d;
-    border-width: 0 0 1px 0;
-    border-bottom-color: transparent;
+    border: none;
+    min-width: 20rem;
+    background-color: #181818;
 }
 
 .nav-tabs .nav-link.active {
-    border-bottom-color: transparent;
+    border: none;
+    background-color: $blue;
+}
+
+.nav-tabs .nav-link.active:hover {
+    background-color: rgba(0, 122, 204, 0.75);
+}
+
+.nav-tabs .nav-item {
+    margin-bottom: 0;
 }