From 8211c78287a37f836d43b3f820d963e42c2b6a5f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20Erbsh=C3=A4u=C3=9Fer?= <tobias@tesoft.dev>
Date: Sun, 24 May 2026 09:30:52 +0200
Subject: [PATCH] set base colors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Tobias Erbshäußer <tobias@tesoft.dev>
---
 frontend/src/components/button.njk |  2 +-
 frontend/src/components/loader.njk | 28 +++++++++++++++++++---------
 frontend/src/styles/default.css    |  9 ++++++++-
 frontend/src/styles/main.css       |  5 +++++
 4 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/frontend/src/components/button.njk b/frontend/src/components/button.njk
index 2fce5cd..643879b 100644
--- a/frontend/src/components/button.njk
+++ b/frontend/src/components/button.njk
@@ -1,6 +1,6 @@
 <template id="tesoft-button-template">
     <style>
-        @import "src/styles/default.css";
+        @import "/src/styles/default.css";
     </style>
 
     <button>
diff --git a/frontend/src/components/loader.njk b/frontend/src/components/loader.njk
index c824571..0aa4ced 100644
--- a/frontend/src/components/loader.njk
+++ b/frontend/src/components/loader.njk
@@ -4,7 +4,6 @@
 
         :host {
             display: block;
-            opacity: 60%;
             width: 4.8rem;
             height: 4.8rem;
         }
@@ -22,19 +21,30 @@
             animation: rotate 2s linear infinite;
             transform-origin: center;
         }
+
+        .dark {
+            fill: var(--dark-gray);
+        }
+
+        .bright {
+            fill: var(--light-gray);
+        }
     </style>
 
     <svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
-        <circle cx="32" cy="32" r="32" stroke-width="1.5783"/>
-        <path d="m32 2a30 30 0 0 0-30 30 30 30 0 0 0 30 30 30 30 0 0 0 30-30 30 30 0 0 0-30-30zm0 4a26 26 0 0 1 26 26 26 26 0 0 1-26 26 26 26 0 0 1-26-26 26 26 0 0 1 26-26zm0 19a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7z"
-              fill="#fff" stroke-width="1.0568"/>
-        <path class="loading"
+        <circle class="dark" cx="32" cy="32" r="32" stroke-width="1.5783"/>
+        <path class="bright"
+              d="m32 2a30 30 0 0 0-30 30 30 30 0 0 0 30 30 30 30 0 0 0 30-30 30 30 0 0 0-30-30zm0 4a26 26 0 0 1 26 26 26 26 0 0 1-26 26 26 26 0 0 1-26-26 26 26 0 0 1 26-26zm0 19a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7z"
+              stroke-width="1.0568"/>
+        <path class="bright loading"
               d="m32 9a23 23 0 0 0-23 23h5a18 18 0 0 1 18-18v-5zm0 7a16 16 0 0 0-16 16h5a11 11 0 0 1 11-11v-5zm11 16a11 11 0 0 1-11 11v5a16 16 0 0 0 16-16h-5zm7 0a18 18 0 0 1-18 18v5a23 23 0 0 0 23-23h-5z"
-              fill="#fff" stroke-width="2.4251"/>
-        <path d="m45.645 32.951-12.727 12.729 2.1211 2.1211-16.199 16.199h11.312l10.543-10.543 2.1211 2.1211 12.729-12.727-9.9004-9.9004z"
+              stroke-width="2.4251"/>
+        <path class="dark"
+              d="m45.645 32.951-12.727 12.729 2.1211 2.1211-16.199 16.199h11.312l10.543-10.543 2.1211 2.1211 12.729-12.727-9.9004-9.9004z"
               stroke-width="2"/>
-        <path d="m45.645 35.779-9.8984 9.9004 2.1211 2.1211-16.199 16.199h5.6562l13.371-13.371 2.1211 2.1211 9.9004-9.8984-7.0723-7.0723zm0 4.2441 2.8281 2.8281-5.6562 5.6562-2.8281-2.8281 5.6562-5.6562z"
-              fill="#fff" stroke-width="1.184"/>
+        <path class="bright"
+              d="m45.645 35.779-9.8984 9.9004 2.1211 2.1211-16.199 16.199h5.6562l13.371-13.371 2.1211 2.1211 9.9004-9.8984-7.0723-7.0723zm0 4.2441 2.8281 2.8281-5.6562 5.6562-2.8281-2.8281 5.6562-5.6562z"
+              stroke-width="1.184"/>
     </svg>
 </template>
 
diff --git a/frontend/src/styles/default.css b/frontend/src/styles/default.css
index a2f146e..507f433 100644
--- a/frontend/src/styles/default.css
+++ b/frontend/src/styles/default.css
@@ -1,5 +1,8 @@
 :root {
-
+    --dark-gray: #222831;
+    --gray: #393E46;
+    --gold: #FFD369;
+    --light-gray: #EEEEEE;
 }
 
 html {
@@ -32,3 +35,7 @@ html {
 .hidden {
     display: none !important;
 }
+
+a {
+    color: var(--gold);
+}
diff --git a/frontend/src/styles/main.css b/frontend/src/styles/main.css
index bedeb4f..914c23b 100644
--- a/frontend/src/styles/main.css
+++ b/frontend/src/styles/main.css
@@ -9,3 +9,8 @@
     src: url(/public/assets/AdwaitaSans-Regular.woff2) format('woff2');
     unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
+
+body {
+    background-color: var(--dark-gray);
+    color: var(--light-gray);
+}