diff --git a/src/web/src/app/layout.js b/src/web/src/app/layout.js index 1eb7c06..0356117 100644 --- a/src/web/src/app/layout.js +++ b/src/web/src/app/layout.js @@ -14,7 +14,7 @@ export const metadata = { export default function Layout({children}) { return ( - +
diff --git a/src/web/src/app/page.jsx b/src/web/src/app/page.jsx index 7d379a0..a424963 100644 --- a/src/web/src/app/page.jsx +++ b/src/web/src/app/page.jsx @@ -6,6 +6,8 @@ import ThemeToggle from "@/components/theme-toggle"; // Exports export default function Index() { return ( - +
+ +
); } diff --git a/src/web/src/components/footer.jsx b/src/web/src/components/footer.jsx index 7f6db57..0f10ca8 100644 --- a/src/web/src/components/footer.jsx +++ b/src/web/src/components/footer.jsx @@ -1,6 +1,6 @@ const Footer = () => { return ( -
Footer
+
Footer
); } diff --git a/src/web/src/components/header.jsx b/src/web/src/components/header.jsx index 18b1272..4192e4d 100644 --- a/src/web/src/components/header.jsx +++ b/src/web/src/components/header.jsx @@ -29,7 +29,7 @@ const navItems= [ const Header = () => { return ( -
+
Navbar
); diff --git a/src/web/src/components/theme-toggle.jsx b/src/web/src/components/theme-toggle.jsx index 425fafc..e92013c 100644 --- a/src/web/src/components/theme-toggle.jsx +++ b/src/web/src/components/theme-toggle.jsx @@ -21,6 +21,7 @@ export default function ThemeToggle() { alt="Loading Light/Dark Toggle" priority={false} title="Loading Light/Dark Toggle" + style={{ opacity: 0 }} /> ) diff --git a/src/web/tailwind.config.js b/src/web/tailwind.config.js index 0fc1201..bd1f2c0 100644 --- a/src/web/tailwind.config.js +++ b/src/web/tailwind.config.js @@ -6,6 +6,70 @@ module.exports = { darkMode: "class", theme: { extend: { + colors: { + light:{ + background: "#fbf1c7", + red: { + 1: "#cc241d", + 2: "#9d0006" + }, + orange: { + 1: "#d65d0e", + 2: "#af3a03" + }, + green: { + 1: "#98971a", + 2: "#79740e" + }, + yellow: { + 1: "#d79921", + 2: "#b57614" + }, + blue: { + 1: "#458588", + 2: "#076678" + }, + purple: { + 1: "#b16286", + 2: "#8f3f71" + }, + aqua: { + 1: "#689d6a", + 2: "#427b58" + }, + }, + dark: { + background: "#282828", + red: { + 1: "#cc241d", + 2: "#fb4934" + }, + orange: { + 1: "#d65d0e", + 2: "#fe8019" + }, + green: { + 1: "#98971a", + 2: "#b8bb26" + }, + yellow: { + 1: "#d79921", + 2: "#fabd2f" + }, + blue: { + 1: "#458588", + 2: "#83a598" + }, + purple: { + 1: "#b16286", + 2: "#d3869b" + }, + aqua: { + 1: "#689d6a", + 2: "#8ec07c" + }, + }, + }, }, }, plugins: [],