chore: added 2 packages, favicon, redirects

.gitignore

@@ -13,6 +13,7 @@
 
 # misc
 .DS_Store
+.env
 .env.local
 .env.development.local
 .env.test.local

package.json

@@ -3,20 +3,22 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@emotion/react": "^11.8.2",
+    "@emotion/styled": "^11.8.1",
+    "@mui/icons-material": "^5.5.1",
+    "@mui/material": "^5.5.2",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.2.0",
     "@testing-library/user-event": "^13.5.0",
+    "firebase": "^9.6.10",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
-    "react-scripts": "5.0.1",
-    "web-vitals": "^2.1.4",
-    "firebase": "^9.6.10",
-    "@emotion/react": "^11.8.2",
-    "@emotion/styled": "^11.8.1",
-    "@mui/icons-material": "^5.5.1",
-    "@mui/material": "^5.5.2",
+    "react-drag-drop-files": "^2.3.5",
     "react-router-dom": "^6.2.2",
-    "react-toastify": "^8.2.0"
+    "react-scripts": "5.0.1",
+    "react-toastify": "^8.2.0",
+    "uuid": "^8.3.2",
+    "web-vitals": "^2.1.4"
   },
   "scripts": {
     "start": "react-scripts start",

public/_redirects

@@ -0,0 +1 @@
+/*  /index.html  200

src/index.css

@@ -5,11 +5,14 @@
   --primary--color: #900c3f;
   --primary--color--light: #ffc300;
   --text-color: #06113c;
+  --secondary--color: #d9d9d9;
+  --secondary--light: #f8fafc;
 }
 
 body {
   font-family: "inter", sans-serif;
   background-color: var(--bg-color);
+  color: var(--text-color);
 }
 
 .App {
@@ -29,7 +32,6 @@ body {
 
 .main-container {
   margin: 1rem;
-  margin-left: 13rem;
   margin-bottom: 0;
   padding-bottom: 2rem;
 }
@@ -45,34 +47,33 @@ body {
   );
 }
 .btn--primary {
+  background-image: linear-gradient(
+    to right,
+    #c70039,
+    #e0432e,
+    #f26f1f,
+    #fd9908,
+    #ffc300
+  );
   transition: 0.5s;
   background-size: 200% auto;
-  box-shadow: 0 0 20px #eee;
   border: none;
+  color: var(--white);
 }
 
 .btn--primary:hover {
-  background-position: right center; /* change the direction of the change here */
-  color: #fff;
+  background-position: right center;
   text-decoration: none;
+  color: var(--white);
+  font-weight: 600;
 }
 
 .primary-color {
   color: var(--primary--color);
 }
 
-/* @media only screen and (max-width: 600px) {
-  .main-container {
-    margin: 1rem;
-    padding-bottom: 5rem;
-  }
-} */
 @media only screen and (max-width: 450px) {
   .Toastify__toast-container .Toastify__toast {
     margin: 1rem;
   }
-  /* .main-container {
-    margin: 1rem;
-    padding-bottom: 5rem;
-  } */
 }