From 81c97deaf7bd984a704db28f0cd676530a7b443e Mon Sep 17 00:00:00 2001
From: Paul Oliver <contact@pauloliver.dev>
Date: Sat, 3 Jan 2026 12:03:30 +0000
Subject: Skins frontend

---
 hsm-web/Client/src/App.vue | 48 ++++++++++++++++++++++++++++++++++++++--------
 1 file changed, 40 insertions(+), 8 deletions(-)

(limited to 'hsm-web/Client/src/App.vue')

diff --git a/hsm-web/Client/src/App.vue b/hsm-web/Client/src/App.vue
index 122ce41..a4c8338 100644
--- a/hsm-web/Client/src/App.vue
+++ b/hsm-web/Client/src/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <h1>HsMouse</h1>
+  <h1>HsMouse <span id='logo'>ᘛ⁐̤ᕐᐷ</span></h1>
   <INA226 />
   <CamStream />
   <MotorCtl />
@@ -20,6 +20,19 @@ export default {
 </script>
 
 <style>
+html {
+  background-color: #002b36;
+  color:            #586e75;
+  font-family:      sans-serif;
+}
+h1 {
+  font-size:   24px;
+  font-weight: 600;
+}
+h2 {
+  font-size:   22px;
+  font-weight: 500;
+}
 table {
   border-collapse: collapse;
   border-spacing:  0;
@@ -27,16 +40,35 @@ table {
   width:           100%;
 }
 td {
-  border:  1px solid black;
   margin:  0;
   padding: 0;
 }
 button {
-  border:     none;
-  display:    block;
-  min-height: 20px;
-  height:     100%;
-  width:      100%;
-  padding:    0;
+  background-color: #073642;
+  border:           1.5px solid #2aa198;
+  color:            #2aa198;
+  display:          block;
+  min-height:       30px;
+  height:           100%;
+  width:            100%;
+  padding:          0;
+}
+button:active {
+  background-color: #0a414b;
+}
+input {
+  background-color: transparent;
+  color:            #002b36;
+  font-family:      monospace;
+  font-size:        16px;
+  font-weight:      bold;
+  border:           none;
+  margin:           0 4px;
+  padding:          4px;
+  resize:           none;
+  width:            calc(100% - 16px);
+}
+#logo {
+  font-family: monospace;
 }
 </style>
-- 
cgit v1.2.3-70-g09d2

