black color

.vscode/settings.json

@@ -2,23 +2,23 @@
   "typescript.tsdk": "node_modules/typescript/lib",
   "peacock.color": "#002992",
   "workbench.colorCustomizations": {
-    "activityBar.activeBackground": "#0037c5",
-    "activityBar.background": "#0037c5",
+    "activityBar.activeBackground": "#184630",
+    "activityBar.background": "#184630",
     "activityBar.foreground": "#e7e7e7",
     "activityBar.inactiveForeground": "#e7e7e799",
-    "activityBarBadge.background": "#200009",
+    "activityBarBadge.background": "#9259c6",
     "activityBarBadge.foreground": "#e7e7e7",
     "commandCenter.border": "#e7e7e799",
-    "sash.hoverBorder": "#0037c5",
-    "statusBar.background": "#002992",
+    "sash.hoverBorder": "#184630",
+    "statusBar.background": "#0b2016",
     "statusBar.foreground": "#e7e7e7",
-    "statusBarItem.hoverBackground": "#0037c5",
-    "statusBarItem.remoteBackground": "#002992",
+    "statusBarItem.hoverBackground": "#184630",
+    "statusBarItem.remoteBackground": "#0b2016",
     "statusBarItem.remoteForeground": "#e7e7e7",
-    "titleBar.activeBackground": "#002992",
+    "titleBar.activeBackground": "#0b2016",
     "titleBar.activeForeground": "#e7e7e7",
-    "titleBar.inactiveBackground": "#00299299",
+    "titleBar.inactiveBackground": "#0b201699",
     "titleBar.inactiveForeground": "#e7e7e799"
   },
-  "peacock.remoteColor": "#002992"
+  "peacock.remoteColor": "#0b2016"
 }

5s.css

@@ -1,5 +1,5 @@
 :root {
-  --color: var(--primary-color);
+  --color: black;
 }
 
 *:not(td):not(th) {

src/App5S.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts"></script>
 
 <template>
-  <main id="main-app">5S!!!</main>
+  <main id="main-app">5S interactive coming soon</main>
 </template>
 
 <style scoped lang="scss">