add theme toggle to footer

arlyon · Jun 7, 2024 · ffcb5c6 · ffcb5c6
1 parent b289f5b
commit ffcb5c6
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/site/app/page.tsx b/site/app/page.tsx
@@ -87,7 +87,7 @@ export default function HomePage() {
             <span className="inline-block">Home Automation</span>{" "}
             <span className="inline-block">
               That{" "}
-              <span className="bg-gradient-to-b from-green-950 to-green-500 inline-block text-transparent bg-clip-text">
+              <span className="bg-gradient-to-b to-green-800 from-green-500 dark:from-green-900 dark:to-green-500 inline-block text-transparent bg-clip-text">
                 Scales
               </span>
             </span>
@@ -158,7 +158,7 @@ export default function HomePage() {
 
         <div />
         <div />
-        <div className="flex items-center justify-center pattern-diagonal-lines pattern-green-300 pattern-bg-green-50 dark:pattern-bg-black pattern-size-2 pattern-opacity-100">
+        <div className="flex items-center justify-center pattern-diagonal-lines pattern-green-300 dark:pattern-green-800 pattern-bg-green-50 dark:pattern-bg-black pattern-size-2 pattern-opacity-100">
           <div className="main-grid grid gap-[1px] sm:grid-cols-2 xl:grid-cols-4 bg-border outline outline-1 outline-border dark:outline-muted dark:bg-muted">
             {[
               {

diff --git a/site/components/footer.tsx b/site/components/footer.tsx
@@ -5,6 +5,7 @@
  */
 import { Logo } from "@/app/page";
 import Link from "next/link";
+import { ThemeToggle } from "./theme-toggle";
 
 export function Footer() {
   return (
@@ -50,7 +51,7 @@ export function Footer() {
             </li>
           </ul>
         </div>
-        <div className="lg:order-3">
+        <div className="lg:order-3 flex flex-col items-start gap-4">
           <p className="text-muted-foreground">
             Made by{" "}
             <Link
@@ -61,6 +62,7 @@ export function Footer() {
               @arlyon
             </Link>
           </p>
+          <ThemeToggle />
         </div>
         <div>
           <h4 className="font-semibold mb-2">Community</h4>