feat(client): indicate dev build

packages/client/src/ui/_common_/common.vue

@@ -11,6 +11,8 @@
 <XStreamIndicator/>
 
 <div v-if="pendingApiRequestsCount > 0" id="wait"></div>
+
+<div v-if="dev" id="devTicker"><span>DEV BUILD</span></div>
 </template>
 
 <script lang="ts">
@@ -52,12 +54,28 @@ export default defineComponent({
 			uploads,
 			popups,
 			pendingApiRequestsCount,
+			dev: _DEV_,
 		};
 	},
 });
 </script>
 
 <style lang="scss">
+@keyframes dev-ticker-blink {
+	0% { opacity: 1; }
+	50% { opacity: 0; }
+	100% { opacity: 1; }
+}
+
+@keyframes progress-spinner {
+	0% {
+		transform: rotate(0deg);
+	}
+	100% {
+		transform: rotate(360deg);
+	}
+}
+
 #wait {
 	display: block;
 	position: fixed;
@@ -79,12 +97,19 @@ export default defineComponent({
 	}
 }
 
-@keyframes progress-spinner {
+#devTicker {
-	0% {
+	position: fixed;
-		transform: rotate(0deg);
+	top: 0;
-	}
+	left: 0;
-	100% {
+	z-index: 2147483647;
-		transform: rotate(360deg);
+	color: #ff0;
+	background: rgba(0, 0, 0, 0.5);
+	padding: 4px 5px;
+	font-size: 14px;
+	pointer-events: none;
+
+	> span {
+		animation: dev-ticker-blink 2s infinite;
 	}
 }
 </style>