From 758f0d19f227bf2f33544040120023b8dd4d095f Mon Sep 17 00:00:00 2001
From: Rigel Kent <sendmemail@rigelk.eu>
Date: Sat, 7 Mar 2020 00:15:49 +0100
Subject: [PATCH] Improve nav in admin/configuration

---
 .../plugins/shared/toggle-plugin-type.scss     |  1 +
 .../video-upload.component.ts                  |  2 +-
 client/src/sass/bootstrap.scss                 | 18 +++++++++++++++---
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/client/src/app/+admin/plugins/shared/toggle-plugin-type.scss b/client/src/app/+admin/plugins/shared/toggle-plugin-type.scss
index 7e2c40aae..3d3b6dd12 100644
--- a/client/src/app/+admin/plugins/shared/toggle-plugin-type.scss
+++ b/client/src/app/+admin/plugins/shared/toggle-plugin-type.scss
@@ -10,6 +10,7 @@
     ::ng-deep {
       .ui-button-text {
         font-size: 15px;
+        font-weight: 600;
       }
 
       .ui-button.ui-state-active {
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
index efdd284e8..ee4aa7b53 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
@@ -70,7 +70,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
   }
 
   get videoExtensions () {
-    return this.serverConfig.video.file.extensions.join(',')
+    return this.serverConfig.video.file.extensions.join(', ')
   }
 
   ngOnInit () {
diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss
index 61f9d016b..5e0b16bfa 100644
--- a/client/src/sass/bootstrap.scss
+++ b/client/src/sass/bootstrap.scss
@@ -163,9 +163,21 @@ ngb-tabset.bootstrap {
   }
 }
 
-.nav-tabs .nav-link.active {
-  background-color: var(--mainBackgroundColor) !important;
-  border-bottom: none;
+.nav-tabs .nav-link {
+  &:not(.active) {
+    opacity: .6;
+    border-bottom: 3px solid transparent;
+  }
+  &.active {
+    background-color: var(--mainBackgroundColor) !important;
+    border: none;
+    border-bottom: 2px solid var(--mainColor);
+  }
+  &:hover {
+    border-top-color: transparent;
+    border-left-color: transparent;
+    border-right-color: transparent;
+  }
 }
 
 .card {