trevato/trevato.dev

Public: anyone can read this; the crew can change it.

More
Mapg aRunsg rEventsFlows

Website improvement and enhancement #23

Trevato opened this view on origin

Check · Review · Land · Live — Its check is red. Next: builder, its check is red.

ConversationFiles
Ready to land

claude/website-improvements-011CUu8oLgg98ynXG3RDfAzG → main 1 commit

  • Ready to merge — no conflicts with main. 1 commit will land on main.

    Check faileddeploy ec89f83

    You need write access to merge.

A guest

This pull comes from a guest: its preview runs without the app's variables or a forge token until a person who can write here approves it.

This pull waits for a person who can write here to review it; it never lands on its own.

Review

Sign in to review this change.
12 files changed +59 −59
src/app/globals.css +32 −32
@@ -4,33 +4,33 @@
44
55 @layer base {
66 :root {
7 --background: 222.2 84% 4.9%;
8 --foreground: 210 40% 98%;
9
10 --card: 222.2 84% 4.9%;
11 --card-foreground: 210 40% 98%;
12
13 --popover: 222.2 84% 4.9%;
14 --popover-foreground: 210 40% 98%;
15
16 --primary: 217.2 91.2% 59.8%;
17 --primary-foreground: 222.2 47.4% 11.2%;
18
19 --secondary: 217.2 32.6% 17.5%;
20 --secondary-foreground: 210 40% 98%;
21
22 --muted: 217.2 32.6% 17.5%;
23 --muted-foreground: 215 20.2% 65.1%;
24
25 --accent: 217.2 32.6% 17.5%;
26 --accent-foreground: 210 40% 98%;
27
7 --background: 160 84% 4.9%;
8 --foreground: 150 40% 98%;
9
10 --card: 160 84% 4.9%;
11 --card-foreground: 150 40% 98%;
12
13 --popover: 160 84% 4.9%;
14 --popover-foreground: 150 40% 98%;
15
16 --primary: 142 91.2% 49.8%;
17 --primary-foreground: 160 47.4% 11.2%;
18
19 --secondary: 155 32.6% 17.5%;
20 --secondary-foreground: 150 40% 98%;
21
22 --muted: 155 32.6% 17.5%;
23 --muted-foreground: 150 20.2% 65.1%;
24
25 --accent: 155 32.6% 17.5%;
26 --accent-foreground: 150 40% 98%;
27
2828 --destructive: 0 62.8% 30.6%;
29 --destructive-foreground: 210 40% 98%;
30
31 --border: 217.2 32.6% 17.5%;
32 --input: 217.2 32.6% 17.5%;
33 --ring: 224.3 76.3% 48%;
29 --destructive-foreground: 150 40% 98%;
30
31 --border: 155 32.6% 17.5%;
32 --input: 155 32.6% 17.5%;
33 --ring: 142 76.3% 48%;
3434 }
3535 }
3636
@@ -45,16 +45,16 @@
4545
4646 /* Custom styles */
4747 body {
48 background: linear-gradient(to bottom, #000000, #001f3f);
48 background: linear-gradient(to bottom, #000000, #003f20);
4949 min-height: 100vh;
5050 }
5151
5252 .text-glow {
53 text-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
53 text-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
5454 }
5555
5656 .neon-border {
57 box-shadow: 0 0 10px rgba(59, 130, 246, 0.5), inset 0 0 10px rgba(59, 130, 246, 0.5);
57 box-shadow: 0 0 10px rgba(34, 197, 94, 0.5), inset 0 0 10px rgba(34, 197, 94, 0.5);
5858 }
5959
6060 @keyframes pulse {
@@ -88,13 +88,13 @@ body {
8888
8989 @keyframes glow {
9090 0% {
91 box-shadow: 0 0 5px rgba(59, 130, 246, 0.5);
91 box-shadow: 0 0 5px rgba(34, 197, 94, 0.5);
9292 }
9393 50% {
94 box-shadow: 0 0 20px rgba(59, 130, 246, 0.8);
94 box-shadow: 0 0 20px rgba(34, 197, 94, 0.8);
9595 }
9696 100% {
97 box-shadow: 0 0 5px rgba(59, 130, 246, 0.5);
97 box-shadow: 0 0 5px rgba(34, 197, 94, 0.5);
9898 }
9999 }
100100
src/app/playground/page.tsx +2 −2
@@ -32,9 +32,9 @@ export default function PlaygroundPage() {
3232 <div className="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-4">
3333 {tools.map((tool) => (
3434 <Link key={tool.href} href={tool.href}>
35 <Card className="bg-black/50 backdrop-blur-md border-blue-500 p-6 hover:border-blue-400 transition-all duration-200 cursor-pointer h-full">
35 <Card className="bg-black/50 backdrop-blur-md border-green-500 p-6 hover:border-green-400 transition-all duration-200 cursor-pointer h-full">
3636 <div className="flex flex-col items-center text-center space-y-3">
37 <tool.icon className="w-12 h-12 text-blue-400" />
37 <tool.icon className="w-12 h-12 text-green-400" />
3838 <h2 className="text-xl font-semibold text-white">{tool.title}</h2>
3939 <p className="text-sm text-gray-300">{tool.description}</p>
4040 </div>
src/app/projects/page.tsx +1 −1
@@ -42,7 +42,7 @@ export default async function Page() {
4242 <p className="text-sm text-gray-400 group-hover:text-gray-300 transition-colors duration-300 mb-4">
4343 {description}
4444 </p>
45 <div className="w-12 h-1 bg-blue-500 group-hover:w-full transition-all duration-500 ease-in-out"></div>
45 <div className="w-12 h-1 bg-green-500 group-hover:w-full transition-all duration-500 ease-in-out"></div>
4646 </Link>
4747 </Card>
4848 ))}
src/components/FloatingNavigation.tsx +2 −2
@@ -52,13 +52,13 @@ export const FloatingNavigation: React.FC = () => {
5252 <Menu className="h-6 w-6" />
5353 </Button>
5454 </SheetTrigger>
55 <SheetContent className="bg-black/80 backdrop-blur-md text-white border-blue-500">
55 <SheetContent className="bg-black/80 backdrop-blur-md text-white border-green-500">
5656 <nav className="flex flex-col space-y-4 mt-8">
5757 {navItems.map((item) => (
5858 <Link
5959 key={item.href}
6060 href={item.href}
61 className="text-lg hover:text-blue-400 transition-colors"
61 className="text-lg hover:text-green-400 transition-colors"
6262 onClick={() => setOpen(false)}
6363 >
6464 {item.label}
src/components/GitHubProject.tsx +2 −2
@@ -35,7 +35,7 @@ export const GitHubProject: React.FC<GitHubProjectProps> = ({
3535 }) => {
3636 return (
3737 <section className="py-8 px-4 max-w-4xl mx-auto">
38 <Card className="bg-black/30 backdrop-blur-lg border-blue-500/50 overflow-hidden shadow-lg">
38 <Card className="bg-black/30 backdrop-blur-lg border-green-500/50 overflow-hidden shadow-lg">
3939 <CardContent className="p-6 shadow-inner">
4040 <div className="mb-6">
4141 <h2 className="text-2xl font-semibold text-gray-100 flex items-center">
@@ -64,7 +64,7 @@ export const GitHubProject: React.FC<GitHubProjectProps> = ({
6464 href={repoUrl}
6565 target="_blank"
6666 rel="noopener noreferrer"
67 className="text-blue-400 hover:text-blue-300 flex items-center justify-center"
67 className="text-green-400 hover:text-green-300 flex items-center justify-center"
6868 >
6969 <FaGithub className="mr-2" /> View on GitHub
7070 </Link>
src/components/HeroSection.tsx +3 −3
@@ -26,7 +26,7 @@ export const HeroSection: React.FC = () => {
2626 initial={{ opacity: 0 }}
2727 animate={{ opacity: 1 }}
2828 transition={{ duration: 0.5, delay: 0.5 }}
29 className="text-xl md:text-2xl mb-8 text-blue-200"
29 className="text-xl md:text-2xl mb-8 text-green-200"
3030 >
3131 <TypeAnimation
3232 sequence={[
@@ -48,10 +48,10 @@ export const HeroSection: React.FC = () => {
4848 transition={{ duration: 0.5, delay: 0.8 }}
4949 className="space-x-4"
5050 >
51 <Button asChild className="bg-blue-600 hover:bg-blue-700 text-white neon-border">
51 <Button asChild className="bg-green-600 hover:bg-green-700 text-white neon-border">
5252 <Link href="#booking">Book a Call ($500)</Link>
5353 </Button>
54 <Button variant="outline" asChild className="border-blue-500 text-blue-500 hover:bg-blue-900 neon-border">
54 <Button variant="outline" asChild className="border-green-500 text-green-500 hover:bg-green-900 neon-border">
5555 <Link href="/projects">Explore My Work</Link>
5656 </Button>
5757 </motion.div>
src/components/InteractiveBackground.tsx +1 −1
@@ -40,7 +40,7 @@ export const InteractiveBackground: React.FC = () => {
4040 particles.forEach((particle) => {
4141 ctx.beginPath()
4242 ctx.arc(particle.x, particle.y, particle.size, 0, Math.PI * 2)
43 ctx.fillStyle = `rgba(59, 130, 246, ${0.3 + particle.speed * 0.4})`
43 ctx.fillStyle = `rgba(34, 197, 94, ${0.3 + particle.speed * 0.4})`
4444 ctx.fill()
4545
4646 particle.x += Math.cos(particle.angle) * particle.speed
src/components/Me.tsx +6 −6
@@ -39,7 +39,7 @@ export const Me: React.FC = () => {
3939 animate={{ opacity: 1, y: 0 }}
4040 transition={{ duration: 0.5 }}
4141 >
42 <Card className="bg-black/50 backdrop-blur-md border-blue-500 hover:border-blue-300 transition-colors max-w-2xl mx-4">
42 <Card className="bg-black/50 backdrop-blur-md border-green-500 hover:border-green-300 transition-colors max-w-2xl mx-4">
4343 <CardHeader className="flex flex-col sm:flex-row items-center sm:space-x-4 space-y-4 sm:space-y-0">
4444 <div className="w-24 h-24 rounded-full overflow-hidden">
4545 <Image
@@ -50,7 +50,7 @@ export const Me: React.FC = () => {
5050 className="object-cover w-full h-full"
5151 />
5252 </div>
53 <CardTitle className="text-blue-300 text-center sm:text-left">
53 <CardTitle className="text-green-300 text-center sm:text-left">
5454 {person.name}
5555 </CardTitle>
5656 </CardHeader>
@@ -63,7 +63,7 @@ export const Me: React.FC = () => {
6363 href={person.github}
6464 target="_blank"
6565 rel="noopener noreferrer"
66 className="text-blue-300 hover:text-blue-100 flex items-center"
66 className="text-green-300 hover:text-green-100 flex items-center"
6767 >
6868 <FaGithub className="mr-2" /> GitHub
6969 </Link>
@@ -71,7 +71,7 @@ export const Me: React.FC = () => {
7171 href={person.linkedin}
7272 target="_blank"
7373 rel="noopener noreferrer"
74 className="text-blue-300 hover:text-blue-100 flex items-center"
74 className="text-green-300 hover:text-green-100 flex items-center"
7575 >
7676 <FaLinkedin className="mr-2" /> LinkedIn
7777 </Link>
@@ -79,7 +79,7 @@ export const Me: React.FC = () => {
7979 href={person.x}
8080 target="_blank"
8181 rel="noopener noreferrer"
82 className="text-blue-300 hover:text-blue-100 flex items-center"
82 className="text-green-300 hover:text-green-100 flex items-center"
8383 >
8484 <FaXTwitter className="mr-2" /> Twitter
8585 </Link>
@@ -87,7 +87,7 @@ export const Me: React.FC = () => {
8787 href="/resume-trevor-dobbertin.pdf"
8888 target="_blank"
8989 rel="noopener noreferrer"
90 className="text-blue-300 hover:text-blue-100 flex items-center"
90 className="text-green-300 hover:text-green-100 flex items-center"
9191 >
9292 <FaFilePdf className="mr-2" /> Resume
9393 </Link>
src/components/ProjectsList.tsx +3 −3
@@ -25,9 +25,9 @@ export const ProjectsList: React.FC = () => {
2525 animate={{ opacity: 1, y: 0 }}
2626 transition={{ duration: 0.5, delay: index * 0.1 }}
2727 >
28 <Card className="bg-black/50 backdrop-blur-md border-blue-500 hover:border-blue-300 transition-colors h-full flex flex-col overflow-hidden">
28 <Card className="bg-black/50 backdrop-blur-md border-green-500 hover:border-green-300 transition-colors h-full flex flex-col overflow-hidden">
2929 <CardHeader>
30 <CardTitle className="text-blue-300">{project.title}</CardTitle>
30 <CardTitle className="text-green-300">{project.title}</CardTitle>
3131 </CardHeader>
3232 <CardContent className="flex-grow flex flex-col">
3333 <div className="relative h-48 mb-4">
@@ -35,7 +35,7 @@ export const ProjectsList: React.FC = () => {
3535 </div>
3636 <p className="text-white mb-4">{project.description}</p>
3737 <div className="flex justify-between mt-auto">
38 <Link href={project.github} target="_blank" rel="noopener noreferrer" className="flex items-center text-blue-400 hover:text-blue-300 transition-colors">
38 <Link href={project.github} target="_blank" rel="noopener noreferrer" className="flex items-center text-green-400 hover:text-green-300 transition-colors">
3939 <Github className="mr-2 h-4 w-4" />
4040 GitHub
4141 </Link>
src/components/ServicesOverview.tsx +3 −3
@@ -15,13 +15,13 @@ export const ServicesOverview: React.FC = () => {
1515 transition={{ duration: 0.5 }}
1616 >
1717 <h2 className="text-3xl font-bold mb-8 text-center text-white">Start Here</h2>
18 <Card className="bg-black/50 backdrop-blur-md border-blue-500 max-w-3xl mx-auto">
18 <Card className="bg-black/50 backdrop-blur-md border-green-500 max-w-3xl mx-auto">
1919 <CardHeader>
20 <CardTitle className="text-blue-300">Got an idea? A problem you can&apos;t stop thinking about?</CardTitle>
20 <CardTitle className="text-green-300">Got an idea? A problem you can&apos;t stop thinking about?</CardTitle>
2121 </CardHeader>
2222 <CardContent>
2323 <p className="text-gray-300 mb-4">Book a consultation. We&apos;ll talk through it, figure out if it&apos;s something we should build together.</p>
24 <p className="text-blue-300 font-semibold mb-4">$500. 30 minutes. No nonsense.</p>
24 <p className="text-green-300 font-semibold mb-4">$500. 30 minutes. No nonsense.</p>
2525 <div className="relative">
2626 <Cal
2727 calLink="trevato/consultation"
src/components/SkillsSection.tsx +3 −3
@@ -23,12 +23,12 @@ export const SkillsSection: React.FC = () => {
2323 initial={{ opacity: 0, x: -20 }}
2424 animate={{ opacity: 1, x: 0 }}
2525 transition={{ duration: 0.5, delay: index * 0.1 }}
26 className="bg-black/50 backdrop-blur-md border border-blue-500 rounded-lg p-4"
26 className="bg-black/50 backdrop-blur-md border border-green-500 rounded-lg p-4"
2727 >
28 <h3 className="text-xl font-semibold text-blue-300 mb-2">{skill.name}</h3>
28 <h3 className="text-xl font-semibold text-green-300 mb-2">{skill.name}</h3>
2929 <div className="w-full bg-gray-700 rounded-full h-2.5">
3030 <motion.div
31 className="bg-blue-600 h-2.5 rounded-full"
31 className="bg-green-600 h-2.5 rounded-full"
3232 initial={{ width: 0 }}
3333 animate={{ width: `${skill.level}%` }}
3434 transition={{ duration: 1, delay: 0.5 + index * 0.1 }}
src/components/SpaceBackground.tsx +1 −1
@@ -125,7 +125,7 @@ export const SpaceBackground: React.FC<{ children: React.ReactNode }> = ({ child
125125 }, [])
126126
127127 return (
128 <div className="relative min-h-screen overflow-hidden bg-gradient-to-b from-black to-blue-900">
128 <div className="relative min-h-screen overflow-hidden bg-gradient-to-b from-black to-green-900">
129129 <canvas
130130 ref={canvasRef}
131131 className="absolute inset-0 w-full h-full"

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs