-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
378 lines (371 loc) · 26.4 KB
/
index.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
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
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
<!DOCTYPE html>
<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>Welcome to #FitDevs</title>
<meta name="description" content="#FitDevs was created to empower developers to explore, maintain, and inspire an overall goal of fitness in our collective lives.">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css">
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat&family=Nunito:ital,wght@0,400;0,500;0,700;1,400&display=swap" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="header__content">
<a href="/" class="header__home">
<picture class="header__picture">
<img src="./images/fitdevs-logo.svg" alt="#FitDevs Logo" />
</picture>
</a>
<div class="header__socials">
<ul>
<li><a href="https://discord.gg/rUKrTCgxa5" target="_blank" rel="noopener noreferrer"><span class="sr-only">Discord</span><i class="fa-brands fa-discord"></i></a></li>
<li><a href="https://github.com/FitDevs-withKat" target="_blank" rel="noopener noreferrer"><span class="sr-only">GitHub</span><i class="fa-brands fa-github"></i></a></li>
<li><a href="https://twitter.com/search?q=%23FitDevs&src=typed_query" target="_blank" rel="noopener noreferrer"><span class="sr-only">Twitter</span><i class="fa-brands fa-twitter"></i></a></li>
</ul>
</div>
</div>
</header>
<main>
<!-- <section class="hero">
<div class="hero__content">
<h1 class="hero__title">#FitDevs</h1>
<div class="hero__subtitle heading-3">Explore. Maintain. Inspire.</div>
</div>
</section> -->
<section class="hero">
<div class="hero__content">
<h1 class="hero__title">Welcome to #FITDEVS</h1>
<p class="hero__blurb">Empower developers to explore, maintain, and inspire fitness in our collective lives.</p>
<a href="#events" class="button button--yellow">View Upcoming Events</a>
</div>
<div class='hero__frame'>
<img class="hero__image" src="/images/resize-pexels-jonathan-petersson-1076180.jpg" alt="Green forest hill with a lake in the background." />
</div>
</section>
<section class="faq">
<h2 class="center">Get Started</h2>
<div class="faq__question">
<div class="faq__header">
<h3>Why #FitDevs exists</h3>
</div>
<div class="faq__answer">
<p>#FitDevs was created because we want to empower developers to explore, maintain, and inspire fitness in our collective lives.</p>
</div>
</div>
<div class="faq__question">
<div class="faq__header">
<h3>How #FitDevs plan to empower developers to EMI-fitness as a community</h3>
</div>
<div class="faq__answer">
<p>We plan to achieve our goals by building an open and inclusive community on Twitter, Discord, and Github altogether as a collaborative effort by our community of developers. We want this to be an open sourced project with everyone contributing however they can, whether it's by a tweet, by maintaining our github together, or by inspiring others with their recipes or workout photos and achievements! All hands on deck, this is a community project!</p>
</div>
</div>
<div class="faq__question">
<div class="faq__header">
<h3>What #FitDevs is doing to achieve our goals!</h3>
</div>
<div class="faq__answer">
<p><span class="bold">Twitter</span> : We are publicly utilizing the #FitDevs hashtag to showcase different methods and mediums of how developers can prioritize their health, and to promote this lifestyle among techtwitter.</p>
<p><span class="bold">Discord</span> : We created a server open to the public that is more casual and close knit for devs to hang out and keep each other accountable with our fitness journey.</p>
<p><span class="bold">Github</span> : We established an open sourced project for developers to build this community with us, from the ground up, and to utilize it as a source to continuously commit and document our collective achievements.</p>
</div>
</div>
<div class="faq__question">
<div class="faq__header">
<h3>Join Our Journey!</h3>
</div>
<div class="faq__answer">
<p><span class="bold">Twitter</span> : Use our hashtag <a href="https://twitter.com/search?q=%23fitdevs&src=typed_query&f=live" target="_blank" rel="noopener noreferrer">#FitDevs</a> and tag <a href="https://twitter.com/katalyst_katt" target="_blank" rel="noopener noreferrer">@katalyst_katt</a> & your friends! Also please follow <a href="https://twitter.com/Fit_Devs" target="_blank" rel="noopener noreferrer">@Fit_Devs</a> so that you will receive important announcements in the future regarding our competitions and events!</p>
<p><span class="bold">Discord</span> : Join our <a href="https://discord.com/invite/AY8sgsAk5H" target="_blank" rel="noopener noreferrer">community</a>. Join a team and start building this community with us, while sharing your fitness journey in our inspiration-maintenance channels!</p>
<p><span class="bold">GitHub</span> : Star our <a href="https://github.com/FitDevs-withKat" target="_blank" rel="noopener noreferrer">organization</a> & head on over to our fitness-accountability repository to add your name to our data Folder! Fork any projects you would like to contriute to. We also have a <a href="https://github.com/FitDevs-withKat/.github/discussions" target="_blank" rel="noopener noreferrer">discussions</a> page that welcomes inputs from our wonderful community!</p>
</div>
</div>
</section>
<!-- <section class="section narrow-content">
<h2 class="center">Who We Are</h2>
<p>#FitDevs was created because we want to empower developers to explore, maintain, and inspire fitness in our collective lives.</p>
<p>We plan to achieve our goals by building an open and inclusive community on Twitter, Discord, and Github altogether as a collaborative effort by our community of developers. We want this to be an open sourced project with everyone contributing however they can, whether it's by a tweet, by maintaining our github together, or by inspiring others with their recipes or workout photos and achievements! All hands on deck, this is a community project!</p>
<p class="center"><a href="https://fitdevs-withkat.github.io/Fitness-Accountability/" class="button button--blue" target="_blank" rel="noopener noreferrer">View Community Pledges</a></p>
</section> -->
<section class="timeline">
<div class="timeline__content">
<h2 class="center">Our Journey</h2>
<div class="story">
<div class="story__content">
<span class="story__title">#FitDevs First Official Twitter Space</span>
<p>July-20-2022</p>
<p class="story__blurb">Kat hosted our very first twitter space dedicated to #FitDevs with amazing speakers (Eddie, Sara, Deni, TechRally, Yuri, Francesco, and open mic invitations!) to discuss publicly what #FitDevs is and how we are building this community together</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-bullhorn"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">Discord Released for Public Entry</span>
<p>July-20-2022</p>
<p class="story__blurb">The official discord server was open for people to join, we are officially open for collaboration!</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-bullhorn"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">100th User in Discord Server Joined!</span>
<p>July-22-2022</p>
<p class="story__blurb">Our first mini milestone was reached with 100 users joining!</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-person"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">Live Stream to Publicly Build Github Repository</span>
<p>July-23-2022</p>
<p class="story__blurb">Today there was an exciting livestream by Eddie hosting guests of Kat and Francesco to build our GitHub Repository together on youtube! We gave a live demo on how to make your first pull request and gave a behind the scenes demonstration of how the organization is maintained on GitHub!</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-video"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">Twitter Bot @Fit_Devs LIVE</span>
<p>TBD</p>
<p class="story__blurb">Publicly built twitter bot to go live on twitter to like and retweet all users using our #FitDevs hashtag!</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-calendar"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">Discord Bot LIVE</span>
<p>TBD</p>
<p class="story__blurb">Publicly built discord bot to go live on discord just in time for us to start leaderboards for #FitDevs challenges!</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-calendar"></i>
</div>
</div>
<div class="story">
<div class="story__content">
<span class="story__title">1000th User to Join #FitDevs</span>
<p>TBD</p>
<p class="story__blurb">Upon 1000 users, we get T-Shirts to promote our EMI concepts :)</p>
</div>
<div class="story__icon">
<i class="fa-solid fa-calendar"></i>
</div>
</div>
</div>
</section>
<section class="cta">
<div class="cta__content">
<h3 class="cta__title center">Join Our Community</h3>
<p class="cta__subtitle subtitle">Over 400+ developer accountability partners to go through this journey together!</p>
<div class="cta__socials">
<ul>
<li><a href="https://discord.gg/rUKrTCgxa5" target="_blank" rel="noopener noreferrer"><span class="sr-only">Discord</span><i class="fa-brands fa-discord"></i></a></li>
<li><a href="https://github.com/FitDevs-withKat" target="_blank" rel="noopener noreferrer"><span class="sr-only">GitHub</span><i class="fa-brands fa-github"></i></a></li>
<li><a href="https://twitter.com/search?q=%23FitDevs&src=typed_query" target="_blank" rel="noopener noreferrer"><span class="sr-only">Twitter</span><i class="fa-brands fa-twitter"></i></a></li>
</ul>
</div>
</div>
</section>
<section class="section" id="events">
<div class="icon-heading">
<div class="icon-heading__icon">
<i class="fa-solid fa-calendar-check"></i>
</div>
<h2>Upcoming Events</h2>
</div>
<div class="events">
<div class="events__content">
<article class="event">
<div class="event__featured">
<picture class="event__picture">
<img src="./images/city-overlook.jpg" alt="#" />
</picture>
<div class="event__pill">Discord</div>
</div>
<div class="event__content">
<h3 class="event__title heading-5"><a href="#">Discord Hangout - Week In Review</a></h3>
<div class="event__details">
<div class="event__month">
<span class="event__emph">July</span>
<span class="event__emph">27</span>
</div>
<div class="event__day">
<div class="event__daytime">
<span class="event__emph">Wednesday</span>
<span class="event__time">09:30am - 01:00pm</span>
</div>
<div class="event__icon">
<i class="fa-solid fa-calendar-check"></i>
</div>
</div>
</div>
<span class="event__subtitle">Event Details</span>
<p class="event__description">Come hangout and discuss your week with us. Did you accomplush your goals or do some amazing stuff? tell us about them!</p>
<a href="#" target="_blank" rel="noopener noreferrer" class="event__cta">Go to Event <i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</article>
<article class="event">
<div class="event__featured">
<picture class="event__picture">
<img src="./images/pexels-photo-812958-water.png" alt="#" />
</picture>
<div class="event__pill">Twitch</div>
</div>
<div class="event__content">
<h3 class="event__title heading-5"><a href="#">Twitch Coding Stream with Kat - Building in Public</a></h3>
<div class="event__details">
<div class="event__month">
<span class="event__emph">Aug</span>
<span class="event__emph">4</span>
</div>
<div class="event__day">
<div class="event__daytime">
<span class="event__emph">Thursday</span>
<span class="event__time">02:30pm - 05:00pm</span>
</div>
<div class="event__icon">
<i class="fa-solid fa-calendar-check"></i>
</div>
</div>
</div>
<span class="event__subtitle">Event Details</span>
<p class="event__description">Come hangout with me as I work through my day. Learn various technologies like NodeJS and Python.</p>
<a href="#" target="_blank" rel="noopener noreferrer" class="event__cta">Go to Event <i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</article>
<article class="event">
<div class="event__featured">
<picture class="event__picture">
<img src="./images/forest-trees-perspective-bright-957024 1.png" alt="#" />
</picture>
<div class="event__pill">Twitter Space</div>
</div>
<div class="event__content">
<h3 class="event__title heading-5"><a href="#">Twitter Space - Yoga for Stress Management</a></h3>
<div class="event__details">
<div class="event__month">
<span class="event__emph">Aug</span>
<span class="event__emph">16</span>
</div>
<div class="event__day">
<div class="event__daytime">
<span class="event__emph">Tuesday</span>
<span class="event__time">11:30am - 01:45pm</span>
</div>
<div class="event__icon">
<i class="fa-solid fa-calendar-check"></i>
</div>
</div>
</div>
<span class="event__subtitle">Event Details</span>
<p class="event__description">Discuss your top yoga tips & tricks with like minded individuals.</p>
<a href="#" target="_blank" rel="noopener noreferrer" class="event__cta">Go to Event <i class="fa-solid fa-arrow-up-right-from-square"></i></a>
</div>
</article>
</div>
</div>
</section>
<section class="section">
<div class="icon-heading">
<div class="icon-heading__icon">
<i class="fa-solid fa-quote-right"></i>
</div>
<h2>Testimonials</h2>
</div>
<section class="testimonials">
<div class="testimonials__content">
<div class="testimonials__statemenet a">
<div class="testimonials__header">
<picture class="testimonials__pfp">
<img src="./images/josh.webp" alt="Joshua Hallee profile picture" />
</picture>
<div class="testimonials__meta">
<h3 class="testimonials__author heading-5">Joshua Hallee</h3>
<span class="testimonials__subtitle">Community Member</span>
</div>
</div>
<p class="testimonials__quote">When I joined #FitDevs I was astonished to find a community that celebrates even the smallest of goals. Whether it’s a basic workout, or something challenging, someone is always there to hold you accountable and cheer you on from the sidelines. This community inspires me on a daily basis, and I couldn’t be anymore grateful to be a part of it.</p>
</div>
<div class="testimonials__statemenet b">
<div class="testimonials__header">
<picture class="testimonials__pfp">
<img src="./images/parker.webp" alt="Parker profile picture" />
</picture>
<div class="testimonials__meta">
<h3 class="testimonials__author heading-5">Parker</h3>
<span class="testimonials__subtitle">Community Member</span>
</div>
</div>
<p class="testimonials__quote">Since joining I look forward to having a community of devs to share my journey with. The support from everyone as we all make progress towards our individual goals is incredibly encouraging. #FitDevs give all the motivation you need to crush it!</p>
</div>
<div class="testimonials__statemenet c">
<div class="testimonials__header">
<picture class="testimonials__pfp">
<img src="./images/kyle.webp" alt="Kyle profile picture" />
</picture>
<div class="testimonials__meta">
<h3 class="testimonials__author heading-5">Kyle</h3>
<span class="testimonials__subtitle">Community Member</span>
</div>
</div>
<p class="testimonials__quote">I joined #fitdevs because I admired the passion that @katalystkat had for health and for this community. I knew immediately that I had made the right decision joining when I felt passion and support from other members of the community. It's not very often that you get to join something and immediately feel like you belong.</p>
</div>
<div class="testimonials__statemenet d">
<div class="testimonials__header">
<picture class="testimonials__pfp">
<img src="./images/324hz.webp" alt="324Hz profile picture" />
</picture>
<div class="testimonials__meta">
<h3 class="testimonials__author heading-5">324Hz</h3>
<span class="testimonials__subtitle">Community Member</span>
</div>
</div>
<p class="testimonials__quote">After joining this amazing small (but growing) community, I saw that motivation for even the smallest things was the main goal as well as holding accountable so that you have at least the motivation to for example run and #FitDevs managed to hit all of those awesome qualities!</p>
</div>
</div>
</section>
</section>
<section class="twitter section">
<div class="icon-heading">
<div class="icon-heading__icon">
<i class="fa-solid fa-quote-right"></i>
</div>
<h2>See What #FitDevs are Tweeting!</h2>
</div>
<div class="twitter__content">
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Good morning <a href="https://twitter.com/hashtag/FitDevs?src=hash&ref_src=twsrc%5Etfw">#FitDevs</a>! I walk my dogs daily for both their & my benefits: <br><br>1) warms up my body 🧘♀️ <br>2) we say hi to all our neighbors (humans and dogs alike) 👯♀️<br>3) I catch up on texts/calls w my family members 🏡<br>4) pups get their daily enrichment 🧠<br><br>Have a lovely weekend, EMI💕 <a href="https://t.co/zfBcD0Vn1a">pic.twitter.com/zfBcD0Vn1a</a></p>— katalyst kat (@katalyst_katt) <a href="https://twitter.com/katalyst_katt/status/1553439468673085440?ref_src=twsrc%5Etfw">July 30, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">When you miss your laptop but <a href="https://twitter.com/SaraJaoude?ref_src=twsrc%5Etfw">@SaraJaoude</a> gives you a reality check 😂 <a href="https://twitter.com/hashtag/FitDevs?src=hash&ref_src=twsrc%5Etfw">#FitDevs</a> <a href="https://t.co/4VUUYC8gAh">pic.twitter.com/4VUUYC8gAh</a></p>— Eddie Jaoude | GitHub Star (@eddiejaoude) <a href="https://twitter.com/eddiejaoude/status/1552862492048740352?ref_src=twsrc%5Etfw">July 29, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">As a developer, how do you like to stay fit?<br><br>Me:<br>- Not overeating<br>- Not too much sugar<br>- Not too much stress (it leads to over eating)<br>- Regular walks & workouts<a href="https://twitter.com/hashtag/fitdevs?src=hash&ref_src=twsrc%5Etfw">#fitdevs</a> <a href="https://t.co/MDCagjrXvM">pic.twitter.com/MDCagjrXvM</a></p>— YK aka CS Dojo 📺🐦 (@ykdojo) <a href="https://twitter.com/ykdojo/status/1551596889887256577?ref_src=twsrc%5Etfw">July 25, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<!-- <a class="twitter-timeline" href="https://twitter.com/katalyst_katt?ref_src=twsrc%5Etfw">Tweets by katalyst_katt</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> -->
</div>
</section>
</main>
<footer class="footer">
<div class="footer__content">
<div class="footer__copyright">
<p>© Copyright 2022</p>
</div>
<div class="footer__socials">
<ul>
<li><a href="https://discord.gg/rUKrTCgxa5" target="_blank" rel="noopener noreferrer"><span class="sr-only">Discord</span><i class="fa-brands fa-discord"></i></a></li>
<li><a href="https://github.com/FitDevs-withKat" target="_blank" rel="noopener noreferrer"><span class="sr-only">GitHub</span><i class="fa-brands fa-github"></i></a></li>
<li><a href="https://twitter.com/search?q=%23FitDevs&src=typed_query" target="_blank" rel="noopener noreferrer"><span class="sr-only">Twitter</span><i class="fa-brands fa-twitter"></i></a></li>
</ul>
</div>
</div>
</footer>
</body>
</html>