🚧 #3 add speed test on the map

JAGFx · Dec 19, 2020 · 70d1dbf · 70d1dbf
1 parent 72f4f0c
commit 70d1dbf
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 0 deletions.
diff --git a/src/dashboards/maps/assets/scss/maps.scss b/src/dashboards/maps/assets/scss/maps.scss
@@ -99,6 +99,28 @@
 			height: 2rem;
 		}
 
+		#speed-limit {
+			position: absolute;
+			left: .3rem;
+			width: auto;
+			top: .3rem;
+
+			span {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				text-align: center;
+				background: $cWhite;
+				border: .3rem solid $cRed;
+				border-radius: 100%;
+				width: 3rem;
+				height: 3rem;
+				color: $cBlack;
+				font-weight: bold;
+				font-size: 1.2rem;
+			}
+		}
+
 		.ol-mouse-position {
 			position: absolute;
 			width: 5rem;

diff --git a/src/dashboards/maps/components/DashMaps.vue b/src/dashboards/maps/components/DashMaps.vue
@@ -10,6 +10,9 @@
         <i class="fas fa-bullseye"></i>
       </button>
     </div>
+    <div id="speed-limit">
+      <span>{{ unit_speed( telemetry.navigation.speedLimit, true, false ) }}</span>
+    </div>
     <div id="eta">
       ETA:
       {{ $etaDueDate() | $dateTimeLocalized( DATE_FORMAT_LONG, TIME_FORMAT_SHORT ) }},