Fixes for mobile view and SSV added to bags list

Monitor/Pages/BagAnalyzer.cshtml

@@ -37,6 +37,7 @@
               <th class="text-right" data-toggle="tooltip" data-placement="top" title="Buy Strategy Trigger">BS Trigger</th>
               <th data-fieldid="ProfitPercent" data-tablesaw-sortable-col data-sortable-numeric="true" data-tablesaw-sortable-default-col class="text-right tablesaw-sortable-descending" data-toggle="tooltip" data-placement="top" title="Current profit percentage">Profit</th>
               <th data-toggle="tooltip" data-placement="top" title="Active sell strategies">Sell Strats</th>
+              <th class="text-right" data-toggle="tooltip" data-placement="top" title="Sell Strategy Value">SSV</th>
               <th class="text-right" data-toggle="tooltip" data-placement="top" title="Sell Strategy Trigger">SST</th>
               <th class="text-right" data-toggle="tooltip" data-placement="top" title="Current Bid Order & Average Purchase Price">Bid Price<br>Avg Price</th>
               <th></th>

Monitor/Pages/_Layout.cshtml

@@ -24,7 +24,7 @@
   <!-- Navigation Bar-->
   <header id="topnav">
     <div class="topbar-main">
-      <div class="container-fluid">
+      <div class="container-fluid px-1">
 
         <!-- Logo container-->
         <div class="logo">
@@ -43,6 +43,9 @@
         <div class="menu-extras topbar-custom">
           <ul class="list-inline float-left mb-0">
             <li id="ticker-widgets" class="list-inline-item ticker-widgets"></li>
+          </ul>
+
+          <ul class="list-inline float-right pt-2">
             <li class="menu-item list-inline-item">
               <!-- Mobile menu toggle-->
               <a class="navbar-toggle nav-link">
@@ -54,8 +57,6 @@
               </a>
               <!-- End mobile menu toggle-->
             </li>
-            
-          </ul>
         </div>
         <!-- end menu-extras -->
 
@@ -66,7 +67,7 @@
     <!-- end topbar-main -->
 
     <div class="navbar-custom">
-      <div class="container-fluid">
+      <div class="container-fluid px-1">
         <div id="navigation">
           <!-- Navigation Menu-->
           <ul class="navigation-menu">
@@ -127,7 +128,7 @@
   <!-- End Navigation Bar-->
 
   <div class="wrapper">
-    <div class="container-fluid">
+    <div class="container-fluid px-1">
 
       @RenderBody()
 

Monitor/Pages/_get/BagList.cshtml

@@ -143,6 +143,9 @@
     // Sell Strats
     <td class="text-nowrap">@Html.Raw(sellStrategyText)</td>
 
+    // SSV
+    <td class="text-right text-nowrap">@Html.Raw(currentSellValueText)</td>
+
     // SST
     <td class="text-right text-nowrap">
       @Html.Raw(triggerSellValueText)

Monitor/Pages/_get/DashboardBottom.cshtml

@@ -5,8 +5,8 @@
 }
 
 <div class="row">
-  <div class="col-md-6">
+  <div class="col-md-6 px-1">
-    <div class="card-box">
+    <div class="card-box px-2">
       <h4 class="m-t-0 m-b-20 header-title"><b>Market Trends</b><small class="pull-right"><a href="@Html.Raw(Model.PTMagicConfiguration.GeneralSettings.Monitor.RootUrl)MarketAnalyzer">more</a></small></h4>
 
       <table class="table table-sm">
@@ -44,8 +44,8 @@
       </table>
     </div>
   </div>
-  <div class="col-md-6">
+  <div class="col-md-6 px-1">
-    <div class="card-box">
+    <div class="card-box px-2">
       <h4 class="m-t-0 m-b-20 header-title"><b>Sales Overview</b><small class="pull-right"><a href="@Html.Raw(Model.PTMagicConfiguration.GeneralSettings.Monitor.RootUrl)SalesAnalyzer">more</a></small></h4>
       @{
         double totalProfit = Model.PTData.SellLog.Sum(s => s.Profit);
@@ -131,8 +131,8 @@
 </div>
 
 <div class="row">
-   <div class="col-md-6">
+   <div class="col-md-6 px-1">
-    <div class="card-box" style="height:305px;">
+    <div class="card-box px-2" style="height:305px;">
       @if (!Model.TrendChartDataJSON.Equals("")) {
         <div class="trend-chart">
           <svg style="height:305px;width:100%"></svg>
@@ -142,8 +142,8 @@
       }
     </div>
   </div>
-  <div class="col-md-6">
+  <div class="col-md-6 px-1">
-    <div class="card-box" style="height:305px;">
+    <div class="card-box px-2" style="height:305px;">
       @if (!Model.ProfitChartDataJSON.Equals("")) {
         <div class="profit-chart">
           <svg style="height:305px;width:100%"></svg>

Monitor/Pages/_get/DashboardTop.cshtml

@@ -5,14 +5,15 @@
 }
 
 <div class="row">
-  <div class="col-md-6">
+  <div class="col-md-6 px-1">
-    <div class="card-box">
+    <div class="card-box px-2">
       <h4 class="m-t-0 m-b-20 header-title"><b>Possible Buys (@Model.PTData.BuyLog.Count)</b><small id="buylist-refresh-icon"></small><small class="pull-right"><a href="@Html.Raw(Model.PTMagicConfiguration.GeneralSettings.Monitor.RootUrl)BuyAnalyzer">more</a></small></h4>
       @if (Model.PTData.BuyLog.Count == 0) {
 
         <p>Your Profit Trailer did not find anything worth buying so far.</p>
 
       } else {
+        
         <table class="table table-sm m-b-0">
           <thead>
             <tr>
@@ -79,8 +80,8 @@
     </div>
   </div>
 
-  <div class="col-md-6">
+  <div class="col-md-6 px-1">
-    <div class="card-box">
+    <div class="card-box px-2">
       <h4 class="m-t-0 m-b-20 header-title"><b>Pairs & DCA (@Model.PTData.DCALog.Count)</b><small id="baglist-refresh-icon"></small><small class="pull-right"><a href="@Html.Raw(Model.PTMagicConfiguration.GeneralSettings.Monitor.RootUrl)BagAnalyzer">more</a></small></h4>
 
       @if (Model.PTData.DCALog.Count == 0) {
@@ -89,6 +90,7 @@
 
       } else {
         
+        <div class="table-responsive">
           <table class="table table-sm m-b-0">
             <thead>
               <tr>
@@ -187,6 +189,7 @@
               }
             </tbody>
           </table>
+        </div>
 
         @if (Model.PTData.DCALog.Count > Model.PTMagicConfiguration.GeneralSettings.Monitor.MaxDashboardBagEntries) {
           <p class="text-right"><small><i class="fa fa-info-circle"></i> @Model.PTMagicConfiguration.GeneralSettings.Monitor.MaxDashboardBagEntries of @Model.PTData.DCALog.Count items listed - <a href="@Html.Raw(Model.PTMagicConfiguration.GeneralSettings.Monitor.RootUrl)BagAnalyzer">View all items</a></small></p>

Monitor/wwwroot/assets/css/custom.css

@@ -135,6 +135,13 @@ a:active {
   font-size  : 12px;
 }
 
+/* If the screen size is 400px wide or less, set the font-size of <div> to 30px */
+@media screen and (max-width: 400px) {
+  .table {
+    font-size: 10px;
+  }
+}
+
 .tablesaw-sortable .tablesaw-sortable-head button {
   min-width: unset;
 }