feat: Show stripped title bar on debug build (#48)

* feat: Show stripped title bar on debug build

Helps with differentiating which window is which when both developing
FlightCore and is using release version at the same time.

* fix: Only show striped menubar for debug builds

2 files changed, 16 insertions, 0 deletions

diff --git a/src-vue/src/App.vue b/src-vue/src/App.vue
index 5eeeb93b..c17b8817 100644
--- a/src-vue/src/App.vue
+++ b/src-vue/src/App.vue
@@ -103,6 +103,16 @@ export default {
   height: var(--fc-menu_height);
 }
 
+.developer_build {
+  background: repeating-linear-gradient(
+    45deg,
+    rgba(0, 0, 0, 0.2),
+    rgba(0, 0, 0, 0.2) 20px,
+    rgba(0, 0, 0, 0.3) 20px,
+    rgba(0, 0, 0, 0.3) 40px
+  );
+}
+
 /* Window controls */
 #fc_window__controls {
   display: flex;
diff --git a/src-vue/src/plugins/store.ts b/src-vue/src/plugins/store.ts
index 8f1f9fe5..b97af2a7 100644
--- a/src-vue/src/plugins/store.ts
+++ b/src-vue/src/plugins/store.ts
@@ -200,6 +200,12 @@ async function _initializeApp(state: any) {
     // Enable dev mode directly if application is in debug mode
     if (await invoke("is_debug_mode")) {
         state.developer_mode = true;
+
+        // Make menubar striped if debug build
+        let menu_bar_handle = document.querySelector('#fc__menu_bar');
+        if (menu_bar_handle !== null) {
+            menu_bar_handle.classList.toggle('developer_build');
+        }
     }
 
     // Grab Northstar release canal value from store if exists