-
Notifications
You must be signed in to change notification settings - Fork 0
/
Footer.jsx
192 lines (191 loc) · 8.4 KB
/
Footer.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
const Footer = () => {
return (
<footer className="py-6 dark:bg-gray-100 dark:text-gray-900">
<div className="container px-6 mx-auto space-y-6 divide-y dark:divide-gray-600 md:space-y-12 divide-opacity-50">
<div className="grid grid-cols-12">
<div className="pb-6 col-span-full md:pb-0 md:col-span-6">
<a
rel="noopener noreferrer"
href="#"
className="flex justify-center space-x-3 md:justify-start"
>
<div className="flex items-center justify-center w-12 h-12 rounded-full dark:bg-violet-600">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 32 32"
fill="currentColor"
className="flex-shrink-0 w-5 h-5 rounded-full dark:text-gray-50"
>
<path d="M18.266 26.068l7.839-7.854 4.469 4.479c1.859 1.859 1.859 4.875 0 6.734l-1.104 1.104c-1.859 1.865-4.875 1.865-6.734 0zM30.563 2.531l-1.109-1.104c-1.859-1.859-4.875-1.859-6.734 0l-6.719 6.734-6.734-6.734c-1.859-1.859-4.875-1.859-6.734 0l-1.104 1.104c-1.859 1.859-1.859 4.875 0 6.734l6.734 6.734-6.734 6.734c-1.859 1.859-1.859 4.875 0 6.734l1.104 1.104c1.859 1.859 4.875 1.859 6.734 0l21.307-21.307c1.859-1.859 1.859-4.875 0-6.734z"></path>
</svg>
</div>
<span className="self-center text-2xl font-semibold">
Brand name
</span>
</a>
</div>
<div className="col-span-6 text-center md:text-left md:col-span-3">
<p className="pb-1 text-lg font-medium">Category</p>
<ul>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
</ul>
</div>
<div className="col-span-6 text-center md:text-left md:col-span-3">
<p className="pb-1 text-lg font-medium">Category</p>
<ul>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
<li>
<a
rel="noopener noreferrer"
href="#"
className="hover:dark:text-violet-600"
>
Link
</a>
</li>
</ul>
</div>
</div>
<div className="grid justify-center pt-6 lg:justify-between">
<div className="flex flex-col self-center text-sm text-center md:block lg:col-start-1 md:space-x-6">
<span>©2024 All rights reserved</span>
<a rel="noopener noreferrer" href="#">
<span>Privacy policy</span>
</a>
<a rel="noopener noreferrer" href="#">
<span>Terms of service</span>
</a>
</div>
<div className="flex justify-center pt-4 space-x-4 lg:pt-0 lg:col-end-13">
<a
rel="noopener noreferrer"
href="#"
title="Email"
className="flex items-center justify-center w-10 h-10 rounded-full dark:bg-violet-600 dark:text-gray-50"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
className="w-5 h-5"
>
<path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"></path>
<path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"></path>
</svg>
</a>
<a
rel="noopener noreferrer"
href="#"
title="Twitter"
className="flex items-center justify-center w-10 h-10 rounded-full dark:bg-violet-600 dark:text-gray-50"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 50 50"
fill="currentColor"
className="w-5 h-5"
>
<path d="M 50.0625 10.4375 C 48.214844 11.257813 46.234375 11.808594 44.152344 12.058594 C 46.277344 10.785156 47.910156 8.769531 48.675781 6.371094 C 46.691406 7.546875 44.484375 8.402344 42.144531 8.863281 C 40.269531 6.863281 37.597656 5.617188 34.640625 5.617188 C 28.960938 5.617188 24.355469 10.21875 24.355469 15.898438 C 24.355469 16.703125 24.449219 17.488281 24.625 18.242188 C 16.078125 17.8125 8.503906 13.71875 3.429688 7.496094 C 2.542969 9.019531 2.039063 10.785156 2.039063 12.667969 C 2.039063 16.234375 3.851563 19.382813 6.613281 21.230469 C 4.925781 21.175781 3.339844 20.710938 1.953125 19.941406 C 1.953125 19.984375 1.953125 20.027344 1.953125 20.070313 C 1.953125 25.054688 5.5 29.207031 10.199219 30.15625 C 9.339844 30.390625 8.429688 30.515625 7.492188 30.515625 C 6.828125 30.515625 6.183594 30.453125 5.554688 30.328125 C 6.867188 34.410156 10.664063 37.390625 15.160156 37.472656 C 11.644531 40.230469 7.210938 41.871094 2.390625 41.871094 C 1.558594 41.871094 0.742188 41.824219 -0.0585938 41.726563 C 4.488281 44.648438 9.894531 46.347656 15.703125 46.347656 C 34.617188 46.347656 44.960938 30.679688 44.960938 17.09375 C 44.960938 16.648438 44.949219 16.199219 44.933594 15.761719 C 46.941406 14.3125 48.683594 12.5 50.0625 10.4375 Z"></path>
</svg>
</a>
<a
rel="noopener noreferrer"
href="#"
title="GitHub"
className="flex items-center justify-center w-10 h-10 rounded-full dark:bg-violet-600 dark:text-gray-50"
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
viewBox="0 0 24 24"
className="w-5 h-5"
>
<path d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6C7,7.2,7,6.6,7.3,6 c0,0,1.4,0,2.8,1.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3C15.3,6,16.8,6,16.8,6C17,6.6,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4 c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3 C22,6.1,16.9,1.4,10.9,2.1z"></path>
</svg>
</a>
</div>
</div>
</div>
</footer>
);
};
export default Footer;