feat: adjust colors

Author: MohaElder

src/App.vue

@@ -138,14 +138,14 @@ export default {
 /* Liquid Glass Effect for AppBar */
 .liquid-glass-app-bar {
   position: relative;
-  background: rgba(255, 255, 255, 0.1) !important;
+  background: rgba(0, 0, 0, 0.25) !important;
   backdrop-filter: blur(20px) saturate(180%);
   -webkit-backdrop-filter: blur(20px) saturate(180%);
-  border: 1px solid rgba(255, 255, 255, 0.125);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
   box-shadow: 
-    0 8px 32px 0 rgba(31, 38, 135, 0.37),
-    inset 0 1px 0 rgba(255, 255, 255, 0.1);
+    0 8px 32px 0 rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.05);
   overflow: hidden;
 }
 
@@ -159,10 +159,9 @@ export default {
   background: linear-gradient(
     90deg,
     transparent,
-    rgba(255, 255, 255, 0.1),
+    rgba(255, 255, 255, 0.08),
     transparent
   );
-  animation: shimmer 3s infinite;
   z-index: 1;
 }
 
@@ -175,24 +174,24 @@ export default {
   bottom: 0;
   background: linear-gradient(
     135deg,
-    rgba(255, 255, 255, 0.1) 0%,
-    rgba(255, 255, 255, 0.05) 50%,
-    rgba(255, 255, 255, 0.1) 100%
+    rgba(255, 255, 255, 0.08) 0%,
+    rgba(255, 255, 255, 0.03) 50%,
+    rgba(255, 255, 255, 0.08) 100%
   );
   z-index: 0;
 }
 
 /* Liquid Glass Effect for Footer */
 .liquid-glass-footer {
   position: relative;
-  background: rgba(255, 255, 255, 0.1) !important;
+  background: rgba(0, 0, 0, 0.25) !important;
   backdrop-filter: blur(20px) saturate(180%);
   -webkit-backdrop-filter: blur(20px) saturate(180%);
-  border: 1px solid rgba(255, 255, 255, 0.125);
-  border-top: 1px solid rgba(255, 255, 255, 0.2);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-top: 1px solid rgba(255, 255, 255, 0.12);
   box-shadow: 
-    0 -8px 32px 0 rgba(31, 38, 135, 0.37),
-    inset 0 -1px 0 rgba(255, 255, 255, 0.1);
+    0 -8px 32px 0 rgba(0, 0, 0, 0.4),
+    inset 0 -1px 0 rgba(255, 255, 255, 0.05);
   overflow: hidden;
 }
 
@@ -206,10 +205,9 @@ export default {
   background: linear-gradient(
     90deg,
     transparent,
-    rgba(255, 255, 255, 0.1),
+    rgba(255, 255, 255, 0.08),
     transparent
   );
-  animation: shimmer 3s infinite;
   z-index: 1;
 }
 
@@ -222,23 +220,13 @@ export default {
   bottom: 0;
   background: linear-gradient(
     135deg,
-    rgba(255, 255, 255, 0.1) 0%,
-    rgba(255, 255, 255, 0.05) 50%,
-    rgba(255, 255, 255, 0.1) 100%
+    rgba(255, 255, 255, 0.08) 0%,
+    rgba(255, 255, 255, 0.03) 50%,
+    rgba(255, 255, 255, 0.08) 100%
   );
   z-index: 0;
 }
 
-/* Shimmer Animation */
-@keyframes shimmer {
-  0% {
-    left: -100%;
-  }
-  100% {
-    left: 100%;
-  }
-}
-
 /* Ensure content stays above the effects */
 .liquid-glass-app-bar > *,
 .liquid-glass-footer > * {

src/plugins/vuetify.ts

@@ -14,8 +14,8 @@ import { createVuetify, ThemeDefinition } from 'vuetify'
 const myCustomLightTheme: ThemeDefinition = {
   dark: false,
   colors: {
-    background: '#121212',
-    surface: '#121212',
+    background: '#000000',
+    surface: '#000000',
     primary: '#ffd738',
     secondary: '#03DAC6',
     error: '#B00020',