Merge pull request #44 from Fefedu973/working

Perfectly done. Thanks a lot 💯
Magic-Fishes · Nov 11, 2024 · 0b3189b · 0b3189b
2 parents 95f63d4 + 46dd4af
commit 0b3189b
Show file tree

Hide file tree

Showing 36 changed files with 1,767 additions and 235 deletions.
diff --git a/src/App.css b/src/App.css
@@ -121,7 +121,7 @@
     --box-shadow-color-scrollbar-thumb: 108, 126, 133;
     --box-shadow-color-scrollbar-thumb-on-hover: 143, 141, 185;
 
-    --alpha-shadow-color-scroll-shaded-div: 0.5;
+    --alpha-shadow-color-scroll-shaded-div: 0.3;
 }
 
 :root.dark {
@@ -190,7 +190,7 @@
     --box-shadow-color-scrollbar-thumb: 118, 118, 162;
     --box-shadow-color-scrollbar-thumb-on-hover: 143, 141, 185;
 
-    --alpha-shadow-color-scroll-shaded-div: 0.5;
+    --alpha-shadow-color-scroll-shaded-div: 0.3;
 
     --color-very-good: 0, 255, 0;
     --color-very-good-background: 0, 255, 0, 0.1;
@@ -266,7 +266,7 @@
     --box-shadow-color-scrollbar-thumb: 136, 136, 184;
     --box-shadow-color-scrollbar-thumb-on-hover: 116, 116, 164;
 
-    --alpha-shadow-color-scroll-shaded-div: 0.3;
+    --alpha-shadow-color-scroll-shaded-div: 0.2;
 
     --color-very-good: 21, 87, 37;
     --color-very-good-background: 0, 255, 0, 0.2;

diff --git a/src/App.jsx b/src/App.jsx
diff --git a/src/components/app/Account/Account.css b/src/components/app/Account/Account.css
@@ -65,10 +65,16 @@ body:has(#account) {
     display: flex;
     flex-flow: column nowrap;
 }
+
 #documents.frame {
     display: flex;
     flex-flow: column nowrap;
+    overflow: auto;
+}
+#documents .file-name {
+    font-size: 18px;
 }
+
 .coming-soon {
     height: 100%;
     color: rgb(var(--text-color-alt));
@@ -81,6 +87,7 @@ body:has(#account) {
     border-radius: 8px;
     opacity: .5;
 }
+
 #profile .coming-soon {
     margin-top: 30px;
 }
@@ -151,7 +158,7 @@ body:has(#account) {
         grid-column: auto;
         grid-row: 3 / 4;
     }
-    
+
     #account .frame .frame-heading {
         padding-block: 10px;
     }
@@ -170,4 +177,108 @@ body:has(#account) {
     11% {
         transform: translateY(0);
     }
+}
+
+.file-component {
+    z-index: 0 !important;
+    margin: 5px;
+    background-color: transparent;
+    border: none;
+    height: 70px;
+}
+
+.file-component .file-icon {
+    width: 50px
+}
+
+.document-category h3 {
+    font-weight: var(--font-weight-semi-bold);
+    display: flex;
+    align-items: center;
+    margin: 0;
+    /* To remove any default margins from the h3 */
+    /* Optional: adjust based on your design */
+}
+
+.document-category h3::after {
+    content: '';
+    flex-grow: 1;
+    height: 1px;
+    margin-left: 15px;
+    /* Space between title and the line */
+    background-color: rgb(var(--border-color-0));
+    /* Customize color as needed */
+    border: none;
+}
+
+.year-selector {
+    width: 160px;
+}
+
+.frame-heading-container {
+    display: flex;
+    flex: auto 200px;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 30px;
+}
+
+.frame-heading-documents {
+    margin: 0 auto;
+    padding-left: 160px;
+}
+
+@media only screen and (max-width: 1150px) {
+    .frame-heading-documents {
+        padding-left: 0;
+    }
+}
+
+.file-box {
+    display: flex;
+    align-items: center;
+}
+
+.file-box-loader {
+    display: grid;
+    grid-template-columns: 3.5fr .5fr;
+    gap: 10px;
+}
+
+.file-date {
+    margin-left: auto;
+    margin-right: 30px;
+    font-size: var(--font-size-16);
+    font-weight: 500;
+}
+
+.no-available-documents {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    width: 100%;
+    gap: 15px;
+    color: rgb(var(--text-color-alt));
+}
+
+.document-container {
+    height: 100%;
+}
+
+.single-year {
+    padding-left: 0 !important;
+}
+
+.documents-container {
+    display: flex;
+    height: 100%;
+    flex-direction: column;
+}
+
+.sleeping-logo {
+    width: 100px;
+    height: 100px;
+    margin: 0 auto;
 }