Skip to content

Commit 8061825

Browse files
Codeboy20Codeboy20
committed
Done
1 parent 88900ea commit 8061825

File tree

1 file changed

+35
-35
lines changed

1 file changed

+35
-35
lines changed

‎src/pages/contact-us/index.tsx‎

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const ContactUs: React.FC = () => {
1515
<h1 className="text-4xl md:text-5xl font-bold gradient-text mb-6">
1616
Get In Touch
1717
</h1>
18-
<p className="text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
18+
<p className="text-lg max-w-2xl mx-auto" style={{color: 'white'}}>
1919
Have questions, feedback, or want to collaborate? We'd love to hear from you.
2020
Reach out to us and we'll get back to you as soon as possible.
2121
</p>
@@ -25,7 +25,7 @@ const ContactUs: React.FC = () => {
2525
{/* Contact Information */}
2626
<div className="space-y-8">
2727
<div>
28-
<h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-6">
28+
<h2 className="text-2xl font-bold mb-6" style={{color: 'white'}}>
2929
Contact Information
3030
</h2>
3131

@@ -36,14 +36,14 @@ const ContactUs: React.FC = () => {
3636
<Mail className="w-6 h-6 text-blue-600 dark:text-blue-400" />
3737
</div>
3838
<div>
39-
<h3 className="font-semibold text-gray-900 dark:text-white">Email</h3>
39+
<h3 className="font-semibold" style={{color: 'white'}}>Email</h3>
4040
<a
4141
href="mailto:[email protected]"
42-
className="text-blue-600 dark:text-blue-400 hover:underline"
42+
className="text-blue-400 hover:underline"
4343
>
4444
[email protected]
4545
</a>
46-
<p className="text-sm text-gray-600 dark:text-gray-400 mt-1">
46+
<p className="text-sm mt-1" style={{color: 'white'}}>
4747
General inquiries and support
4848
</p>
4949
</div>
@@ -55,11 +55,11 @@ const ContactUs: React.FC = () => {
5555
<Clock className="w-6 h-6 text-green-600 dark:text-green-400" />
5656
</div>
5757
<div>
58-
<h3 className="font-semibold text-gray-900 dark:text-white">Response Time</h3>
59-
<p className="text-gray-600 dark:text-gray-300">
58+
<h3 className="font-semibold" style={{color: 'white'}}>Response Time</h3>
59+
<p style={{color: 'white'}}>
6060
Within 24-48 hours
6161
</p>
62-
<p className="text-sm text-gray-600 dark:text-gray-400 mt-1">
62+
<p className="text-sm mt-1" style={{color: 'white'}}>
6363
We'll get back to you promptly
6464
</p>
6565
</div>
@@ -71,11 +71,11 @@ const ContactUs: React.FC = () => {
7171
<MapPin className="w-6 h-6 text-purple-600 dark:text-purple-400" />
7272
</div>
7373
<div>
74-
<h3 className="font-semibold text-gray-900 dark:text-white">Location</h3>
75-
<p className="text-gray-600 dark:text-gray-300">
74+
<h3 className="font-semibold" style={{color: 'white'}}>Location</h3>
75+
<p style={{color: 'white'}}>
7676
Online & Global
7777
</p>
78-
<p className="text-sm text-gray-600 dark:text-gray-400 mt-1">
78+
<p className="text-sm mt-1" style={{color: 'white'}}>
7979
Serving developers worldwide
8080
</p>
8181
</div>
@@ -84,11 +84,11 @@ const ContactUs: React.FC = () => {
8484
</div>
8585

8686
{/* Additional Information */}
87-
<div className="bg-gradient-to-r from-blue-50 to-purple-50 dark:from-blue-900/20 dark:to-purple-900/20 p-6 rounded-xl">
88-
<h3 className="font-bold text-gray-900 dark:text-white mb-3">
87+
<div className="bg-gradient-to-r from-blue-50 to-purple-50 dark:from-blue-950/50 dark:to-purple-950/50 border border-gray-200 dark:border-gray-700 p-6 rounded-xl">
88+
<h3 className="font-bold mb-3" style={{color: 'white'}}>
8989
What we can help you with:
9090
</h3>
91-
<ul className="space-y-2 text-gray-600 dark:text-gray-300">
91+
<ul className="space-y-2" style={{color: 'white'}}>
9292
<li className="flex items-center space-x-2">
9393
<span className="w-2 h-2 bg-blue-500 rounded-full"></span>
9494
<span>Learning resources and tutorials</span>
@@ -114,66 +114,66 @@ const ContactUs: React.FC = () => {
114114
</div>
115115

116116
{/* Contact Form */}
117-
<div className="bg-white dark:bg-gray-800 rounded-2xl shadow-xl p-8">
118-
<h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-6">
117+
<div className="bg-gray-50 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-2xl shadow-xl p-8">
118+
<h2 className="text-2xl font-bold mb-6" style={{color: 'white'}}>
119119
Send us a message
120120
</h2>
121121

122122
<form className="space-y-6">
123123
<div className="grid md:grid-cols-2 gap-4">
124124
<div>
125-
<label htmlFor="firstName" className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
125+
<label htmlFor="firstName" className="block text-sm font-medium mb-2" style={{color: 'white'}}>
126126
First Name
127127
</label>
128128
<input
129129
type="text"
130130
id="firstName"
131131
name="firstName"
132-
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white"
132+
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 transition-colors"
133133
placeholder="Your first name"
134134
required
135135
/>
136136
</div>
137137
<div>
138-
<label htmlFor="lastName" className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
138+
<label htmlFor="lastName" className="block text-sm font-medium mb-2" style={{color: 'white'}}>
139139
Last Name
140140
</label>
141141
<input
142142
type="text"
143143
id="lastName"
144144
name="lastName"
145-
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white"
145+
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 transition-colors"
146146
placeholder="Your last name"
147147
required
148148
/>
149149
</div>
150150
</div>
151151

152152
<div>
153-
<label htmlFor="email" className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
153+
<label htmlFor="email" className="block text-sm font-medium mb-2" style={{color: 'white'}}>
154154
Email Address
155155
</label>
156156
<input
157157
type="email"
158158
id="email"
159159
name="email"
160-
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white"
160+
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 transition-colors"
161161
placeholder="[email protected]"
162162
required
163163
/>
164164
</div>
165165

166166
<div>
167-
<label htmlFor="subject" className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
167+
<label htmlFor="subject" className="block text-sm font-medium mb-2" style={{color: 'white'}}>
168168
Subject
169169
</label>
170170
<select
171171
id="subject"
172172
name="subject"
173-
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white"
173+
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white transition-colors"
174174
required
175175
>
176-
<option value="">Select a subject</option>
176+
<option value="" className="text-gray-500 dark:text-gray-400">Select a subject</option>
177177
<option value="general">General Inquiry</option>
178178
<option value="support">Technical Support</option>
179179
<option value="collaboration">Collaboration</option>
@@ -184,22 +184,22 @@ const ContactUs: React.FC = () => {
184184
</div>
185185

186186
<div>
187-
<label htmlFor="message" className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
187+
<label htmlFor="message" className="block text-sm font-medium mb-2" style={{color: 'white'}}>
188188
Message
189189
</label>
190190
<textarea
191191
id="message"
192192
name="message"
193193
rows={6}
194-
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white resize-none"
194+
className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 resize-none transition-colors"
195195
placeholder="Tell us more about your inquiry..."
196196
required
197197
></textarea>
198198
</div>
199199

200200
<button
201201
type="submit"
202-
className="w-full bg-gradient-to-r from-blue-600 to-purple-600 text-white font-semibold py-3 px-6 rounded-lg hover:from-blue-700 hover:to-purple-700 transition-all duration-300 transform hover:scale-[1.02] shadow-lg"
202+
className="w-full bg-gradient-to-r from-blue-600 to-purple-600 hover:from-blue-700 hover:to-purple-700 text-white font-semibold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-[1.02] shadow-lg hover:shadow-xl"
203203
>
204204
Send Message
205205
</button>
@@ -209,15 +209,15 @@ const ContactUs: React.FC = () => {
209209

210210
{/* Additional Resources */}
211211
<div className="mt-16 text-center">
212-
<h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-8">
212+
<h2 className="text-2xl font-bold mb-8" style={{color: 'white'}}>
213213
Other Ways to Connect
214214
</h2>
215215
<div className="grid md:grid-cols-3 gap-6">
216216
<a
217217
href="/community"
218-
className="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02]"
218+
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02] group"
219219
>
220-
<div className="text-blue-600 dark:text-blue-400 text-2xl mb-3">📚</div>
220+
<div className="text-blue-600 dark:text-blue-400 text-2xl mb-3 group-hover:scale-110 transition-transform">📚</div>
221221
<h3 className="font-semibold text-gray-900 dark:text-white mb-2">Community</h3>
222222
<p className="text-gray-600 dark:text-gray-400 text-sm">
223223
Join our community and connect with fellow developers
@@ -226,9 +226,9 @@ const ContactUs: React.FC = () => {
226226

227227
<a
228228
href="/docs"
229-
className="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02]"
229+
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02] group"
230230
>
231-
<div className="text-green-600 dark:text-green-400 text-2xl mb-3">📖</div>
231+
<div className="text-green-600 dark:text-green-400 text-2xl mb-3 group-hover:scale-110 transition-transform">📖</div>
232232
<h3 className="font-semibold text-gray-900 dark:text-white mb-2">Documentation</h3>
233233
<p className="text-gray-600 dark:text-gray-400 text-sm">
234234
Explore our comprehensive learning resources
@@ -237,9 +237,9 @@ const ContactUs: React.FC = () => {
237237

238238
<a
239239
href="/blogs"
240-
className="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02]"
240+
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-[1.02] group"
241241
>
242-
<div className="text-purple-600 dark:text-purple-400 text-2xl mb-3">✍️</div>
242+
<div className="text-purple-600 dark:text-purple-400 text-2xl mb-3 group-hover:scale-110 transition-transform">✍️</div>
243243
<h3 className="font-semibold text-gray-900 dark:text-white mb-2">Blog</h3>
244244
<p className="text-gray-600 dark:text-gray-400 text-sm">
245245
Read our latest articles and tutorials

0 commit comments

Comments
 (0)