-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcontact.html
304 lines (284 loc) · 19.4 KB
/
contact.html
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
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Finned-tech</title>
<link rel="stylesheet" href="assets/css/styles.css">
<script src="assets/js/script.js" defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"
integrity="sha512-z4OUqw38qNLpn1libAN9BsoDx6nbNFio5lA6CuTp9NlK83b89hgyCVq+N5FdBJptINztxn1Z3SaKSKUS5UP60Q=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="apple-touch-icon" sizes="57x57" href="assets/img/favicons/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="assets/img/favicons/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/img/favicons/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="assets/img/favicons/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/img/favicons/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="assets/img/favicons/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="assets/img/favicons/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets/img/favicons/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets/img/favicons/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="assets/img/favicons/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="assets/img/favicons/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
<link rel="manifest" href="assets/img/favicons/manifest.json">
<meta name="msapplication-TileColor" content="#242526">
<meta name="msapplication-TileImage" content="assets/img/favicons/ms-icon-144x144.png">
<meta name="theme-color" content="#242526">
</head>
<body class="bg-secondary">
<header>
<div id="nav">
<nav class="bg-primary">
<div class="flex flex-wrap justify-between items-center mx-auto p-4">
<a href="https://finned.tech" class="flex items-center">
<img src="assets/img/logo.png" class="h-16 mr-3" alt="Finned Logo" />
</a>
<div class="flex flex-wrap items-center">
<div class="flex flex-row space-x-3 text-text-primary mr-6">
<a href="https://github.com/finned-tech">
<svg class="w-6 h-6" viewBox="0 0 20 20">
<g id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-140.000000, -7559.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M94,7399 C99.523,7399 104,7403.59 104,7409.253 C104,7413.782 101.138,7417.624 97.167,7418.981 C96.66,7419.082 96.48,7418.762 96.48,7418.489 C96.48,7418.151 96.492,7417.047 96.492,7415.675 C96.492,7414.719 96.172,7414.095 95.813,7413.777 C98.04,7413.523 100.38,7412.656 100.38,7408.718 C100.38,7407.598 99.992,7406.684 99.35,7405.966 C99.454,7405.707 99.797,7404.664 99.252,7403.252 C99.252,7403.252 98.414,7402.977 96.505,7404.303 C95.706,7404.076 94.85,7403.962 94,7403.958 C93.15,7403.962 92.295,7404.076 91.497,7404.303 C89.586,7402.977 88.746,7403.252 88.746,7403.252 C88.203,7404.664 88.546,7405.707 88.649,7405.966 C88.01,7406.684 87.619,7407.598 87.619,7408.718 C87.619,7412.646 89.954,7413.526 92.175,7413.785 C91.889,7414.041 91.63,7414.493 91.54,7415.156 C90.97,7415.418 89.522,7415.871 88.63,7414.304 C88.63,7414.304 88.101,7413.319 87.097,7413.247 C87.097,7413.247 86.122,7413.234 87.029,7413.87 C87.029,7413.87 87.684,7414.185 88.139,7415.37 C88.139,7415.37 88.726,7417.2 91.508,7416.58 C91.513,7417.437 91.522,7418.245 91.522,7418.489 C91.522,7418.76 91.338,7419.077 90.839,7418.982 C86.865,7417.627 84,7413.783 84,7409.253 C84,7403.59 88.478,7399 94,7399"
id="github-[#142]">
</path>
</g>
</g>
</g>
</svg>
</a>
<a href="https://www.linkedin.com/company/82318968">
<svg class="w-6 h-6" viewBox="0 0 20 20">
<g id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-180.000000, -7479.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M144,7339 L140,7339 L140,7332.001 C140,7330.081 139.153,7329.01 137.634,7329.01 C135.981,7329.01 135,7330.126 135,7332.001 L135,7339 L131,7339 L131,7326 L135,7326 L135,7327.462 C135,7327.462 136.255,7325.26 139.083,7325.26 C141.912,7325.26 144,7326.986 144,7330.558 L144,7339 L144,7339 Z M126.442,7323.921 C125.093,7323.921 124,7322.819 124,7321.46 C124,7320.102 125.093,7319 126.442,7319 C127.79,7319 128.883,7320.102 128.883,7321.46 C128.884,7322.819 127.79,7323.921 126.442,7323.921 L126.442,7323.921 Z M124,7339 L129,7339 L129,7326 L124,7326 L124,7339 Z"
id="linkedin-[#161]">
</path>
</g>
</g>
</g>
</svg>
</a>
<a href="https://discord.gg/HeqqWewjea">
<svg class="w-6 h-6" viewBox="0 0 24 24" fill="currentColor">
<path xmlns="http://www.w3.org/2000/svg"
d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z" />
</svg>
</a>
<a href="mailto:hello@finned.tech">
<svg class="w-6 h-6" viewBox="0 -2.5 20 20">
<g xmlns="http://www.w3.org/2000/svg" id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-340.000000, -922.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M294,774.474 L284,765.649 L284,777 L304,777 L304,765.649 L294,774.474 Z M294.001,771.812 L284,762.981 L284,762 L304,762 L304,762.981 L294.001,771.812 Z"
id="email-[#1572]">
</path>
</g>
</g>
</g>
</svg>
</a>
</div>
<a href="/login" class="bg-blue-600 font-bold text-text-primary px-4 py-2 rounded-md">Login</a>
</div>
</div>
</nav>
<!-- lighten the color -->
<nav class="bg-primary" style="filter: brightness(115%);">
<div class="px-4 py-3 w-full">
<div class="flex items-center justify-center md:justify-end w-full">
<ul class="flex flex-row items-center justify-center flex-wrap font-medium mt-0 md:mr-6 text-md">
<li class="flex flex-1 justify-center mb-2 md:mb-0 mr-6">
<a href="/#apps" class="text-text-secondary hover:underline">Applications</a>
</li>
<li class="flex flex-1 justify-center mb-2 md:mb-0 mr-6">
<a href="/#features" class="text-text-secondary hover:underline">Features</a>
</li>
<li class="flex flex-1 justify-center mb-2 md:mb-0 mr-6">
<a href="/#next" class="text-text-secondary hover:underline">Start</a>
</li>
<li class="flex flex-1 justify-center mb-2 md:mb-0">
<a href="/contact" class="text-text-secondary hover:underline">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div class="min-h-screen w-full"
style="background: url(assets/img/city-1.jpg); background-size: cover; background-position: center;">
<div class="hero-header">
<div class="h-full mx-6 flex flex-col justify-center">
<h1 class="text-4xl font-bold text-text-primary">
Contact Us
</h1>
<h2 class="text-2xl font-medium text-text-secondary mt-3">
We're here to help you with any questions you may have.
</h2>
</div>
</div>
<form class="m-12 mt-[-3rem] bg-tertiary rounded-lg p-6 shadow-lg">
<!-- First and Last Name inputs, side by side. -->
<div class="flex flex-row justify-between">
<div class="flex flex-col w-1/2 mr-2">
<label for="first-name" class="text-text-secondary font-medium">First Name <span class="text-blue-700">*</span></label>
<input required type="text" id="first-name" name="first-name"
class="bg-white border border-gray-300 rounded-md p-2 mt-1 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:border-transparent"
placeholder="Tony" />
</div>
<div class="flex flex-col w-1/2 ml-2">
<label for="last-name" class="text-text-secondary font-medium">Last Name <span class="text-blue-700">*</span></label>
<input required type="text" id="last-name" name="last-name"
class="bg-white border border-gray-300 rounded-md p-2 mt-1 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:border-transparent"
placeholder="Stark" />
</div>
</div>
<!-- Email input -->
<div class="flex flex-col mt-4">
<label for="email" class="text-text-secondary font-medium">Email <span class="text-blue-700">*</span></label>
<input required type="email" id="email" name="email"
class="bg-white border border-gray-300 rounded-md p-2 mt-1 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:border-transparent"
placeholder="tony@starkindustries.com" />
</div>
<!-- Message input -->
<div class="flex flex-col mt-4">
<label for="message" class="text-text-secondary font-medium">How can we help? <span class="text-blue-700">*</span></label>
<textarea required id="message" name="message" rows="4"
class="bg-white border border-gray-300 rounded-md p-2 mt-1 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:border-transparent"
placeholder="I have a question about Finned..."></textarea>
</div>
<!-- Submit button -->
<div class="flex flex-col mt-4">
<button type="submit"
class="bg-blue-600 font-bold text-text-primary px-4 py-2 rounded-md hover:bg-blue-700">Submit</button>
</div>
</form>
<br>
</div>
</header>
<main>
</main>
<footer class="bg-primary">
<div class="mx-auto w-full p-4 py-6 lg:py-8">
<div class="md:flex md:justify-between">
<div class="my-6">
<a href="https://finned.tech/" class="flex items-center">
<img src="assets/img/logo.png" class="h-36 mr-3" alt="Finned Logo" />
</a>
</div>
<div class="grid grid-cols-2 gap-8 sm:gap-6 sm:grid-cols-3">
<div>
<h2 class="mb-6 text-lg font-semibold text-text-primary uppercase">Site</h2>
<ul class="text-text-secondary font-medium">
<li class="mb-4">
<a href="/" class="hover:underline">Home</a>
</li>
<li class="mb-4">
<a href="/#apps" class="hover:underline">Applications</a>
</li>
<li class="mb-4">
<a href="/#features" class="hover:underline">Features</a>
</li>
<li>
<a href="/#next" class="hover:underline">Get Started</a>
</li>
</ul>
</div>
<div>
<h2 class="mb-6 text-lg font-semibold text-text-primary uppercase">Follow us</h2>
<ul class="text-text-secondary font-medium">
<li class="mb-4">
<a href="https://github.com/finned-tech" class="hover:underline ">GitHub</a>
</li>
<li class="mb-4">
<a href="https://discord.gg/HeqqWewjea" class="hover:underline">Discord</a>
</li>
<li class="mb-4">
<a href="https://www.linkedin.com/company/82318968" class="hover:underline">LinkedIn</a>
</li>
<li>
<a href="mailto:hello@finned.tech" class="hover:underline">Mail</a>
</li>
</ul>
</div>
<div>
<h2 class="mb-6 text-lg font-semibold text-text-primary uppercase">Legal</h2>
<ul class="text-text-secondary font-medium">
<li class="mb-4">
<a href="/privacy-policy" class="hover:underline">Privacy Policy</a>
</li>
<li>
<a href="/terms-and-conditions" class="hover:underline">Terms & Conditions</a>
</li>
</ul>
</div>
</div>
</div>
<hr class="block h-1 my-6 border-none w-full lg:my-8"
style="background-image: linear-gradient(to left bottom, #FF6A00, rgb(29 78 216 / var(--tw-bg-opacity)) 75%);" />
<div class="sm:flex sm:items-center sm:justify-between">
<span class="text-sm text-gray-500 sm:text-center dark:text-gray-400">© 2022-2023 <a href="https://finned.tech/"
class="hover:underline">Finned-tech</a>. All Rights Reserved.
</span>
<div class="flex mt-4 space-x-6 sm:justify-center sm:mt-0 text-text-secondary">
<a href="https://github.com/finned-tech">
<svg class="w-4 h-4" viewBox="0 0 20 20">
<g id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-140.000000, -7559.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M94,7399 C99.523,7399 104,7403.59 104,7409.253 C104,7413.782 101.138,7417.624 97.167,7418.981 C96.66,7419.082 96.48,7418.762 96.48,7418.489 C96.48,7418.151 96.492,7417.047 96.492,7415.675 C96.492,7414.719 96.172,7414.095 95.813,7413.777 C98.04,7413.523 100.38,7412.656 100.38,7408.718 C100.38,7407.598 99.992,7406.684 99.35,7405.966 C99.454,7405.707 99.797,7404.664 99.252,7403.252 C99.252,7403.252 98.414,7402.977 96.505,7404.303 C95.706,7404.076 94.85,7403.962 94,7403.958 C93.15,7403.962 92.295,7404.076 91.497,7404.303 C89.586,7402.977 88.746,7403.252 88.746,7403.252 C88.203,7404.664 88.546,7405.707 88.649,7405.966 C88.01,7406.684 87.619,7407.598 87.619,7408.718 C87.619,7412.646 89.954,7413.526 92.175,7413.785 C91.889,7414.041 91.63,7414.493 91.54,7415.156 C90.97,7415.418 89.522,7415.871 88.63,7414.304 C88.63,7414.304 88.101,7413.319 87.097,7413.247 C87.097,7413.247 86.122,7413.234 87.029,7413.87 C87.029,7413.87 87.684,7414.185 88.139,7415.37 C88.139,7415.37 88.726,7417.2 91.508,7416.58 C91.513,7417.437 91.522,7418.245 91.522,7418.489 C91.522,7418.76 91.338,7419.077 90.839,7418.982 C86.865,7417.627 84,7413.783 84,7409.253 C84,7403.59 88.478,7399 94,7399"
id="github-[#142]">
</path>
</g>
</g>
</g>
</svg>
</a>
<a href="https://www.linkedin.com/company/82318968">
<svg class="w-4 h-4" viewBox="0 0 20 20">
<g id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-180.000000, -7479.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M144,7339 L140,7339 L140,7332.001 C140,7330.081 139.153,7329.01 137.634,7329.01 C135.981,7329.01 135,7330.126 135,7332.001 L135,7339 L131,7339 L131,7326 L135,7326 L135,7327.462 C135,7327.462 136.255,7325.26 139.083,7325.26 C141.912,7325.26 144,7326.986 144,7330.558 L144,7339 L144,7339 Z M126.442,7323.921 C125.093,7323.921 124,7322.819 124,7321.46 C124,7320.102 125.093,7319 126.442,7319 C127.79,7319 128.883,7320.102 128.883,7321.46 C128.884,7322.819 127.79,7323.921 126.442,7323.921 L126.442,7323.921 Z M124,7339 L129,7339 L129,7326 L124,7326 L124,7339 Z"
id="linkedin-[#161]">
</path>
</g>
</g>
</g>
</svg>
</a>
<a href="https://discord.gg/HeqqWewjea">
<svg class="w-4 h-4" viewBox="0 0 24 24" fill="currentColor">
<path xmlns="http://www.w3.org/2000/svg"
d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z" />
</svg>
</a>
<a href="mailto:hello@finned.tech">
<svg class="w-4 h-4" viewBox="0 -2.5 20 20">
<g xmlns="http://www.w3.org/2000/svg" id="Page-1" stroke="none" stroke-width="1">
<g id="Dribbble-Light-Preview" transform="translate(-340.000000, -922.000000)" fill="currentColor">
<g id="icons" transform="translate(56.000000, 160.000000)">
<path
d="M294,774.474 L284,765.649 L284,777 L304,777 L304,765.649 L294,774.474 Z M294.001,771.812 L284,762.981 L284,762 L304,762 L304,762.981 L294.001,771.812 Z"
id="email-[#1572]">
</path>
</g>
</g>
</g>
</svg>
</a>
</div>
</div>
</div>
</footer>
</body>
</html>