design & shits

frontend/app/src/components/styles.css

@@ -1,9 +1,79 @@
-.menubar {
+/* .menubar {
     display: flex;
     justify-content: space-between;
     align-items: center;
-  }
+  } */
 
 .antd-modal-content {
   background-color: #001529;
-}
+}
+
+.card {
+  background: #001529;
+  margin-top: 0.5rem;
+  margin-right: 1rem;
+  margin-left: 1rem;
+  border-radius: 10px;
+  padding: 1rem;
+}
+
+.secondary {
+  background: white;
+  padding: 0.5rem;
+}
+
+.queue-in-list {
+  display: flex;
+  flex-flow: row;
+  justify-content: space-between;
+  align-items: flex-start;
+  width: 100%;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
+@keyframes headerDrop {
+  0% {
+    transform: translateY(-50%);
+    opacity: 0%;
+  }
+  60% {
+    opacity: 50%;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 100%;
+  }
+}
+
+.header {
+  animation: 0.3s ease-out 0s 1 headerDrop;
+  margin-top: 0.5rem;
+  margin-right: 1rem;
+  margin-left: 1rem;
+  border-radius: 10px;
+}
+
+.header-container {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.header-logo {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.logo {
+  width: 36px;
+  height: auto;
+  transition-duration: 0.2s;
+}
+
+.logo:hover {
+  transform: rotate(0.05turn);
+  transition-duration: 0.2s;
+}