From 4e854cc2c3585b71b81904ea5cbdbb670e22bbae Mon Sep 17 00:00:00 2001 From: contradiction29 Date: Thu, 18 Apr 2024 13:15:55 +0900 Subject: [PATCH 01/50] Initialize daisyUI setting --- package-lock.json | 45 +++++++++++++++++++++++++++++++++++++++++++++ package.json | 1 + tailwind.config.ts | 5 ++++- 3 files changed, 50 insertions(+), 1 deletion(-) diff --git a/package-lock.json b/package-lock.json index 27a8e76d..3686968a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,6 +40,7 @@ "@typescript-eslint/eslint-plugin": "^6.7.4", "@typescript-eslint/parser": "^6.7.4", "autoprefixer": "^10.4.19", + "daisyui": "^4.10.2", "eslint": "^8.38.0", "eslint-import-resolver-typescript": "^3.6.1", "eslint-plugin-import": "^2.28.1", @@ -3877,6 +3878,16 @@ } ] }, + "node_modules/css-selector-tokenizer": { + "version": "0.8.0", + "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.8.0.tgz", + "integrity": "sha512-Jd6Ig3/pe62/qe5SBPTN8h8LeUg/pT4lLgtavPf7updwwHpvFzxvOQBHYj2LZDMjUnBzgvIUSjRcf6oT5HzHFg==", + "dev": true, + "dependencies": { + "cssesc": "^3.0.0", + "fastparse": "^1.1.2" + } + }, "node_modules/css-what": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", @@ -3910,6 +3921,34 @@ "resolved": "https://registry.npmjs.org/csv-parse/-/csv-parse-5.5.5.tgz", "integrity": "sha512-erCk7tyU3yLWAhk6wvKxnyPtftuy/6Ak622gOO7BCJ05+TYffnPCJF905wmOQm+BpkX54OdAl8pveJwUdpnCXQ==" }, + "node_modules/culori": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/culori/-/culori-3.3.0.tgz", + "integrity": "sha512-pHJg+jbuFsCjz9iclQBqyL3B2HLCBF71BwVNujUYEvCeQMvV97R59MNK3R2+jgJ3a1fcZgI9B3vYgz8lzr/BFQ==", + "dev": true, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + } + }, + "node_modules/daisyui": { + "version": "4.10.2", + "resolved": "https://registry.npmjs.org/daisyui/-/daisyui-4.10.2.tgz", + "integrity": "sha512-eCWS1W/JPyxW9IvlgW5m0R6rp9ZhRsBTW37rvEUthckkjsV04u8XipV519OoccSA46ixhSJa3q7XLI1WUFtRCA==", + "dev": true, + "dependencies": { + "css-selector-tokenizer": "^0.8", + "culori": "^3", + "picocolors": "^1", + "postcss-js": "^4" + }, + "engines": { + "node": ">=16.9.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/daisyui" + } + }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -5373,6 +5412,12 @@ "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==", "dev": true }, + "node_modules/fastparse": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz", + "integrity": "sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==", + "dev": true + }, "node_modules/fastq": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz", diff --git a/package.json b/package.json index f311566e..8adcd279 100644 --- a/package.json +++ b/package.json @@ -47,6 +47,7 @@ "@typescript-eslint/eslint-plugin": "^6.7.4", "@typescript-eslint/parser": "^6.7.4", "autoprefixer": "^10.4.19", + "daisyui": "^4.10.2", "eslint": "^8.38.0", "eslint-import-resolver-typescript": "^3.6.1", "eslint-plugin-import": "^2.28.1", diff --git a/tailwind.config.ts b/tailwind.config.ts index 7f1da930..99568386 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -12,6 +12,9 @@ export default { "lg" : "16px", } }, - plugins: [], + plugins: [require("daisyui")], + daisyui: { + themes: ["nord", "sunset"] + } } satisfies Config From 7cc314d14907c1a31f8d1bf89152d3803ef32f75 Mon Sep 17 00:00:00 2001 From: contradiction29 Date: Thu, 18 Apr 2024 14:43:13 +0900 Subject: [PATCH 02/50] Add ThemeSwitch Component --- app/components/ThemeSwitcher.tsx | 25 +++++++++++++++++++++++++ tailwind.config.ts | 2 +- 2 files changed, 26 insertions(+), 1 deletion(-) create mode 100644 app/components/ThemeSwitcher.tsx diff --git a/app/components/ThemeSwitcher.tsx b/app/components/ThemeSwitcher.tsx new file mode 100644 index 00000000..0c7167de --- /dev/null +++ b/app/components/ThemeSwitcher.tsx @@ -0,0 +1,25 @@ +import { useState } from "react"; + +export default function ThemeSwitcher() { + const [isDarkTheme, setIsDarkTheme] = useState(() => { + if (typeof window !== "undefined") { + return window.matchMedia("(prefers-color-scheme: dark)").matches; + } + return false; + }); + + const toggleTheme = () => { + setIsDarkTheme(!isDarkTheme); + const themes = ["light", "dark"]; + document.querySelector("html")?.setAttribute("data-theme", themes[isDarkTheme ? 0 : 1]); + }; + + return ( + + ); +} \ No newline at end of file diff --git a/tailwind.config.ts b/tailwind.config.ts index 99568386..c3179587 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -14,7 +14,7 @@ export default { }, plugins: [require("daisyui")], daisyui: { - themes: ["nord", "sunset"] + themes: ["light", "dark"] } } satisfies Config From a7389e4ac652a48af998490ac4f4173d4827931a Mon Sep 17 00:00:00 2001 From: contradiction29 Date: Thu, 18 Apr 2024 15:02:17 +0900 Subject: [PATCH 03/50] Add themeing --- tailwind.config.ts | 21 ++++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/tailwind.config.ts b/tailwind.config.ts index c3179587..a9f5ab1e 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -14,7 +14,26 @@ export default { }, plugins: [require("daisyui")], daisyui: { - themes: ["light", "dark"] + themes: [ + { + light: { + // eslint-disable-next-line @typescript-eslint/no-var-requires + ...require("daisyui/src/theming/themes")["light"], + primary: "#0017C1", + secondary: "#264AF4", + tertiary: "#00118F", + }, + }, + { + dark: { + // eslint-disable-next-line @typescript-eslint/no-var-requires + ...require("daisyui/src/theming/themes")["dark"], + primary: "#0017C1", + secondary: "#264AF4", + tertiary: "#00118F", + }, + }, + ], } } satisfies Config From 7f3a9535d68ae47d00aa612d0a78e770349fbab1 Mon Sep 17 00:00:00 2001 From: contradiction29 Date: Thu, 18 Apr 2024 15:07:11 +0900 Subject: [PATCH 04/50] Change color for navbar and footer --- app/routes/_layout.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/routes/_layout.tsx b/app/routes/_layout.tsx index f01ab6c4..9c0f2418 100644 --- a/app/routes/_layout.tsx +++ b/app/routes/_layout.tsx @@ -70,7 +70,7 @@ export default function Component() {
-