From 3b8e866e74b7a0d6272772259329d987b62bd7d7 Mon Sep 17 00:00:00 2001
From: chillwafflez <ju5t1n.nguy3n284@gmail.com>
Date: Tue, 5 Mar 2024 12:53:41 -0800
Subject: [PATCH] fixed latency ranges for connection component

---
 src/components/VehicleStatus/Connection.vue | 6 +++---
 src/testDisplayComponents.vue               | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/VehicleStatus/Connection.vue b/src/components/VehicleStatus/Connection.vue
index de07956..22886a7 100644
--- a/src/components/VehicleStatus/Connection.vue
+++ b/src/components/VehicleStatus/Connection.vue
@@ -4,13 +4,13 @@
             <div v-if="latency == 0" class="grayed_bar" style='height: 20%'></div>
             <div v-else class="bar" style='height: 20%'></div>
 
-            <div v-if="latency <= 30" class="grayed_bar" style='height: 40%'></div>
+            <div v-if="latency >= 70 || latency == 0" class="grayed_bar" style='height: 40%'></div>
             <div v-else class="bar" style='height: 40%'></div>
 
-            <div v-if="latency <= 50" class="grayed_bar" style='height: 60%'></div>
+            <div v-if="latency >= 60 || latency == 0" class="grayed_bar" style='height: 60%'></div>
             <div v-else class="bar" style='height: 60%'></div>
 
-            <div v-if="latency <= 70" class="grayed_bar" style='height: 80%'></div>
+            <div v-if="latency >= 40 || latency == 0" class="grayed_bar" style='height: 80%'></div>
             <div v-else class="bar" style='height: 80%'></div>
         </div>
         <span class="connection_number">{{ latency }} ms</span>
diff --git a/src/testDisplayComponents.vue b/src/testDisplayComponents.vue
index 9ef015a..6ed6af2 100644
--- a/src/testDisplayComponents.vue
+++ b/src/testDisplayComponents.vue
@@ -8,13 +8,13 @@ import Connection from './components/VehicleStatus/Connection.vue';
 <template>
   <h2>Below is the Connection component</h2>
   <div class="border_div">
-    <Connection :latency=100 />                    <!-- pass in latency into latency prop !-->
+    <Connection :latency=56 />                    <!-- pass in latency into latency prop !-->
   </div>
 
 
   <h2>Below is the Battery component</h2>
   <div class="border_div">
-    <Battery :percentage=6 :charging="false"/>    <!-- pass in the current percentage into percentage prop. charging is a boolean !-->
+    <Battery :percentage=12 :charging="false"/>    <!-- pass in the current percentage into percentage prop. charging is a boolean !-->
   </div>
 
 </template>