update style and setup gh-pages

2024-10-20 00:42:23 +02:00
parent 129fcb672c
commit ba881b1637
14 changed files with 1455 additions and 629 deletions
--- a/src/styles/scss/_uploadDiary.scss
+++ b/src/styles/scss/_uploadDiary.scss
@@ -0,0 +1,112 @@
+.upload-diary {
+  padding: 3rem;
+  background-color: #14181c;
+  min-height: 100vh;
+  display: flex !important;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  .upload-card {
+    width: 100%;
+    max-width: 600px;
+    background-color: #1c1f23;
+    border-radius: 4px;
+    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
+    padding: 2rem;
+
+    .title {
+      margin-bottom: 1.5rem;
+      font-weight: bold;
+      color: #ffffff;
+    }
+
+    .username-field {
+      margin-bottom: 1.5rem;
+
+      .MuiOutlinedInput-root {
+        color: #ffffff;
+
+        fieldset {
+          border-color: #00a346 !important;
+        }
+
+        &:hover fieldset {
+          border-color: #00a346 !important;
+        }
+
+        &.Mui-focused fieldset {
+          border-color: #1caff2 !important;
+        }
+      }
+
+      .MuiInputLabel-root {
+        color: #ffffff !important;
+      }
+    }
+
+    .or-text {
+      color: #ffffff;
+      margin-bottom: 1rem;
+    }
+
+    .dropzone {
+      border: 2px dashed #00a346;
+      border-radius: 4px;
+      padding: 2rem;
+      text-align: center;
+      cursor: pointer;
+
+      &:hover {
+        background-color: #1f252a;
+      }
+
+      .dropzone-icon {
+        margin-bottom: 1rem;
+        color: #00a346;
+        font-size: 4rem;
+      }
+
+      .dropzone-text {
+        margin-bottom: 1rem;
+        color: #ffffff;
+      }
+    }
+
+    .progress-container {
+      margin-top: 1rem;
+    }
+
+    .submit-button {
+      color: #fff;
+      font-size: 0.8rem;
+      font-weight: 900;
+      text-transform: uppercase;
+      letter-spacing: 0.04em;
+      line-height: 2.8rem;
+      display: inline-block;
+      cursor: pointer;
+      padding: 0 1rem;
+      border: 0;
+      border-radius: 4px;
+      outline: none;
+      background: #526e89;
+      transition: background-color 0.3s ease;
+
+      &:hover {
+        background-color: #1caff2;
+      }
+
+      &:disabled {
+        opacity: 0.7;
+        cursor: not-allowed;
+      }
+    }
+  }
+
+  .overview-text {
+    color: #456;
+    margin-top: 2rem;
+    padding: 1.5rem;
+  }
+}