Narete stvari da delajo

frontend/vju_display/src/assets/main.css

@@ -37,14 +37,17 @@ body {
 }
 html, body {
   touch-action: manipulation;
+  margin: 0;
+  padding: 0;
 }
 
-#app {
-  max-width: 1280px;
-  height: 100vh;
-  margin: 0 auto;
+h1 {
+    font-weight: bold;
+    font-size: 1.5em;
+    color: #58595b;
 }
 
+
 a,
 .green {
   text-decoration: none;
@@ -74,31 +77,30 @@ a,
 }
 
 button {
-  background: lightgray;
+    --bg-default: #ffffff;
+    --bg-active: lightgray;
+  background: var(--bg-default);
   font-size: 1.3em;
   font-weight: bold;
 }
 
-button:focus:not(:active) {
-  background: lightgray;
-}
-
-button:focus-visible(:active) {
-  background: gray;
-}
-
-
-
 button {
-  border: none;
-  background-color: lightgray;
+    margin: .1rem;
+    border: 1px solid #000000;
+    border-radius: 3px;
+    background: #ffffff;
+    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
+}
+
+/* The last touched button keeps focus, so we shoudln't highlight that */
+button:focus:not(:active) {
+    background: var(--bg-default);
 }
 
 button:active {
-  background: gray;
+    background: var(--bg-active);
 }
 
-
 h1 {
   text-align: center;
 }
@@ -108,4 +110,4 @@ h3 {
 
 .currentlyActive {
   background-color: orange !important
-}
+}