small update

src/web/src/components/header/index.jsx

@@ -4,20 +4,9 @@ import Sidebar from "@/components/header/sidebar";
 
 function Header() {
   return (
-    <Container>
+    <header className="hidden md:flex lg:text-4xl md:text-10xl">
-      <header className="
-        hidden md:flex
-        lg:text-4xl md:text-3xl
-      ">
       <DefaultHeader />
     </header>
-      <header className="
-        flex md:hidden
-        lg:text-4xl md:text-3xl
-      ">
-        <Sidebar />
-      </header>
-    </Container>
   );
 }
 

src/web/src/components/ui/container.jsx

@@ -2,7 +2,7 @@ import React from "react";
 
 const Container = ({ children }) => {
   return ( 
-    <div className="mx-auto w-full max-w-10xl">
+    <div className="mx-auto w-full max-w-3xl">
       {children}
     </div>
    );

src/web/tailwind.config.js

@@ -8,39 +8,39 @@ module.exports = {
     extend: {
       colors: {
         light:{
-          background: "#fbf1c7",
+          background: "#282828",
-          foreground: "#3c3836",
+          foreground: "#ebdbb2",
           red: {
             1: "#cc241d",
-            2: "#9d0006"
+            2: "#fb4934"
           },
           orange: {
             1: "#d65d0e", 
-            2: "#af3a03"
+            2: "#fe8019"
           },
           green: {
             1: "#98971a",
-            2: "#79740e"
+            2: "#b8bb26"
           },
           yellow: {
             1: "#d79921",
-            2: "#b57614"
+            2: "#fabd2f"
           },
           blue: {
             1: "#458588",
-            2: "#076678"
+            2: "#83a598"
           },
           purple: {
             1: "#b16286",
-            2: "#8f3f71"
+            2: "#d3869b"
           },
           aqua: {
             1: "#689d6a",
-            2: "#427b58"
+            2: "#8ec07c"
           },
         },
         dark: {
-          background: "#282828",
+          background: "#000000",
           foreground: "#ebdbb2",
           red: {
             1: "#cc241d",