Center

now has an svg

frontend/src/pages/sidebar.rs

@@ -381,7 +381,12 @@ pub fn sidebar() -> Html {
             <SidebarStateProvider>
                 <nav class="sidebar user">
                     <ul>
-                        <Link<crate::Route> to={crate::Route::Home}>{ "󰟒" }</Link<crate::Route>>
+                        <Link<crate::Route> to={crate::Route::Home} classes="home">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="home-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
+                                <polyline points="9 22 9 12 15 12 15 22"/>
+                            </svg>
+                        </Link<crate::Route>>
                         <TicketMenu/>
                         <li class="logout-item">
                             <button
@@ -401,7 +406,12 @@ pub fn sidebar() -> Html {
             <SidebarStateProvider>
                 <nav class="sidebar admin">
                     <ul>
-                        <Link<crate::Route> to={crate::Route::Home}>{ "󰟒" }</Link<crate::Route>>
+                        <Link<crate::Route> to={crate::Route::Home} classes="home">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="home-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
+                                <polyline points="9 22 9 12 15 12 15 22"/>
+                            </svg>
+                        </Link<crate::Route>>
                         <TicketMenu/>
                         <UsersMenu/>
                         <Link<crate::Route> to={crate::Route::Diagnostics}>{ "Statistiken" }</Link<crate::Route>>

frontend/src/pages/ticket.rs

@@ -313,7 +313,7 @@ pub fn submit_ticket_component() -> Html {
             {
                 if !room_valid {
                     html! {
-                        <p style="color: red;">{ "Ungültiger oder nicht erlaubter Raum (z. B. 101, K12, D5)" }</p>
+                        <p class="warning" >{ "Ungültiger / nicht erlaubter Raum (z. B. 101, K12, D5)" }</p>
                     }
                 } else {
                     html! {}

frontend/src/pages/user.rs

@@ -425,7 +425,7 @@ pub fn all_users_component() -> Html {
         html! { <p>{ format!("Error: {}", e) }</p> }
     } else {
         html! {
-            <ul class="posti8s">
+            <ul class="postits">
             { for users.iter().map(|t| html! {
                     <li key={t.id.to_string()} class="listbox">
                         <Link<crate::Route> to={crate::Route::UserByID{id: t.id}}><h3>{ format!("{} {}- #{}", t.first_name, t.last_name, t.id) }</h3></Link<crate::Route>>

frontend/src/styles/components/_sidebar.scss

@@ -53,5 +53,16 @@
   }
 
   &.user { width: 220px; background: darken($color-sidebar, 6%); }
-}
 
+  .home-svg {
+      width: 24px;
+      height: 24px; 
+      vertical-align: middle;
+      margin: 0 auto;
+  }
+
+  .home {
+    display: flex;
+    justify-content: center;
+  }
+}

frontend/src/styles/components/_tickets.scss

@@ -16,6 +16,7 @@
 .listbox {
   max-width: auto;
   margin:0 0;
+  background-color: #90ff82;
   background-color: $rundbgbackgroundcolor;
   padding-bottom: 96px;
   color: white;
@@ -51,4 +52,8 @@
   display: grid;
   grid-template-columns: auto auto auto;
   gap: 8px;
+  margin-top: 96px; 
+}
+.warning {
+  color: #570000;
 }

frontend/src/styles/main.scss

@@ -61,7 +61,7 @@ body {
   justify-content: center;
   flex-direction: column;
   max-width: 40%;
-  margin:0 auto;
+  margin: 0 auto;
   background-color: variables.$rundbgbackgroundcolor;
   padding-bottom: 96px;
   padding-left: 32px;
@@ -80,7 +80,7 @@ body {
     box-sizing: border-box;
   }
 
-  input, select, button {
+  input, select, button, a {
     width: 100%;
     box-sizing: border-box;
     padding: 16px;
@@ -98,6 +98,12 @@ body {
     margin: 16px 0;
   }
 
+  a {
+    color: #000000;
+    text-align: center;
+    border-style: dashed;
+  }
+
   &.login {
     margin-top: 96px;
   }
@@ -107,3 +113,5 @@ body {
   width: 100%;
   box-sizing: border-box;
 }
+
+