@@ -2,6 +2,20 @@ import { Mail, Github, Linkedin } from "lucide-react";
2
2
import { Button } from "@/components/ui/button" ;
3
3
4
4
export const Contact = ( ) => {
5
+ const handleEmailClick = ( ) => {
6
+ console . log ( "Email button clicked!" ) ;
7
+ window . location . href = "mailto:[email protected] " ;
8
+ } ;
9
+
10
+ const handleResumeClick = ( ) => {
11
+ console . log ( "Resume button clicked!" ) ;
12
+ window . open ( "/resume.pdf" , "_blank" ) ;
13
+ } ;
14
+
15
+ const handleSocialClick = ( platform : string ) => {
16
+ console . log ( `${ platform } button clicked!` ) ;
17
+ } ;
18
+
5
19
return (
6
20
< section id = "contact" className = "py-20 px-4 sm:px-6 lg:px-8" >
7
21
< div className = "max-w-4xl mx-auto" >
@@ -12,7 +26,7 @@ export const Contact = () => {
12
26
< div className = "w-20 h-1 bg-gradient-to-r from-purple-500 to-pink-500 mx-auto" > </ div >
13
27
</ div >
14
28
15
- < div className = "glass rounded-2xl p-8 md:p-12 text-center glow-border " >
29
+ < div className = "glass rounded-2xl p-8 md:p-12 text-center relative " >
16
30
< div className = "mb-8" >
17
31
< h3 className = "text-2xl font-semibold mb-4" > Ready to Start a Project?</ h3 >
18
32
< p className = "text-lg text-muted-foreground max-w-2xl mx-auto leading-relaxed" >
@@ -21,47 +35,48 @@ export const Contact = () => {
21
35
</ p >
22
36
</ div >
23
37
24
- < div className = "flex flex-col sm:flex-row gap-4 justify-center mb-8" >
38
+ < div className = "flex flex-col sm:flex-row gap-4 justify-center mb-8 relative z-10 " >
25
39
< Button
26
40
size = "lg"
27
- className = "bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white border-0"
41
+ className = "bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white border-0 cursor-pointer relative z-10"
42
+ onClick = { handleResumeClick }
28
43
>
29
- < a href = "mailto:[email protected] " className = "flex items-center gap-2" >
30
- < Mail className = "w-5 h-5" />
31
- Send Email
32
- </ a >
44
+
45
+ Download Resume
33
46
</ Button >
34
- < Button
47
+ { /* <Button
35
48
variant="outline"
36
49
size="lg"
37
- className = "border-purple-500/50 hover:bg-purple-500/10"
50
+ className="border-purple-500/50 hover:bg-purple-500/10 cursor-pointer relative z-10"
51
+ onClick={handleResumeClick}
38
52
>
39
- < a href = "/resume.pdf" target = "_blank" className = "flex items-center gap-2" >
40
- Download Resume
41
- </ a >
42
- </ Button >
53
+ Download Resume
54
+ </Button> */ }
43
55
</ div >
44
56
45
- < div className = "flex justify-center gap-6" >
57
+ < div className = "flex justify-center gap-6 relative z-10 " >
46
58
< a
47
59
href = "https://github.com/arjun-computer-geek"
48
60
target = "_blank"
49
61
rel = "noopener noreferrer"
50
- className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200"
62
+ className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200 cursor-pointer relative z-10"
63
+ onClick = { ( ) => handleSocialClick ( "GitHub" ) }
51
64
>
52
65
< Github className = "w-6 h-6" />
53
66
</ a >
54
67
< a
55
68
href = "https://linkedin.com/in/arjun-computer-geek"
56
69
target = "_blank"
57
70
rel = "noopener noreferrer"
58
- className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200"
71
+ className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200 cursor-pointer relative z-10"
72
+ onClick = { ( ) => handleSocialClick ( "LinkedIn" ) }
59
73
>
60
74
< Linkedin className = "w-6 h-6" />
61
75
</ a >
62
76
< a
63
77
64
- className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200"
78
+ className = "p-3 rounded-full bg-purple-500/20 text-purple-400 hover:bg-purple-500/30 hover:scale-110 transition-all duration-200 cursor-pointer relative z-10"
79
+ onClick = { ( ) => handleSocialClick ( "Email" ) }
65
80
>
66
81
< Mail className = "w-6 h-6" />
67
82
</ a >
0 commit comments