Skip to content

Commit 7d09cb9

Browse files
BhartiNagpureBhartiNagpure
committed
footer visibility resolve
1 parent cae2ca1 commit 7d09cb9

File tree

1 file changed

+35
-34
lines changed

1 file changed

+35
-34
lines changed

‎src/components/Footer.jsx‎

Lines changed: 35 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -15,43 +15,43 @@ const Footer = () => {
1515
let year = new Date().getFullYear();
1616

1717
return (
18-
<footer className="bg-black bottom-0 mb-6 pt-32 font-primary">
19-
<div className="flex flex-col gap-8 justify-between content-center md:flex-row">
18+
<footer className="bg-black bottom-0 mb-6 pt-32 font-primary justify-center">
19+
<div className=" flex-col gap-8 justify-between content-center md:flex-row">
2020
{/* Logo */}
21-
<div className="grid-auto">
22-
<div className="flex flex-col justify-center">
21+
<div className="grid-auto ">
22+
<div className=" flex-col justify-center">
2323
<Image
2424
src={logo}
2525
alt="DevsInTech"
2626
width={140}
2727
height={140}
2828
className="mx-auto"
2929
/>
30-
<p className="font-medium text-center justify-items-center">
30+
<p className="text-green-500 font-medium text-center justify-items-center font-mono">
3131
DevsInTech
3232
</p>
3333
</div>
3434
</div>
3535

3636
{/* About Us */}
3737

38-
<div className="flex flex-col content-center">
39-
<p className="text-center text-white text-md sm:text-lg md:text-xl md:text-left">
40-
<a href="https://devsintech.netlify.app/">DevsInTech</a> is a
38+
<div className="flex flex-col justif-center">
39+
<p className="text-center text-white text-md sm:text-lg md:text-m md:text-center">
40+
<a href="https://devsintech.netlify.app/" className="text-green-500 font-mono">DevsInTech</a> is a
4141
thriving and welcoming community of developers, tech
4242
professionals,and enthusiasts who share a common passion for
4343
technology. We are an Open-source project available on{" "}
44-
<a href="https://github.com/devs-in-tech/DevsInTech">GitHub</a>
44+
<a href="https://github.com/devs-in-tech/DevsInTech" className="text-blue-500">GitHub</a>
4545
</p>
46-
<ul className="mt-6 flex justify-center gap-6 md:justify-start md:gap-8">
46+
<ul className="mt-6 flex justify-center text-center gap-6 md:justify-end md:gap-8">
4747
<li>
4848
<Link
4949
href="/"
5050
rel="noreferrer"
5151
target="_blank"
52-
className="text-black transition hover:text-gray-700/75 dark:text-white dark:hover:text-gray-100/90"
52+
className="text-blue-500 transition hover:text-blue-700/75 dark:text-white dark:hover:text-gray-100/90"
5353
>
54-
<FaFacebookF size={20} />
54+
<FaFacebookF size={30} />
5555
</Link>
5656
</li>
5757

@@ -62,9 +62,9 @@ const Footer = () => {
6262
title="Twitter (External Link)"
6363
rel="noopener noreferrer"
6464
target="_blank"
65-
className="text-black transition hover:text-gray-700/75 dark:text-white dark:hover:text-gray-100/90"
65+
className="text-sky-500 transition hover:text-sky-700/75 dark:text-white dark:hover:text-gray-100/90"
6666
>
67-
<FaTwitter size={20} />
67+
<FaTwitter size={30} />
6868
</Link>
6969
</li>
7070

@@ -77,9 +77,9 @@ const Footer = () => {
7777
aria-label="Visit us on Linkedin"
7878
title="Linkedin (External Link)"
7979
rel="noopener noreferrer"
80-
className="text-black transition hover:text-gray-700/75 dark:text-white dark:hover:text-gray-100/90"
80+
className="text-blue-800 transition hover:text-blue-900/75 dark:text-white dark:hover:text-gray-100/90"
8181
>
82-
<FaLinkedinIn size={20} />
82+
<FaLinkedinIn size={30} />
8383
</Link>
8484
</li>
8585

@@ -92,9 +92,9 @@ const Footer = () => {
9292
title="Instagram (External Link)"
9393
rel="noopener noreferrer"
9494
target="_blank"
95-
className="text-black transition hover:text-gray-700/75 dark:text-white dark:hover:text-gray-100/90"
95+
className="text-red-500 transition hover:text-red-700/75 dark:text-white dark:hover:text-gray-100/90"
9696
>
97-
<FaInstagram size={20} />
97+
<FaInstagram size={30} />
9898
</Link>
9999
</li>
100100

@@ -107,25 +107,25 @@ const Footer = () => {
107107
title="Discord (External Link)"
108108
rel="noopener noreferrer"
109109
target="_blank"
110-
className="text-black transition hover:text-gray-700/75 dark:text-white dark:hover:text-gray-100/90"
110+
className="text-blue-500 transition hover:text-blue-700/75 dark:text-white dark:hover:text-gray-100/90"
111111
>
112-
<FaDiscord size={20} />
112+
<FaDiscord size={30} />
113113
</Link>
114114
</li>
115115
</ul>
116116
</div>
117117

118118
{/* COLUMNS */}
119119
<div className="m-auto">
120-
<div className="flex justify-between gap-16">
120+
<div className="flex justify-center gap-16">
121121
<div className="text-center font-secondary">
122122
<p className="text-lg font-medium text-white">Community</p>
123123

124-
<nav aria-label="Footer About Nav" className="mt-4 text-center">
124+
<nav aria-label="Footer About Nav" className="mt-4 text-center ">
125125
<ul className="space-y-4 font-black text-base">
126126
<li>
127127
<Link
128-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
128+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
129129
href="/"
130130
>
131131
Collaborate
@@ -134,7 +134,7 @@ const Footer = () => {
134134

135135
<li>
136136
<Link
137-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
137+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
138138
href="/"
139139
>
140140
Communicate
@@ -143,7 +143,7 @@ const Footer = () => {
143143

144144
<li>
145145
<Link
146-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
146+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
147147
href="/"
148148
>
149149
Courses
@@ -152,7 +152,7 @@ const Footer = () => {
152152

153153
<li>
154154
<Link
155-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
155+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
156156
href="/"
157157
>
158158
Webinars
@@ -161,7 +161,7 @@ const Footer = () => {
161161

162162
<li>
163163
<Link
164-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
164+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
165165
href="/"
166166
>
167167
Meetups
@@ -180,7 +180,7 @@ const Footer = () => {
180180
<ul className="space-y-4 font-black text-base">
181181
<li>
182182
<Link
183-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
183+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
184184
href="/"
185185
>
186186
Collaborate
@@ -189,7 +189,7 @@ const Footer = () => {
189189

190190
<li>
191191
<Link
192-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
192+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
193193
href="/"
194194
>
195195
Events
@@ -198,7 +198,7 @@ const Footer = () => {
198198

199199
<li>
200200
<Link
201-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
201+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
202202
href="/"
203203
>
204204
Courses
@@ -207,7 +207,7 @@ const Footer = () => {
207207

208208
<li>
209209
<Link
210-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
210+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
211211
href="/"
212212
>
213213
Webinars
@@ -216,7 +216,7 @@ const Footer = () => {
216216

217217
<li>
218218
<Link
219-
className="text-gray-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
219+
className="text-purple-900 transition hover:text-gray-900/75 dark:text-white dark:hover:text-white/75"
220220
href="/"
221221
>
222222
Meetups
@@ -230,8 +230,9 @@ const Footer = () => {
230230
</div>
231231
<div className="mt-12 mb-0">
232232
<div className="text-center font-thin sm:flex sm:justify-center sm:text-center">
233-
<p className="mt-4 text-xl text-black dark:text-white sm:order-first sm:mt-0">
234-
&copy; {year} by DevsInTech Community
233+
<p className="mt-4 text-xl text-white dark:text-white sm:order-first sm:mt-0">
234+
&copy; {year} by DevsInTech Community <span className="text-red-600">&hearts;</span>
235+
235236
</p>
236237
</div>
237238
</div>

0 commit comments

Comments
 (0)