-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
4408384
commit a072ace
Showing
12 changed files
with
145 additions
and
47 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { useState, useEffect } from "react"; | ||
import { useTheme } from "next-themes"; | ||
import { MoonIcon, SunIcon } from "@heroicons/react/24/outline"; | ||
|
||
export const ThemeSwitcher = () => { | ||
const [mounted, setMounted] = useState(false); | ||
const { theme, setTheme } = useTheme(); | ||
|
||
useEffect(() => { | ||
setMounted(true); | ||
}, []); | ||
|
||
if (!mounted) { | ||
return null; | ||
} | ||
|
||
return ( | ||
<button | ||
className={`p-1 rounded-md hover:scale-110 active:scale-100 duration-200 dark:bg-[#212933]`} | ||
onClick={() => setTheme(theme === "dark" ? "light" : "dark")} | ||
> | ||
{theme === "light" ? <MoonIcon className="w-4" /> : <SunIcon className="w-4" />} | ||
</button> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
import * as React from "react"; | ||
import { ThemeProvider as NextThemesProvider } from "next-themes"; | ||
import type { ThemeProviderProps } from "next-themes/dist/types"; | ||
|
||
export function ThemeProvider({ children, ...props }: ThemeProviderProps) { | ||
return <NextThemesProvider {...props}>{children}</NextThemesProvider>; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
export default function Contact() { | ||
return ( | ||
<section className="w-full min-h-screen bg-white dark:bg-gray-900 lg:flex"> | ||
<div className="flex flex-col justify-center w-full p-8 lg:bg-gray-100 lg:dark:bg-gray-800 lg:px-12 xl:px-32 lg:w-1/2"> | ||
<h1 className="text-2xl font-semibold text-gray-800 capitalize dark:text-white lg:text-3xl">contact me.</h1> | ||
|
||
<p className="mt-4 text-gray-500 dark:text-gray-400">Ask me everything and I would love to hear from you</p> | ||
|
||
<div className="mt-6 md:mt-8"> | ||
<h3 className="font-medium text-gray-600 dark:text-gray-300">Follow me</h3> | ||
|
||
<div className="flex mt-4 -mx-1.5"> | ||
<a | ||
className="mx-1.5 dark:hover:text-blue-400 text-gray-400 transition-colors duration-300 transform hover:text-blue-500" | ||
href="#" | ||
> | ||
<svg className="w-8 h-8" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
<path | ||
d="M15.2 8.80005C16.4731 8.80005 17.694 9.30576 18.5941 10.2059C19.4943 11.1061 20 12.327 20 13.6V19.2H16.8V13.6C16.8 13.1757 16.6315 12.7687 16.3314 12.4687C16.0313 12.1686 15.6244 12 15.2 12C14.7757 12 14.3687 12.1686 14.0687 12.4687C13.7686 12.7687 13.6 13.1757 13.6 13.6V19.2H10.4V13.6C10.4 12.327 10.9057 11.1061 11.8059 10.2059C12.7061 9.30576 13.927 8.80005 15.2 8.80005Z" | ||
fill="currentColor" | ||
/> | ||
<path d="M7.2 9.6001H4V19.2001H7.2V9.6001Z" fill="currentColor" /> | ||
<path | ||
d="M5.6 7.2C6.48366 7.2 7.2 6.48366 7.2 5.6C7.2 4.71634 6.48366 4 5.6 4C4.71634 4 4 4.71634 4 5.6C4 6.48366 4.71634 7.2 5.6 7.2Z" | ||
fill="currentColor" | ||
/> | ||
</svg> | ||
</a> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div className="flex flex-col justify-center w-full p-8 pt-0 lg:w-1/2 lg:px-12 xl:px-24 "> | ||
<form> | ||
<div className="-mx-2 md:items-center md:flex"> | ||
<div className="flex-1 px-2"> | ||
<label className="block mb-2 text-sm text-gray-600 dark:text-gray-200">Full Name</label> | ||
<input | ||
type="text" | ||
placeholder="John Doe" | ||
className="block w-full px-5 py-3 mt-2 text-gray-700 placeholder-gray-400 bg-white border border-gray-200 rounded-md dark:placeholder-gray-600 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-700 focus:border-blue-400 dark:focus:border-blue-400 focus:ring-blue-400 focus:outline-none focus:ring focus:ring-opacity-40" | ||
/> | ||
</div> | ||
|
||
<div className="flex-1 px-2 mt-4 md:mt-0"> | ||
<label className="block mb-2 text-sm text-gray-600 dark:text-gray-200">Email address</label> | ||
<input | ||
type="email" | ||
placeholder="[email protected]" | ||
className="block w-full px-5 py-3 mt-2 text-gray-700 placeholder-gray-400 bg-white border border-gray-200 rounded-md dark:placeholder-gray-600 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-700 focus:border-blue-400 dark:focus:border-blue-400 focus:ring-blue-400 focus:outline-none focus:ring focus:ring-opacity-40" | ||
/> | ||
</div> | ||
</div> | ||
|
||
<div className="w-full mt-4"> | ||
<label className="block mb-2 text-sm text-gray-600 dark:text-gray-200">Message</label> | ||
<textarea | ||
className="block w-full h-32 px-5 py-3 mt-2 text-gray-700 placeholder-gray-400 bg-white border border-gray-200 rounded-md md:h-56 dark:placeholder-gray-600 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-700 focus:border-blue-400 dark:focus:border-blue-400 focus:ring-blue-400 focus:outline-none focus:ring focus:ring-opacity-40" | ||
placeholder="Message" | ||
></textarea> | ||
</div> | ||
|
||
<button className="w-full px-6 py-3 mt-4 text-sm font-medium tracking-wide text-white capitalize transition-colors duration-300 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-50"> | ||
get in touch | ||
</button> | ||
</form> | ||
</div> | ||
</section> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,3 @@ | ||
import Head from "next/head"; | ||
import Image from "next/image"; | ||
|
||
export default function Home() { | ||
return ( | ||
<div> | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters