Improve dark theme

src/components/layout/NavBar.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <b-navbar toggleable="lg" type="dark" variant="info">
+    <b-navbar toggleable="lg" type="dark" variant="primary">
       <b-navbar-brand exact to="/">
         <img class="logo" src="@/assets/freqtrade-logo.png" alt="Home Logo" />
         <span class="navbar-brand-title">Freqtrade UI</span>

src/styles/_bootstrap_variables_ovw.scss

@@ -1,4 +1,4 @@
 // Overwrite bootstrap scss variables
 // $body-bg: rgb(42, 42, 49);
 $font-size-base: 0.9rem;
-$primary: #0089a1
+$primary: #0089a1;

src/styles/_styles_ovw.scss

@@ -1,14 +1,10 @@
 // global main style
 
-// html, body, #app{
-
-// }
-
-
 [data-theme="dark"] {
     $bg-dark: #3c3c3c;
     $bg-darker: darken($bg-dark, 5%);
     $fg-color: #dedede;
+
     background-color: darken($bg-dark, 5%) ;
     color: $fg-color !important;
     body {
@@ -62,6 +58,13 @@
         color: $fg-color;
         background: $bg-dark;
     }
+    .popover {
+        background: $bg-dark;
+    }
+    .popover-body {
+        color: $fg-color;
+    }
+
     textarea {
         color: $fg-color;
         background: $bg-dark;
@@ -73,7 +76,7 @@ html.ft-theme-transition,
 html.ft-theme-transition *,
 html.ft-theme-transition *:before,
 html.ft-theme-transition *:after {
-    transition:background 750ms linear,
-               border-color 750ms linear;
+    transition:background 750ms ease-in-out,
+               border-color 750ms ease-in-out;
     transition-delay: 0 !important;
 }

src/views/Dashboard.vue

@@ -22,7 +22,7 @@
           <b-card header="Open / Total trades">
             <b-card-text>
               <span class="text-primary">{{ openTrades.length }}</span> /
-              <span class="text-secondary">{{ profit.trade_count }}</span>
+              <span class="text">{{ profit.trade_count }}</span>
             </b-card-text>
           </b-card>
           <b-card header="Won / lost trades">