Skip to content

Commit 08d1783

Browse files
committed
rewrite 1
1 parent 7fdbc3f commit 08d1783

11 files changed

Lines changed: 468 additions & 852 deletions

File tree

.vscode/settings.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
{
2+
}

app/globals.css

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,11 @@
3434

3535
.dark {
3636
/* Dark mode overrides */
37-
--background: 240 10% 6.5%;
37+
--background: 240 6% 16%;
3838
--foreground: 0 0% 98%;
39-
--card: 240 10% 6.5%;
39+
--card: 240 6% 18%;
4040
--card-foreground: 0 0% 98%;
41-
--popover: 240 10% 6.5%;
41+
--popover: 240 6% 18%;
4242
--popover-foreground: 0 0% 98%;
4343
--secondary: 240 3.7% 18%;
4444
--secondary-foreground: 0 0% 98%;
@@ -57,11 +57,19 @@
5757
@apply border-border;
5858
}
5959
body {
60-
@apply bg-background text-foreground font-sans;
60+
@apply bg-background text-foreground font-sans antialiased;
61+
background-image: radial-gradient(hsl(var(--muted-foreground) / 0.15) 1px, transparent 1px);
62+
background-size: 24px 24px;
63+
background-position: 0 0;
6164
}
6265

6366
/* Improved heading typography */
64-
h1, h2, h3, h4, h5, h6 {
67+
h1,
68+
h2,
69+
h3,
70+
h4,
71+
h5,
72+
h6 {
6573
font-family: var(--font-inter), system-ui, sans-serif;
6674
letter-spacing: -0.025em;
6775
line-height: 1.1;
@@ -182,4 +190,4 @@
182190
/* Hide Next.js error overlay portal */
183191
nextjs-portal {
184192
display: none !important;
185-
}
193+
}

app/layout.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import type React from "react"
22
import type { Metadata } from "next"
3-
import { Inter, JetBrains_Mono } from "next/font/google"
3+
import { Outfit, JetBrains_Mono } from "next/font/google"
44
import "./globals.css"
55
import { ThemeProvider } from "@/components/theme-provider"
66
import ErrorReporter from "@/components/ErrorReporter";
77
import Script from "next/script";
88
import { Analytics } from "@vercel/analytics/next"
99
import Aurora from "@/components/ui/aurora"
1010

11-
const inter = Inter({
11+
const outfit = Outfit({
1212
subsets: ["latin"],
13-
variable: "--font-inter"
13+
variable: "--font-sans"
1414
})
1515

1616
const jetbrainsMono = JetBrains_Mono({
@@ -195,17 +195,17 @@ export default function RootLayout({
195195
children: React.ReactNode;
196196
}>) {
197197
return (
198-
<html lang="en" className={`${inter.variable} ${jetbrainsMono.variable}`} suppressHydrationWarning>
198+
<html lang="en" className={`${outfit.variable} ${jetbrainsMono.variable}`} suppressHydrationWarning>
199199
<body className="antialiased font-sans relative">
200200
{/* Aurora Background */}
201-
<div className="fixed inset-0 -z-20 w-screen h-screen">
201+
{/* <div className="fixed inset-0 -z-20 w-screen h-screen">
202202
<Aurora
203203
colorStops={["rgb(0,0,0)", "rgb(0,0,0)", "rgb(0,0,0)"]}
204204
blend={0.4}
205205
amplitude={0.8}
206206
speed={0.5}
207207
/>
208-
</div>
208+
</div> */}
209209

210210
<ErrorReporter />
211211
<Script

app/page.tsx

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
"use client"
22

33
import { useEffect, useRef } from "react"
4-
import { motion, useScroll, useTransform } from "framer-motion"
4+
// import { motion, useScroll, useTransform } from "framer-motion"
55
import Skills from "@/components/sections/skills"
66
import Projects from "@/components/sections/projects"
77
import Contact from "@/components/sections/contact"
88
import Footer from "@/components/sections/footer"
99
// import { Button } from "@/components/ui/button"
1010
// import { ArrowUp } from "lucide-react"
11-
import Navbar from "@/components/sections/navbar"
11+
// import Navbar from "@/components/sections/navbar"
1212
import Intro from "@/components/sections/intro"
1313
import WorkExperience from "@/components/sections/work-experience"
1414

@@ -39,18 +39,14 @@ export default function Home() {
3939
}, [])
4040

4141
return (
42-
<main className="relative min-h-screen">
43-
{/* Content */}
44-
<div className="relative z-20">
45-
<Navbar />
42+
<main className="min-h-screen relative">
43+
<div className="max-w-2xl mx-auto px-6 py-24 space-y-24">
4644
<Intro />
4745
<WorkExperience />
48-
<Skills />
4946
<Projects />
47+
<Skills />
5048
<Contact />
51-
<div className="hidden md:block">
52-
<Footer />
53-
</div>
49+
<Footer />
5450
</div>
5551
</main>
5652
)

components/sections/contact.tsx

Lines changed: 15 additions & 179 deletions
Original file line numberDiff line numberDiff line change
@@ -1,184 +1,20 @@
1-
import type React from "react"
2-
3-
import { useState } from "react"
4-
import { motion } from "framer-motion"
5-
import { Button } from "@/components/ui/button"
6-
import { Input } from "@/components/ui/input"
7-
import { Textarea } from "@/components/ui/textarea"
8-
import { Send } from "lucide-react"
9-
import emailjs from "@emailjs/browser"
10-
11-
export default function Contact() {
12-
const [formState, setFormState] = useState({
13-
name: "",
14-
email: "",
15-
message: "",
16-
})
17-
18-
const [isSubmitting, setIsSubmitting] = useState(false)
19-
const [isSubmitted, setIsSubmitted] = useState(false)
20-
21-
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
22-
setFormState({
23-
...formState,
24-
[e.target.name]: e.target.value,
25-
})
26-
}
27-
28-
const handleSubmit = (e: React.FormEvent) => {
29-
e.preventDefault()
30-
setIsSubmitting(true)
31-
32-
emailjs
33-
.send(
34-
'service_5vsq629',
35-
'template_huaqwe4',
36-
{
37-
name: formState.name,
38-
email: formState.email,
39-
message: formState.message,
40-
},
41-
'ob9xLxZbsRGqvatmZ'
42-
)
43-
.then(() => {
44-
setIsSubmitting(false)
45-
setIsSubmitted(true)
46-
setFormState({ name: "", email: "", message: "" })
47-
48-
setTimeout(() => setIsSubmitted(false), 5000)
49-
})
50-
.catch((err) => {
51-
setIsSubmitting(false)
52-
console.error('Email send error:', err)
53-
})
54-
}
1+
import { Mail } from "lucide-react"
2+
import { cn } from "@/lib/utils"
553

4+
export default function Contact({ className }: { className?: string }) {
565
return (
57-
<section id="contact" className="py-6 md:py-10 mb-10 relative overflow-hidden">
58-
59-
<div className="container mx-auto px-4 relative z-10">
60-
<motion.div
61-
className="animate-on-scroll"
62-
initial={{ opacity: 0, y: 50 }}
63-
whileInView={{ opacity: 1, y: 0 }}
64-
viewport={{ once: true, margin: "-100px" }}
65-
transition={{ duration: 0.8 }}
66-
>
67-
<h2 className="text-3xl md:text-4xl font-bold font-sans mb-6 text-center">
68-
Get In Touch
69-
</h2>
70-
71-
<motion.div
72-
initial={{ opacity: 0, y: 20 }}
73-
whileInView={{ opacity: 1, y: 0 }}
74-
viewport={{ once: true }}
75-
transition={{ duration: 0.5 }}
76-
className="max-w-2xl mx-auto"
77-
>
78-
<div className="bg-card/10 backdrop-blur-sm rounded-xl p-8 border border-border">
79-
<h3 className="text-2xl font-semibold font-sans mb-6 text-foreground text-center">Send Me a Message</h3>
80-
81-
{isSubmitted ? (
82-
<motion.div
83-
initial={{ opacity: 0, y: 20 }}
84-
animate={{ opacity: 1, y: 0 }}
85-
className="border border-border rounded-lg p-4 text-center bg-accent/10"
86-
>
87-
<p className="text-foreground font-medium">
88-
Thank you for your message! I'll get back to you soon.
89-
</p>
90-
</motion.div>
91-
) : (
92-
<form onSubmit={handleSubmit} className="space-y-6">
93-
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
94-
<div>
95-
<label htmlFor="name" className="block text-sm font-medium text-foreground mb-1">
96-
Name
97-
</label>
98-
<Input
99-
id="name"
100-
name="name"
101-
value={formState.name}
102-
onChange={handleChange}
103-
required
104-
className="bg-card/20 border-border text-foreground placeholder:text-muted-foreground"
105-
placeholder="Your name"
106-
/>
107-
</div>
108-
109-
<div>
110-
<label htmlFor="email" className="block text-sm font-medium text-foreground mb-1">
111-
Email
112-
</label>
113-
<Input
114-
id="email"
115-
name="email"
116-
type="email"
117-
value={formState.email}
118-
onChange={handleChange}
119-
required
120-
className="bg-card/20 border-border text-foreground placeholder:text-muted-foreground"
121-
placeholder="Your email address"
122-
/>
123-
</div>
124-
</div>
125-
126-
<div>
127-
<label htmlFor="message" className="block text-sm font-medium text-foreground mb-1">
128-
Message
129-
</label>
130-
<Textarea
131-
id="message"
132-
name="message"
133-
value={formState.message}
134-
onChange={handleChange}
135-
required
136-
className="bg-card/20 border-border text-foreground placeholder:text-muted-foreground min-h-[100px]"
137-
placeholder="Your message to me..."
138-
/>
139-
</div>
140-
141-
<Button
142-
type="submit"
143-
disabled={isSubmitting}
144-
className="w-full bg-accent/30 hover:bg-accent/50 border border-border text-accent-foreground transition-all"
145-
>
146-
{isSubmitting ? (
147-
<span className="flex items-center">
148-
<svg
149-
className="animate-spin -ml-1 mr-2 h-4 w-4 text-accent-foreground"
150-
xmlns="http://www.w3.org/2000/svg"
151-
fill="none"
152-
viewBox="0 0 24 24"
153-
>
154-
<circle
155-
className="opacity-25"
156-
cx="12"
157-
cy="12"
158-
r="10"
159-
stroke="currentColor"
160-
strokeWidth="4"
161-
></circle>
162-
<path
163-
className="opacity-75"
164-
fill="currentColor"
165-
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
166-
></path>
167-
</svg>
168-
Sending...
169-
</span>
170-
) : (
171-
<span className="flex items-center">
172-
<Send className="mr-2 h-4 w-4" /> Send Message
173-
</span>
174-
)}
175-
</Button>
176-
</form>
177-
)}
178-
</div>
179-
</motion.div>
180-
</motion.div>
181-
</div>
6+
<section className={cn("space-y-4", className)}>
7+
<h2 className="text-lg font-semibold text-foreground">Get in Touch</h2>
8+
<p className="text-muted-foreground leading-relaxed max-w-prose">
9+
I'm always open to discussing new projects, creative ideas, or opportunities to be part of your visions.
10+
</p>
11+
<a
12+
href="mailto:williamkeri007@gmail.com"
13+
className="inline-flex items-center gap-2 text-foreground font-medium hover:text-primary transition-colors hover:underline underline-offset-4"
14+
>
15+
<Mail className="h-4 w-4" />
16+
<span>williamkeri007@gmail.com</span>
17+
</a>
18218
</section>
18319
)
18420
}

0 commit comments

Comments
 (0)