Sam did styling

frontend/src/pages/ticket.rs

@@ -807,9 +807,9 @@ pub fn archived_tickets_component() -> Html {
         html! { <p>{ format!("Error: {}", e) }</p> }
     } else {
         html! {
-            <ul>
+            <ul class="postits">
             { for tickets.iter().filter(|t| t.status == "Archived" && (user.is_admin || if let Some(uid) = user.id { t.user_id == uid } else { false })).map(|t| html! {
-                    <div>
+                    <div class="listbox">
                         <li key={t.id.to_string()}>
                             <Link<crate::Route> to={crate::Route::TicketById{id: t.id}}><h3>{ format!("{} - #{}", t.betreff, t.id) }</h3></Link<crate::Route>>
                             <p>{ &t.description }</p>

frontend/src/styles/_variables.scss

@@ -1,8 +1,19 @@
-$color-bg: #ffffff;
+:root{
-$color-sidebar: #570000;
+    $color-bg: #ffffff;
-$color-accent: #2563eb;
+    $color-sidebar: #570000;
-$color-muted: #6b7280;
+    $color-accent: #2563eb;
-$spacing-sm: 8px;
+    $color-muted: #6b7280;
-$spacing-md: 16px;
+    $spacing-sm: 8px;   
-$border-radius: 6px;
+    $spacing-md: 16px;
-$rundbgbackgroundcolor: #a0a0a0;
+    $border-radius: 6px;
+    $rundbgbackgroundcolor: #a0a0a0
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        $color-bg: #000000;
+        $color-sidebar: #f3ff73;
+        
+
+    }
+}