Merge pull request #7 from MissouriMRDT/fixes/style-improvements

Header and other style fixes
MissouriMRDT · Sep 16, 2024 · 4177939 · 4177939
2 parents 1fe6af1 + c1e350e
commit 4177939
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 13 deletions.
diff --git a/Basestation_Software.Web/Core/Components/PingGraph.razor b/Basestation_Software.Web/Core/Components/PingGraph.razor
@@ -10,7 +10,7 @@
 
 <div class="card full-height">
     <div class="card-header">
-        <h5>Ping Graph</h5>
+        <h3>Ping Graph</h3>
     </div>
     <div class="card-body scrollable">
         @if (!_dataLoaded)

diff --git a/Basestation_Software.Web/Core/Components/RoverMap.razor b/Basestation_Software.Web/Core/Components/RoverMap.razor
@@ -70,10 +70,10 @@
     }
 </style>
 
-<div class="card full-height" style="width: 650px">
+<div class="card full-height">
     <div class="card-header">
         <div class="d-flex justify-content-between align-items-center">
-            <h5 class="mr-auto">Map</h5>
+            <h3>Map</h3>
             @if (_cachingMapTiles)
             {
                 <div>
@@ -94,7 +94,7 @@
         }
         else
         {
-            <div id="@ID" style="width: 645px; height: 460px; position: relative;"></div>
+            <div id="@ID" style="height: 460px; position: relative;"></div>
         }
     </div>
     <div class="card-footer" id="cursorPosition"></div>

diff --git a/Basestation_Software.Web/Core/Components/TaskTimers.razor b/Basestation_Software.Web/Core/Components/TaskTimers.razor
@@ -33,9 +33,7 @@
 
 <div class="card full-height">
     <div class="card-header d-flex justify-content-between">
-        <div class="col">
-            <h4>Task Timer</h4>
-        </div>
+            <h3>Task Timer</h3>
         <div class="col text-end">
             <RadzenDropDown @bind-Value=@TimerTaskType Data=@(Enum.GetValues(typeof(TaskType)))></RadzenDropDown>
         </div>

diff --git a/Basestation_Software.Web/Core/Components/Waypoints.razor b/Basestation_Software.Web/Core/Components/Waypoints.razor
@@ -5,14 +5,14 @@
     <div class="card-header">
         <div class="row">
             <div class="col-6 d-flex align-self-center">
-                <h5>Waypoints</h5>
-                <div class="border border-start-0 border-top-0 border-bottom-0 border-1">&nbsp;</div>
-                    <RadzenButton ButtonStyle="ButtonStyle.Dark" Text="New Waypoint" Click="@InsertRow" style="margin-left: 10px"  />
+                <h3>Waypoints</h3>
+                <div class="vr">&nbsp;</div>
+                    <RadzenButton ButtonStyle="ButtonStyle.Dark" Text="New Waypoint" Click="@InsertRow" />
             </div>
             <div class ="col-6 d-flex justify-content-end">
                 @if (_waypointsToUpdate.Count > 0 || _waypointsToInsert.Count > 0)
                 {
-                    <div class="border border-start-0 border-top-0 border-bottom-0 border-1">&nbsp;</div>
+                    <div class="vr">&nbsp;</div>
                     <RadzenButton ButtonStyle="ButtonStyle.Primary" Text="Save All" Click="@SaveAllEdits" style="margin-left: 10px; margin-right: 10px" />
                     <RadzenButton ButtonStyle="ButtonStyle.Danger" Text="Cancel All" Click="@CancelAllEdits" style="margin-right: 10px"  />
                 }

diff --git a/Basestation_Software.Web/Core/Pages/RED.razor b/Basestation_Software.Web/Core/Pages/RED.razor
@@ -10,7 +10,7 @@
 
 <div class="container">
     <div class="row mt-3">
-        <div class="col-md-7">
+        <div class="col-md-7 g-1">
             <div class="row flex-grow-1">
                 <div class="col-12">
                     <Waypoints />
@@ -27,7 +27,7 @@
                 </div>
             </div>
         </div>
-        <div class="col-md-5">
+        <div class="col-md-5 g-1">
             <div class="row flex-grow-1">
                 <div class="col-12">
                     <RoverMap ID="mainmap" InitialLat=37.951764 InitialLong=-91.778441 InitialZoomLevel=18 />

diff --git a/Basestation_Software.Web/wwwroot/bootstrap-ext.css b/Basestation_Software.Web/wwwroot/bootstrap-ext.css
@@ -3,6 +3,19 @@
     color: white;
 }
 
+.card-header h3 {
+    font-size: larger;
+    margin-block: auto;
+    height: 100%;
+    vertical-align: middle;
+}
+
+.card-header .vr {
+    width: 1px;
+    margin-inline: 10px;
+    opacity: 100%;
+}
+
 .card .read-more:hover {
     font-size: 14px;
 }