Styling and improvements

frontend/src/styles/components/_diagnostics.scss

@@ -47,6 +47,7 @@
   flex: 1;
   min-width: 60px;
   height: 100%;
+  justify-content: end;
 
   .bar {
     width: 100%;

frontend/src/styles/components/_home.scss

@@ -0,0 +1,9 @@
+.login-status {
+  font-weight: bold;
+  margin: 4px 8px;
+}
+
+.name {
+  font-size: 24px;
+  margin: 4px 8px;
+}

frontend/src/styles/components/_tickets.scss

@@ -18,17 +18,18 @@
   margin:0 0;
   background-color: #90ff82;
   background-color: $rundbgbackgroundcolor;
-  padding-bottom: 96px;
+  padding-bottom: 8px;
   color: white;
-  padding-left: 32px;
-  padding-right: 32px;
-  padding-top: 96px;
+  padding-left: 8px;
+  padding-right: 8px;
+  padding-top: 8px;
   border-radius: 20px;
   border-color: #000000;
   border-style: double;
   box-shadow: 10px 10px 10px rgba(43, 43, 43, 0.8);
   font-size: 26px;
   list-style-type: none;
+  text-align: center;
 
   
   &.To-Do {
@@ -46,14 +47,33 @@
   &.Archived {
     background-color: #af69ee;
   }
+
+  a {
+    text-decoration: none;
+    color: white;
+  }
 }
 
 .postits {
   display: grid;
-  grid-template-columns: auto auto auto;
   gap: 8px;
   margin-top: 96px; 
 }
 .warning {
   color: #570000;
 }
+
+.ticket-count {
+  border-radius: 10px;
+  border: 2px solid black;
+  width: fit-content;
+  padding: 8px;
+  margin: 0 auto;
+  margin-bottom: 32px;
+
+  h4 {
+    text-align: center;
+    font-size: 32px;
+    margin: 8px;
+  }
+}