|
4 | 4 | flex-direction: column; |
5 | 5 | align-items: center; |
6 | 6 | justify-content: center; |
7 | | - padding: 20px; |
8 | | - background-color: var(--bg-color, #fff); /* Dark/light mode background */ |
| 7 | + padding-top: 6rem; |
| 8 | + background-color: var(--bg-color, #fff); |
9 | 9 | } |
10 | 10 |
|
11 | | -.contact-page a { |
12 | | - color: inherit; /* Inherit color from parent, ensuring links don’t appear blue */ |
13 | | - text-decoration: none !important; /* Remove underlines if needed */ |
14 | | -} |
15 | | - |
16 | | -.contact-page a:hover { |
17 | | - color: #6eb2fb; /* You can change this to any color you like *//* Optional: Add underline on hover */ |
18 | | -} |
| 11 | +.contact-page * { |
| 12 | + text-decoration: none !important; |
| 13 | + } |
19 | 14 |
|
20 | 15 | /* Contact Section Header */ |
21 | 16 | .contact-page h2 { |
22 | 17 | font-size: 1.5rem; |
23 | 18 | margin-bottom: 1rem; |
24 | | - margin-top: 0; |
25 | | - text-align: left; /* Aligns text to the left */ |
| 19 | + margin-top: 10; |
| 20 | + text-align: left; |
26 | 21 | width: 100%; |
27 | 22 | } |
28 | 23 |
|
|
39 | 34 | margin: 5px 0; |
40 | 35 | width: 100%; |
41 | 36 | text-align: center; |
| 37 | + background-color: #333; |
| 38 | + border-radius: 5px; |
42 | 39 | } |
43 | 40 |
|
44 | 41 | /* Email Link Styling */ |
45 | 42 | .contact-page .contact-link { |
46 | 43 | font-size: 18px; |
47 | | - text-decoration: none; /* Remove underline */ |
48 | | - color: #333; |
49 | 44 | font-weight: bold; |
50 | | - display: inline-flex; |
| 45 | + display: inline; |
51 | 46 | align-items: center; |
52 | 47 | gap: 10px; |
53 | 48 | transition: color 0.3s; |
54 | 49 | padding: 8px 15px; |
55 | 50 | } |
56 | 51 |
|
57 | 52 | /* Email link hover color */ |
58 | | -.contact-page .contact-link:hover { |
59 | | - color: #007bff; /* Hover color for email link */ |
| 53 | +.contact-page .contact-item:hover { |
| 54 | + background-color: #007bff; |
60 | 55 | } |
61 | 56 |
|
62 | 57 | /* Resume Button Styling */ |
63 | 58 | .contact-page .resume-btn { |
| 59 | + color: #f0f0f0; |
64 | 60 | display: inline-flex; |
65 | 61 | align-items: center; |
66 | 62 | padding: 10px 20px; |
67 | | - background-color: #f0f0f0; |
68 | 63 | border-radius: 8px; |
69 | | - box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); |
70 | 64 | font-size: 16px; |
71 | 65 | gap: 10px; |
72 | | - text-decoration: none; /* Ensure no underline */ |
73 | 66 | } |
74 | 67 |
|
75 | 68 | /* Resume Button Hover Styling */ |
|
80 | 73 |
|
81 | 74 | /* Social Media Icons (interactive) */ |
82 | 75 | .contact-page .social-links { |
83 | | - display: flex; |
| 76 | + display: inline; |
84 | 77 | justify-content: center; |
85 | | - gap: 15px; |
| 78 | + gap: 3rem; |
86 | 79 | margin-top: 20px; |
87 | 80 | } |
88 | 81 |
|
89 | 82 | .contact-page .social-icon { |
90 | 83 | font-size: 30px; |
91 | 84 | transition: transform 0.3s; |
92 | 85 | color: #333; |
93 | | - text-decoration: none; /* Remove underline */ |
94 | 86 | } |
95 | 87 |
|
96 | 88 | /* Hover effect for social media icons */ |
97 | 89 | .contact-page .social-icon:hover { |
98 | | - transform: scale(1.2); /* Icon enlarges slightly on hover */ |
99 | | - color: #007bff; /* Hover color for social icons */ |
| 90 | + transform: scale(1.2); |
| 91 | + color: #007bff; |
100 | 92 | } |
101 | 93 |
|
102 | 94 | /* Back Button (no hover effect) */ |
103 | 95 | .contact-page .back-button { |
104 | 96 | color: #333; |
105 | 97 | font-size: 18px; |
106 | | - text-decoration: none; /* Remove underline */ |
107 | 98 | } |
108 | 99 |
|
109 | 100 | .contact-page .back-button:hover { |
110 | | - color: #333; /* Ensure no hover effect on back button */ |
| 101 | + color: #333; |
111 | 102 | } |
112 | 103 |
|
113 | 104 | /* Avoid hover effect on all other non-interactive text */ |
114 | | -.contact-page p, |
115 | | -.contact-page h2 { |
116 | | - text-decoration: none; /* Ensure no underline on any text */ |
117 | | -} |
118 | | - |
119 | 105 | @media screen and (max-width: 600px) { |
120 | 106 | .contact-page { |
121 | 107 | padding: 10px; |
|
0 commit comments