🎨 Replace sir with turf + move css to dedicated scss files

src/components/login.scss

@@ -0,0 +1,51 @@
+@import "../_base.scss";
+
+.root {
+    width: 90%;
+    height: 98%;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    padding: 5%;
+    padding-top: 2%;
+
+    background: linear-gradient(rgb(138, 191, 209), rgb(236, 246, 249) 10%);
+
+    .header {
+        height: 5%;
+        width: 100%;
+	}
+
+    .body {
+        height: 50%;
+        width: 50%;
+        max-width: 400px;
+
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+
+        padding-bottom: 3%;
+
+		.invalidInput {
+			border-color: red;
+		}
+
+		.avatarSelector {
+			height: 30%;
+			width: 100%;
+		}
+
+
+		.footerButtons {
+			width: 100%;
+
+			padding-top: 5%;
+
+			display: flex;
+			justify-content: center;
+		}
+	}
+}