-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
359 lines (330 loc) · 20.4 KB
/
Copy pathindex.html
File metadata and controls
359 lines (330 loc) · 20.4 KB
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
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Feats</title>
<meta name="description" content="Keep track of your bicycle rides and planned routes" />
<link
rel="shortcut icon"
href="./assets/logo.png"
type="image/x-icon"
/>
<!-- Open Graph / Facebook -->
<meta property="og:title" content="Feats" />
<meta property="og:description" content="Keep track of your bicycle rides and planned routes" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://github.com/robvans66/feats" />
<!--Replace with the current website url-->
<meta property="og:image" content="" />
<link rel="stylesheet" href="css/tailwind-runtime.css">
<!-- <link rel="stylesheet" href="./css/tailwind-build.css" /> -->
<link rel="stylesheet" href="css/index.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.11.3/font/bootstrap-icons.min.css"
integrity="sha512-dPXYcDub/aeb08c63jRq/k6GaKccl256JQy/AnOq7CAnEZ9FzSL9wSbcZkMp4R26vBsMLFYH4kQ67/bbV8XaCQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
</head>
<body class="tw-flex tw-min-h-[100vh] tw-flex-col tw-bg-[#fff]">
<header
class="tw-absolute tw-top-0 tw-z-20 tw-flex tw-h-[60px] tw-w-full tw-bg-opacity-0 tw-px-[5%] max-lg:tw-mr-auto max-lg:tw-px-4 lg:tw-justify-around"
>
<a class="tw-h-[50px] tw-w-[50px] tw-p-[4px]" href="">
<img
src="./assets/logo.png"
alt="logo"
class="tw-object tw-h-full tw-w-full"
/>
</a>
<div
class="collapsible-header animated-collapse max-lg:tw-shadow-md"
id="collapsed-header-items"
>
<div
class="tw-flex tw-h-full tw-w-max tw-gap-5 tw-text-base tw-text-black max-lg:tw-mt-[30px] max-lg:tw-flex-col max-lg:tw-place-items-end max-lg:tw-gap-5 lg:tw-mx-auto lg:tw-place-items-center"
>
<a class="header-links" href="#what-is-feats"> What is Feats? </a>
<a class="header-links" href="#download"> Download </a>
<a class="header-links" href="#features"> Features </a>
<a class="header-links" href="#screenshots"> Screenshots </a>
<a class="header-links" href="#more"> More </a>
</div>
<div
class="tw-mx-4 tw-flex tw-place-items-center tw-gap-[20px] tw-text-base max-md:tw-w-full max-md:tw-flex-col max-md:tw-place-content-center"
>
</div>
</div>
<button
class="bi bi-list tw-absolute tw-right-3 tw-top-3 tw-z-50 tw-text-3xl tw-text-black lg:tw-hidden"
onclick="toggleHeader()"
aria-label="menu"
id="collapse-btn"
></button>
</header>
<section
class="tw-relative tw-flex tw-min-h-[100vh] tw-w-full tw-max-w-[100vw] tw-flex-col tw-overflow-hidden max-lg:tw-p-4 max-md:tw-mt-[50px]"
>
<div
class="tw-flex tw-h-full tw-min-h-[100vh] tw-w-full tw-place-content-center tw-gap-6 tw-p-[5%] max-xl:tw-place-items-center max-lg:tw-flex-col"
>
<div class="tw-flex tw-flex-col tw-place-content-center">
<div
class="tw-text-6xl tw-font-semibold tw-lowercase tw-leading-[80px] max-lg:tw-text-4xl max-md:tw-leading-snug"
>
<span class="tw-text-primary"> Feats </span>
</div>
<div
class="tw-mt-10 tw-max-w-[450px] tw-p-2 tw-text-justify max-lg:tw-max-w-full"
>
Keep track of your completed bicycle rides and your planned routes and get insights on your riding habits and performance. Feats is a simple and intuitive desktop app that helps you stay motivated and achieve your cycling goals.
<br />
<br />
<span id="download"></span>Get started right away and download Feats for Apple, Windows or Linux, or scroll down to learn more about the app.</span>
<br />
<br />
<i class="bi bi-pc-display-horizontal"></i> Desktop only. See the <a class="wikilink" target="_blank" href="https://github.com/robvans66/feats/wiki#installation">wiki</a> for more information about installing or upgrading the app.
</div>
<div
class="tw-mt-4 tw-flex tw-place-items-center tw-gap-4 tw-overflow-hidden tw-p-2"
>
<a
class="btn tw-transition-transform tw-py-2 tw-duration-[0.3s] hover:tw-scale-x-[1.03] tw-gap-2"
href="https://github.com/robvans66/feats/releases/download/v1.3.0/Feats-1.3.0-arm64.dmg"
>
<span>Download</span>
<i class="bi bi-apple"></i>
</a>
<a
class="btn tw-transition-transform tw-py-2 tw-duration-[0.3s] hover:tw-scale-x-[1.03] tw-gap-2"
href="https://github.com/robvans66/feats/releases/download/v1.3.0/Feats.Setup.1.3.0.exe"
>
<span>Download</span>
<i class="bi bi-windows"></i>
</a>
<a class="btn tw-transition-transform tw-py-2 tw-duration-[0.3s] hover:tw-scale-x-[1.03] tw-gap-2"
href="https://github.com/robvans66/feats/releases/download/v1.3.0/Feats-1.3.0.AppImage">
<span>Download</span>
<i class="bi bi-ubuntu"></i>
</a>
</div>
<div class="tw-mt-4 tw-flex tw-place-items-center tw-gap-4 tw-overflow-hidden tw-p-2">
<span><i class="bi bi-star-fill tw-text-primary"></i> Latest version: v1.3.0 <br /><i class="bi bi-apple tw-text-primary"></i> Ready-to-install macOS disk image for Apple Silicon (signed & verified by Apple).<br />
<i class="bi bi-windows tw-text-primary"></i> Windows installer (unsigned)
<br />
<i class="bi bi-ubuntu tw-text-primary"></i>
Ready-to-run Linux app.
</span>
</div>
</div>
<div
class="tw-flex tw-w-full tw-max-w-[50%] tw-place-content-center tw-place-items-center tw-overflow-hidden max-lg:tw-max-w-[unset]"
>
<div
class="tw-flex tw-max-h-[580px] tw-min-h-[450px] tw-min-w-[350px] tw-max-w-[650px] tw-overflow-hidden max-lg:tw-h-fit max-lg:tw-max-h-[320px] max-lg:tw-min-h-[180px] max-lg:tw-w-[320px] max-lg:tw-min-w-[320px]"
>
<img
src="./assets/images/screenshots/feats_v1.3_screenshot_1.png"
alt="app"
class="tw-h-full tw-w-full tw-object-contain"
/>
</div>
</div>
</div>
</section>
<section
class="tw-mt-5 tw-flex tw-w-full tw-flex-col tw-place-items-center tw-p-[2%]"
id="what-is-feats">
<h2 class="tw-text-4xl tw-text-primary tw-font-semibold">What is Feats?</h2>
<div class="tw-mt-10 tw-max-w-[650px] tw-p-2 tw-text-justify max-lg:tw-max-w-full">
Feats is a lightweight, free-to-use desktop app for keeping track of your completed bicycle rides and planned routes.
<br />
<br />
It's not intended to be a full-featured app, but rather a simple and easy-to-use tool. Feats is particularly practical if you use multiple cycling platforms and have a lot of previously unusable legacy data, and want to see all your rides and routes in one place. It's also useful if you don't use any platform at all and just want a simple way to keep track of your rides and routes.
<br />
<br />
The extensive use of charts and statistics provides insights into your riding habits and achievements.
<br />
<br />
Feats is by no means a replacement for existing bicycle platforms. It is not a navigation or training app and not a social app, but rather a personal diary and statistics tool for your rides and routes. Everything is stored locally on your device.
</div>
</section>
<section class="tw-mt-5 tw-flex tw-w-full tw-flex-col tw-place-items-center tw-p-[2%]" id="new-version">
<h2 class="tw-text-4xl tw-text-primary tw-font-semibold">What's new in version 1.3?</h2>
<div class="tw-mt-10 tw-max-w-[650px] tw-p-2 tw-text-justify max-lg:tw-max-w-full">
<h4 class="tw-text-l tw-font-semibold">Advanced Search</h4>
Both table views Rides and Routes now have an 'Advanced Search' button, If you click the button, search input
fields will appear at the top of each column. You can then search in specific columns and even combine searches,
such as 'Date' = '2025-05' and 'Distance' = '>100' to show all your rides above 100 km in May 2025.
<br /><br />
<h4 class="tw-text-l tw-font-semibold">Manage Data</h4>
Feats has a new 'page': Manage Data. On this page you can initiate a backup of all your rides and routes (in the previous versions the backup function was located on the Settings page) and now you can also restore a previously made backup within the app - no need for a third party tool anymore.
<br />
You can now also import your pre-Feats data on the Manage Data page by selecting a CSV file. See the <a href="https://github.com/robvans66/feats/wiki#adding-data" target="_blank" class="wikilink">wiki</a> for more information about preparing your import file.
<br /><br />
<h4 class="tw-text-l tw-font-semibold">Updating the app</h4>
When updating Feats to a newer version, just follow the installation instructions. Updating the app does not affect the database with your rides and routes.
</div>
</section>
<section
class="tw-relative tw-flex tw-w-full tw-max-w-[100vw] tw-flex-col tw-place-content-center tw-place-items-center tw-overflow-hidden tw-p-6"
id="features"
>
<div
class="tw-mt-8 tw-flex tw-flex-col tw-place-items-center tw-gap-5"
>
<div
class="tw-mt-5 tw-flex tw-flex-col tw-gap-3 tw-text-center"
>
<h2 class="tw-text-4xl tw-font-semibold">Features</h2>
</div>
<div
class="tw-mt-6 tw-flex tw-max-w-[60%] tw-flex-wrap tw-place-content-center tw-gap-2 max-lg:tw-flex-col"
>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i
class="bi bi-ui-checks tw-text-5xl tw-text-primary"
></i>
<h3 class="tw-text-2xl tw-font-semibold">Forms</h3>
<div class="tw-text-[#595959]">
Simple forms make it easy to enter your data.
</div>
</div>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i
class="bi bi-database-fill-check tw-text-5xl tw-text-primary"
></i>
<h3 class="tw-text-2xl tw-font-semibold">Database</h3>
<div class="tw-text-[#595959]">
All information is stored locally on your computer in a high-performance database.
</div>
</div>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i
class="bi bi-sliders2-vertical tw-text-5xl tw-text-primary"
></i>
<h3 class="tw-text-2xl tw-font-semibold">Settings</h3>
<div class="tw-text-[#595959]">
Customize the look and feel of the app in settings.
</div>
</div>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i
class="bi bi-book-fill tw-text-5xl tw-text-primary"
></i>
<h3 class="tw-text-2xl tw-font-semibold">Documentation</h3>
<div class="tw-text-[#595959]">
Quickly get up to speed with the in-app documentation.
</div>
</div>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i
class="bi bi-bar-chart-fill tw-text-5xl tw-text-primary"
></i>
<h3 class="tw-text-2xl tw-font-semibold">Statistics</h3>
<div class="tw-text-[#595959]">
See detailed stats about your rides in clear charts and tables.
</div>
</div>
<div
class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center"
>
<i class="bi bi-wikipedia tw-text-5xl tw-text-primary"></i>
<h3 class="tw-text-2xl tw-font-semibold">Wiki</h3>
<div class="tw-text-[#595959]">
A comprehensive <a href="https://github.com/robvans66/feats/wiki" target="_blank" class="wikilink">wiki</a> helps you get the most out of the app.
</div>
</div>
</div>
</div>
</section>
<section class="tw-mt-5 tw-flex tw-w-full tw-flex-col tw-place-items-center tw-p-[2%]" id="screenshots">
<h2 class="tw-text-4xl tw-text-primary tw-font-semibold">Screenshots</h2>
<div class="tw-text-[#595959]">
(These screenshots are from a demo installation of the app with 1000 randomly generated bike rides.)
</div>
<div class="tw-mt-10 tw-max-w-[650px] tw-p-2 tw-text-justify max-lg:tw-max-w-full">
<img src="./assets/images/screenshots/feats_v1.3_screenshot_1.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_2.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_3.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_4.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_5.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_6.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
<img src="./assets/images/screenshots/feats_v1.3_screenshot_7.png" alt="app" class="tw-h-full tw-w-full tw-object-contain" />
</div>
</section>
<section
class="tw-relative tw-flex tw-w-full tw-max-w-[100vw] tw-flex-col tw-place-content-center tw-place-items-center tw-overflow-hidden tw-p-6"
id="more">
<div class="tw-mt-8 tw-flex tw-flex-col tw-place-items-center tw-gap-5">
<div class="tw-mt-5 tw-flex tw-flex-col tw-gap-3 tw-text-center">
<h2 class="tw-text-4xl tw-font-semibold">More</h2>
</div>
<div class="tw-mt-6 tw-flex tw-max-w-[60%] tw-flex-wrap tw-place-content-center tw-gap-2 max-lg:tw-flex-col">
<div class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center">
<i class="bi bi-chat-dots tw-text-5xl tw-text-primary"></i>
<h3 class="tw-text-2xl tw-font-semibold">Feedback</h3>
<div class="tw-text-[#595959]">
Ask a question, leave feedback, or start a discussion on the Feats community pages <a
href="https://github.com/robvans66/feats/discussions" target="_blank"><i
class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
<div class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center">
<i class="bi bi-code-slash tw-text-5xl tw-text-primary"></i>
<h3 class="tw-text-2xl tw-font-semibold">Open Source</h3>
<div class="tw-text-[#595959]">
Feats is open source software and free to use <a
href="https://github.com/robvans66/feats/blob/main/LICENSE" target="_blank"><i
class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
<div class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center">
<i class="bi bi-github tw-text-5xl tw-text-primary"></i>
<h3 class="tw-text-2xl tw-font-semibold">Repository</h3>
<div class="tw-text-[#595959]">
Repository with source code on GitHub <a href="https://github.com/robvans66/feats"
target="_blank"><i class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
<div class="tw-flex tw-h-[250px] tw-w-[350px] tw-flex-col tw-gap-2 tw-p-4 tw-text-center">
<i class="bi bi-archive tw-text-5xl tw-text-primary"></i>
<h3 class="tw-text-2xl tw-font-semibold">Releases</h3>
<div class="tw-text-[#595959]">
Previous releases of the app <a href="https://github.com/robvans66/feats/releases" target="_blank"><i class="bi bi-box-arrow-up-right"></i></a>
</div>
</div>
</div>
</div>
</section>
<footer
class="tw-mt-auto tw-flex tw-w-full tw-place-content-around tw-gap-3 tw-p-[5%] tw-px-[10%] tw-text-black max-md:tw-flex-col"
>
</footer>
</body>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.0/gsap.min.js"
integrity="sha512-B1lby8cGcAUU3GR+Fd809/ZxgHbfwJMp0jLTVfHiArTuUt++VqSlJpaJvhNtRf3NERaxDNmmxkdx2o+aHd4bvw=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.0/ScrollTrigger.min.js"
integrity="sha512-AY2+JxnBETJ0wcXnLPCcZJIJx0eimyhz3OJ55k2Jx4RtYC+XdIi2VtJQ+tP3BaTst4otlGG1TtPJ9fKrAUnRdQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
></script>
<script src="./index.js"></script>
</html>