Farbu la helan haŭton laŭ la Teo/Restoracio/Moe-stilo

pages/collections/[id].tsx

@@ -104,9 +104,8 @@ export default function Index() {
       <div
         className="h-[60rem] p-5 flex gap-3 flex-col"
         style={{
-          backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${
+          backgroundImage: `linear-gradient(${activeCollection?.color}15 10%,
-            settings.theme === "dark" ? "#262626" : "#f3f4f6"
+          ${settings.theme === "dark" ? "#171717" : "#f5f5dc"} 100%)`,
-          } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
         }}
       >
         {activeCollection && (

pages/login.tsx

@@ -258,7 +258,7 @@ export default function Login({
     <CenteredForm text={t("sign_in_to_your_account")}>
       <form onSubmit={loginUser}>
         <div
-          className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-sky-100 dark:border-neutral-700"
+          className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 dark:bg-neutral-800 rounded-2xl shadow-md border border-sky-100 dark:border-neutral-700"
           data-testid="login-form"
         >
           {displayLoginCredential()}

pages/public/collections/[id].tsx

@@ -121,9 +121,8 @@ export default function PublicCollections() {
       <div
         className="h-96"
         style={{
-          backgroundImage: `linear-gradient(${collection?.color}30 10%, ${
+          backgroundImage: `linear-gradient(${collection?.color}40 10%,
-            settings.theme === "dark" ? "#262626" : "#f3f4f6"
+		  ${settings.theme === "dark" ? "#171717" : "#f5f5dc"} 100%)`,
-          } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
         }}
       >
         {collection && (

pages/settings/preference.tsx

@@ -115,7 +115,7 @@ export default function Appearance() {
               <p className="ml-2 text-2xl">{t("dark")}</p>
             </div>
             <div
-              className={`w-full text-center outline-solid outline-neutral-content outline dark:outline-neutral-700 h-36 duration-100 rounded-md flex items-center justify-center cursor-pointer select-none bg-white ${
+              className={`w-full text-center outline-solid outline-neutral-content outline dark:outline-neutral-700 h-36 duration-100 rounded-md flex items-center justify-center cursor-pointer select-none bg-content ${
                 localStorage.getItem("theme") === "light"
                   ? "outline-primary text-primary"
                   : "text-black"

store/localSettings.ts

@@ -80,7 +80,7 @@ const useLocalSettingsStore = create<LocalSettingsStore>((set) => ({
     }));
   },
   setSettings: () => {
-    const theme = localStorage.getItem("theme") || "dark";
+    const theme = localStorage.getItem("theme") || "light";
     localStorage.setItem("theme", theme);
 
     const viewMode = localStorage.getItem("viewMode") || "card";

tailwind.config.js

@@ -6,13 +6,13 @@ module.exports = {
     themes: [
       {
         light: {
-          primary: "#0369a1",
+          primary: "#484455",
           secondary: "#0891b2",
-          accent: "#6d28d9",
+          accent: "#E78EF2",
-          neutral: "#6b7280",
+          neutral: "#664524",
-          "neutral-content": "#d1d5db",
+          "neutral-content": "#C9C9A4",
-          "base-100": "#ffffff",
+          "base-100": "#f5f5dc",
-          "base-200": "#f3f4f6",
+          "base-200": "#ffffd7",
           "base-content": "#0a0a0a",
           info: "#a5f3fc",
           success: "#22c55e",