about.templ
1package pages
2
3templ About() {
4 @Layout() {
5 <style>
6 @import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap');
7 </style>
8 <div class="text-xl px-5 my-20 md:max-w-[80ch] mx-auto">
9 <picture>
10 <source
11 type="image/webp"
12 srcset="https://media.rtw.run/bt-320w.webp 320w, https://media.rtw.run/bt-640w.webp 640w, https://media.rtw.run/bt-960w.webp 960w, https://media.rtw.run/bt-1280w.webp 1280w, https://media.rtw.run/bt-1920w.webp 1920w, https://media.rtw.run/bt-2560w.webp 2560w"
13 sizes="(max-width: 600px) 90vw, (max-width: 1200px) 50vw, 800px"
14 />
15 <img
16 class="w-75 rounded-full mx-auto md:float-left p-1 border-4 border-(--color-blue) mr-6 mb-2"
17 src="https://media.rtw.run/bt-640w.jpg"
18 srcset="https://media.rtw.run/bt-320w.jpg 320w, https://media.rtw.run/bt-640w.jpg 640w, https://media.rtw.run/bt-960w.jpg 960w, https://media.rtw.run/bt-1280w.jpg 1280w, https://media.rtw.run/bt-1920w.jpg 1920w, https://media.rtw.run/bt-2560w.jpg 2560w"
19 sizes="(max-width: 600px) 90vw, (max-width: 1200px) 50vw, 800px"
20 alt="picture of BT, creator of rtw.run"
21 loading="lazy"
22 />
23 </picture>
24 <p class="pt-4 md:pt-24 md:px-14">
25 <span class="text-3xl font-extrabold mr-1">Welcome! </span> I'm BT, the creator of <span class="text-orange font-[Permanent_Marker] ml-[3px]">RTW</span><span class="text-sm">.run</span>. I built this site to help plan my adventure motorcycle trips when Google Maps and the others didn't work the way I wished they would.
26 </p>
27 <p class="mt-6 md:px-14">
28 A few of the things I'm most excited about:
29 <ul class="py-2 list-disc list-inside md:px-14 space-y-4">
30 <li class="px-4">
31 A <span class="font-extrabold">custom routing engine</span> that gets you off road, on the TET or BDR (if you want.) Built with <span class="text-orange font-[Permanent_Marker]">Adventure Intelligence</span>, the only good kind of AI.
32 </li>
33 <li class="px-4">
34 Unique <span class="font-extrabold">document-style interface</span> that lets you plan any kind of trip. Write down where you want to go and why, add a to-do or a packing list, upload pictures, add notes about things to see, anything you want!
35 </li>
36 <li class="px-4">
37 Find the best time to ride with <span class="font-extrabold">historical weather averages</span> along your route
38 </li>
39 </ul>
40 </p>
41 <p class="pt-4 md:px-14">
42 And best of all, it's <span class="font-[Permanent_Marker] text-orange">free</span>. No tracking, no BS, just an app for the ADV community.
43 </p>
44 <p class="pt-4 md:px-14">
45 Have ideas to make it better? Get in touch:
46 <div class="flex flex-row pt-4 text-gray-600 gap-6 md:px-14 align-center justify-center mx-auto">
47 <a href="mailto:[email protected]" class="my-auto" title="[email protected]">
48 <svg xmlns="http://www.w3.org/2000/svg" width="36" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-mail-icon lucide-mail"><path d="m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7"></path><rect x="2" y="4" width="20" height="16" rx="2"></rect></svg>
49 </a>
50 <a href="https://bsky.app/profile/rtw.run" title="@rtw.run on Bluesky">
51 <svg xmlns="http://www.w3.org/2000/svg" class="w-10 text-gray-600" viewBox="0 0 640 640" fill="#1185fe">
52 <!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.-->
53 <path d="M439.8 358.7C436.5 358.3 433.1 357.9 429.8 357.4C433.2 357.8 436.5 358.3 439.8 358.7zM320 291.1C293.9 240.4 222.9 145.9 156.9 99.3C93.6 54.6 69.5 62.3 53.6 69.5C35.3 77.8 32 105.9 32 122.4C32 138.9 41.1 258 47 277.9C66.5 343.6 136.1 365.8 200.2 358.6C203.5 358.1 206.8 357.7 210.2 357.2C206.9 357.7 203.6 358.2 200.2 358.6C106.3 372.6 22.9 406.8 132.3 528.5C252.6 653.1 297.1 501.8 320 425.1C342.9 501.8 369.2 647.6 505.6 528.5C608 425.1 533.7 372.5 439.8 358.6C436.5 358.2 433.1 357.8 429.8 357.3C433.2 357.7 436.5 358.2 439.8 358.6C503.9 365.7 573.4 343.5 593 277.9C598.9 258 608 139 608 122.4C608 105.8 604.7 77.7 586.4 69.5C570.6 62.4 546.4 54.6 483.2 99.3C417.1 145.9 346.1 240.4 320 291.1z"></path>
54 </svg>
55 </a>
56 <a href="https://youtube.com/@BTridesRTW" title="@BTridesRTW on YouTube">
57 <svg xmlns="http://www.w3.org/2000/svg" class="w-10 text-gray-600" viewBox="0 0 640 640" fill="#ff0033">
58 <!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.-->
59 <path d="M581.7 188.1C575.5 164.4 556.9 145.8 533.4 139.5C490.9 128 320.1 128 320.1 128C320.1 128 149.3 128 106.7 139.5C83.2 145.8 64.7 164.4 58.4 188.1C47 231 47 320.4 47 320.4C47 320.4 47 409.8 58.4 452.7C64.7 476.3 83.2 494.2 106.7 500.5C149.3 512 320.1 512 320.1 512C320.1 512 490.9 512 533.5 500.5C557 494.2 575.5 476.3 581.8 452.7C593.2 409.8 593.2 320.4 593.2 320.4C593.2 320.4 593.2 231 581.8 188.1zM264.2 401.6L264.2 239.2L406.9 320.4L264.2 401.6z"></path>
60 </svg>
61 </a>
62 </div>
63 </p>
64 </div>
65 }
66}
