Skip to content

Commit 5660afe

Browse files
felixguendlingfelixguendling
committed
mobile
1 parent 6923868 commit 5660afe

File tree

2 files changed

+18
-211
lines changed

2 files changed

+18
-211
lines changed

‎src/components/Header.astro‎

Lines changed: 0 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -40,65 +40,6 @@ const {loggedIn = false} = Astro.props as Props;
4040
<h1 id="title" class="font-semibold">triptix</h1>
4141
</a>
4242
</div>
43-
44-
<!-- NAVIGATION LINKS -->
45-
<div class="hidden md:flex md:gap-5 md:gap-10">
46-
<!--
47-
<a class="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-sm hover:text-zinc-300"
48-
href="/docs">Docs</a>
49-
<a class="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-sm hover:text-zinc-300"
50-
href="/pricing">Pricing</a>
51-
<a class="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-sm hover:text-zinc-300"
52-
href="/blog">Blog</a>
53-
-->
54-
</div>
55-
56-
<!-- DISCORD -->
57-
<a href="https://matrix.to/#/!nDYXqlCcwsVCbNGJaA:matrix.org?via=matrix.org"
58-
class="hidden md:flex items-center hover:text-zinc-300 hover-scale duration-500 transition-transform">
59-
<svg width="27.9" height="32" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27.9 32">
60-
<g class="fill-current">
61-
<path d="M27.005 31.205V.705h-2.19v-.732h3.04v32h-3.04v-.732zM8.135 10.405v1.54h.044a4.486 4.486 0 0 1 1.49-1.37c.58-.323 1.25-.485 1.99-.485.72 0 1.38.14 1.97.42.595.279 1.05.771 1.36 1.48.338-.5.796-.941 1.38-1.32.58-.383 1.27-.574 2.06-.574.602 0 1.16.074 1.67.22.514.148.954.383 1.32.707.366.323.653.746.859 1.27.205.522.308 1.15.308 1.89v7.63h-3.13v-6.46c0-.383-.015-.743-.044-1.08a2.302 2.302 0 0 0-.242-.882 1.47 1.47 0 0 0-.584-.596c-.257-.146-.606-.22-1.05-.22-.44 0-.796.085-1.07.253-.272.17-.485.39-.639.662a2.649 2.649 0 0 0-.308.927 7.075 7.075 0 0 0-.078 1.05v6.35h-3.13v-6.4c0-.338-.007-.673-.021-1a2.826 2.826 0 0 0-.188-.916 1.408 1.408 0 0 0-.55-.673c-.258-.168-.636-.253-1.14-.253a2.334 2.334 0 0 0-.584.1 1.95 1.95 0 0 0-.705.374c-.228.184-.422.449-.584.794-.161.346-.242.798-.242 1.36v6.62h-3.13v-11.4zM.841.737v30.5h2.19v.732h-3.04v-32h3.03v.732z"/>
62-
</g>
63-
</svg>
64-
<span class="ml-4 text-sm font-semibold underline underline-offset-4">Join us for a chat</span>
65-
</a>
66-
67-
<!-- LOGIN / GET STARTED
68-
<div class="hidden md:flex items-center gap-6">
69-
<a href="https://github.com/triptix-tech"
70-
class="hidden md:flex items-center hover:text-zinc-300 transition-all delay-150 hover-scale">
71-
<svg width="27" height="26" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 98 96">
72-
<path fill-rule="evenodd" clip-rule="evenodd"
73-
d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"
74-
class="fill-current"></path>
75-
</svg>
76-
</a>
77-
{
78-
loggedIn === false &&
79-
<a id="login"
80-
class="inline-flex justify-center rounded-lg border py-[calc(theme(spacing.2)-1px)] px-[calc(theme(spacing.3)-1px)] text-sm outline-2 outline-offset-2 transition-colors border-zinc-300 hover:border-zinc-100 hover:bg-zinc-900 active:bg-gray-100 hidden md:block"
81-
href="/auth/login">Log in</a>
82-
<a id="signup"
83-
class="inline-flex justify-center rounded-lg py-2 px-3 text-sm font-semibold outline-2 outline-offset-2 transition-colors hover:bg-gray-100 bg-white hover:bg-zinc-300 text-black md:block"
84-
href="/auth/signup">Sign Up</a>
85-
}
86-
{
87-
loggedIn === true &&
88-
<a id="logout"
89-
class="inline-flex justify-center rounded-lg border py-[calc(theme(spacing.2)-1px)] px-[calc(theme(spacing.3)-1px)] text-sm outline-2 outline-offset-2 transition-colors border-zinc-300 hover:border-zinc-100 hover:bg-zinc-900 active:bg-gray-100 hidden md:block"
90-
href="/auth/logout">Log out</a>
91-
}
92-
</div>
93-
-->
94-
95-
<!-- MOBILE: HAMBURGER
96-
<a href="#menu" class="md:hidden rounded display-block p-1">
97-
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" height="32" width="32">
98-
<path class="fill-gray-100" d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
99-
</svg>
100-
</a>
101-
-->
10243
</div>
10344
</nav>
10445
</header>

‎src/pages/index.astro‎

Lines changed: 18 additions & 152 deletions
Original file line numberDiff line numberDiff line change
@@ -3,157 +3,23 @@ import SiteLayout from '../layouts/SiteLayout.astro';
33
---
44

55
<SiteLayout>
6-
<div class="mx-auto max-w-7xl flex justify-center px-8 mt-16 mb-0 md:mb-8 md:mt-0 text-center md:text-left">
7-
<!-- MARKETING -->
8-
<div class="text-center">
9-
<!--
10-
<a href="/blog/release-1.0"
11-
class="dark:bg-gray-800 bg-gradient-to-r uppercase from-ttblue to-ttpink inline-flex items-center text-white rounded-full py-1 px-1.5 sm:text-base lg:text-sm xl:text-base"><span
12-
class="bg-black text-white font-semibold px-2.5 py-0 lg:py-0.5 text-xs leading-5 tracking-tight rounded-full">New</span>
13-
<span class="ml-2.5 lg:ml-3 text-xs md:text-sm font-semibold">triptix GeoCoder <span
14-
class="font-extrabold">1.0</span></span>
15-
<svg xmlns="http://www.w3.org/2000/svg" class="text-white ml-2 w-4 h-4 transition transform"
16-
fill="none" viewbox="0 0 24 24" stroke="currentColor">
17-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
18-
d="M13 5l7 7-7 7M5 5l7 7-7 7"></path>
19-
</svg>
20-
</a>
21-
-->
22-
<h1 class="text-[48pt] lg:text-[60pt] font-extrabold leading-none tracking-tight mt-4 pt-1 pb-2 bg-gradient-to-r from-ttblue to-ttpink bg-clip-text text-transparent"
23-
style="text-shadow: 0 6px 17px rgba(218, 53, 204, .3)">
24-
Algorithms for Future Mobility
25-
</h1>
26-
<p class="mt-8 sm:mt-4 text-lg text-base/loose md:leading-9">
27-
You want to provide world class mobility solutions to your customers?
28-
</p>
29-
<a class="mt-8 inline-flex items-center justify-center transition-colors duration-200 hover:text-grey-80 transition-shadow items-center gap-2 rounded-full border-2 border-white text-white h-11 px-[22px] text-16 font-medium leading-snug tracking-tighter text-black shadow-[0_6px_16px_rgba(255,255,255,.2)] hover:shadow-[0_6px_20px_rgba(255,255,255,.4)] hover:-translate-y-0.5 transition-transform duration-200 md:text-14 md:h-10 md:px-4.5"
30-
href="mailto:[email protected]">
31-
Get in touch
32-
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="12" fill="none" class="mt-px"
33-
aria-hidden="true">
34-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
35-
stroke-width="1.6"
36-
d="m1 1 4 4-4 4"></path>
37-
</svg>
38-
</a>
39-
</div>
40-
41-
<!-- DEMO
42-
<div class="md:pt-[65px]">
43-
<div class="bg-zinc-900 rounded-[1.5em] z-10 mb-20 md:mb-0">
44-
<div class="flex items-center marker">
45-
<input placeholder="Search" autocomplete="off"
46-
class="p-4 w-100 bg-transparent text-white w-full focus:outline-none focus:ring-0 ml-4 mt-4"
47-
value="Wall Street">
48-
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 -960 960 960" height="32" width="32"
49-
class="mr-8 mt-4">
50-
<path class="fill-ttblue"
51-
d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"></path>
52-
</svg>
53-
</div>
54-
<ul class="mt-2 mx-4 pb-4 text-white max-w-full">
55-
<li class="flex p-4 max-w-full">
56-
<span class="pr-4">
57-
<svg class="fill-ttblue" xmlns="http://www.w3.org/2000/svg" height="24"
58-
viewbox="0 -960 960 960" width="24">
59-
<path d="M480-480q33 0 56.5-23.5T560-560q0-33-23.5-56.5T480-640q-33 0-56.5 23.5T400-560q0 33 23.5 56.5T480-480Zm0 294q122-112 181-203.5T720-552q0-109-69.5-178.5T480-800q-101 0-170.5 69.5T240-552q0 71 59 162.5T480-186Zm0 106Q319-217 239.5-334.5T160-552q0-150 96.5-239T480-880q127 0 223.5 89T800-552q0 100-79.5 217.5T480-80Zm0-480Z"></path>
60-
</svg>
61-
</span>
62-
<span class="align-baseline whitespace-nowrap max-w-full overflow-hidden text-ellipsis">Bartholomäuskirche Wald-Amorbach</span>
63-
<span class="ml-2 text-gray-400 text-sm items-end align-baseline leading-loose whitespace-nowrap max-w-full overflow-hidden text-ellipsis">New York, USA</span>
64-
</li>
65-
<li class="flex p-4">
66-
<span class="pr-4">
67-
<svg class="fill-ttblue" xmlns="http://www.w3.org/2000/svg" height="24"
68-
viewbox="0 -960 960 960" width="24">
69-
<path d="M480-480q33 0 56.5-23.5T560-560q0-33-23.5-56.5T480-640q-33 0-56.5 23.5T400-560q0 33 23.5 56.5T480-480Zm0 294q122-112 181-203.5T720-552q0-109-69.5-178.5T480-800q-101 0-170.5 69.5T240-552q0 71 59 162.5T480-186Zm0 106Q319-217 239.5-334.5T160-552q0-150 96.5-239T480-880q127 0 223.5 89T800-552q0 100-79.5 217.5T480-80Zm0-480Z"></path>
70-
</svg>
71-
</span>
72-
<span class="align-baseline whitespace-nowrap">Wallkill</span>
73-
<span class="ml-2 text-gray-400 text-sm items-end align-baseline leading-loose whitespace-nowrap max-w-full overflow-hidden text-ellipsis">New York, USA</span>
74-
</li>
75-
<li class="flex p-4">
76-
<span class="pr-4">
77-
<svg class="fill-ttblue" xmlns="http://www.w3.org/2000/svg" height="24"
78-
viewbox="0 -960 960 960" width="24">
79-
<path d="M480-480q33 0 56.5-23.5T560-560q0-33-23.5-56.5T480-640q-33 0-56.5 23.5T400-560q0 33 23.5 56.5T480-480Zm0 294q122-112 181-203.5T720-552q0-109-69.5-178.5T480-800q-101 0-170.5 69.5T240-552q0 71 59 162.5T480-186Zm0 106Q319-217 239.5-334.5T160-552q0-150 96.5-239T480-880q127 0 223.5 89T800-552q0 100-79.5 217.5T480-80Zm0-480Z"></path>
80-
</svg>
81-
</span>
82-
<span class="align-baseline whitespace-nowrap">Wall Street</span>
83-
<span class="ml-2 text-gray-400 text-sm items-end align-baseline leading-loose whitespace-nowrap max-w-full overflow-hidden text-ellipsis">Manhatten, New York, USA</span>
84-
</li>
85-
</ul>
86-
</div>
87-
</div>
88-
-->
6+
<div class="mx-auto text-center px-4">
7+
<h1 class="text-[28pt] lg:text-[60pt] font-extrabold leading-none tracking-tight mt-4 pt-1 pb-2 bg-gradient-to-r from-ttblue to-ttpink bg-clip-text text-transparent"
8+
style="text-shadow: 0 6px 17px rgba(218, 53, 204, .3)">
9+
Algorithms for Future Mobility
10+
</h1>
11+
<p class="mt-8 sm:mt-4 text-lg text-base/loose md:leading-9">
12+
You want to provide world class mobility solutions to your customers?
13+
</p>
14+
<a class="mt-8 inline-flex items-center justify-center transition-colors duration-200 hover:text-grey-80 transition-shadow items-center gap-2 rounded-full border-2 border-white text-white h-11 px-[22px] text-16 font-medium leading-snug tracking-tighter text-black shadow-[0_6px_16px_rgba(255,255,255,.2)] hover:shadow-[0_6px_20px_rgba(255,255,255,.4)] hover:-translate-y-0.5 transition-transform duration-200 md:text-14 md:h-10 md:px-4.5"
15+
href="mailto:[email protected]">
16+
Get in touch
17+
<svg xmlns="http://www.w3.org/2000/svg" width="6" height="12" fill="none" class="mt-px"
18+
aria-hidden="true">
19+
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
20+
stroke-width="1.6"
21+
d="m1 1 4 4-4 4"></path>
22+
</svg>
23+
</a>
8924
</div>
90-
91-
<!-- FEATURES
92-
<ul class="sm:mt-12 px-8 mx-auto max-w-7xl grid grid-cols-1 md:grid-cols-4 gap-10 mb-16 sm:mb-24 md:mb-0 text-center sm:text-left">
93-
<li class="block rounded-[1.5em]">
94-
<h1 class="pb-2 sm:pb-4 font-bold text-2xl flex flex-row gap-3 items-center justify-center sm:justify-start">
95-
<svg xmlns="http://www.w3.org/2000/svg" height="32" viewbox="0 -960 960 960" width="32">
96-
<defs>
97-
<lineargradient id="myGradient">
98-
<stop offset="0" stop-color="#53bff9"></stop>
99-
<stop offset="1" stop-color="#da35cc"></stop>
100-
</lineargradient>
101-
<lineargradient id="gradientA" xlink:href="#myGradient"
102-
gradienttransform="rotate(30)">
103-
</lineargradient>
104-
</defs>
105-
<path fill="url(#gradientA)"
106-
d="M480-79q-16 0-30.5-6T423-102L102-423q-11-12-17-26.5T79-480q0-16 6-31t17-26l321-321q12-12 26.5-17.5T480-881q16 0 31 5.5t26 17.5l321 321q12 11 17.5 26t5.5 31q0 16-5.5 30.5T858-423L537-102q-11 11-26 17t-31 6Zm0-80 321-321-321-321-321 321 321 321Zm-40-281h80v-240h-80v240Zm40 120q17 0 28.5-11.5T520-360q0-17-11.5-28.5T480-400q-17 0-28.5 11.5T440-360q0 17 11.5 28.5T480-320Zm0-160Z"></path>
107-
</svg>
108-
<span>Typo Tolerant</span>
109-
</h1>
110-
<p>Everyone makes typos. Our fuzzy string matching doesn't care. </p>
111-
</li>
112-
<li class="block rounded-[1.5em]">
113-
<h1 class="pb-2 sm:pb-4 font-bold text-2xl flex flex-row gap-3 items-center justify-center sm:justify-start">
114-
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewbox="0 -960 960 960" width="24">
115-
<defs>
116-
<lineargradient id="gradientB" xlink:href="#myGradient"
117-
gradienttransform="rotate(130)">
118-
</lineargradient>
119-
</defs>
120-
<path fill="url(#gradientB)"
121-
d="m226-559 78 33q14-28 29-54t33-52l-56-11-84 84Zm142 83 114 113q42-16 90-49t90-75q70-70 109.5-155.5T806-800q-72-5-158 34.5T492-656q-42 42-75 90t-49 90Zm178-65q-23-23-23-56.5t23-56.5q23-23 57-23t57 23q23 23 23 56.5T660-541q-23 23-57 23t-57-23Zm19 321 84-84-11-56q-26 18-52 32.5T532-299l33 79Zm313-653q19 121-23.5 235.5T708-419l20 99q4 20-2 39t-20 33L538-80l-84-197-171-171-197-84 167-168q14-14 33.5-20t39.5-2l99 20q104-104 218-147t235-24ZM157-321q35-35 85.5-35.5T328-322q35 35 34.5 85.5T327-151q-25 25-83.5 43T82-76q14-103 32-161.5t43-83.5Zm57 56q-10 10-20 36.5T180-175q27-4 53.5-13.5T270-208q12-12 13-29t-11-29q-12-12-29-11.5T214-265Z"></path>
122-
</svg>
123-
<span>Fast</span>
124-
</h1>
125-
<p>Create snappy apps with suggestions computed in 100 ms. </p>
126-
</li>
127-
<li class="block rounded-[1.5em]">
128-
<h1 class="pb-2 sm:pb-4 font-bold text-2xl flex flex-row gap-3 items-center justify-center sm:justify-start">
129-
<svg xmlns="http://www.w3.org/2000/svg" height="32" viewbox="0 -960 960 960" width="32">
130-
<defs>
131-
<lineargradient id="gradientC" xlink:href="#myGradient"
132-
gradienttransform="rotate(50)">
133-
</lineargradient>
134-
</defs>
135-
<path fill="url(#gradientC)"
136-
d="m476-80 182-480h84L924-80h-84l-42-122H604L560-80h-84Zm152-192h144l-70-198h-4l-70 198Zm-468 72-56-56 202-202q-38-42-66.5-87T190-640h84q18 36 38.5 65t49.5 61q44-48 73-98.5T484-720H40v-80h280v-80h80v80h280v80H564q-21 71-57 138t-89 126l96 98-30 82-124-124-200 200Z"></path>
137-
</svg>
138-
<span>Multilingual</span>
139-
</h1>
140-
<p>Find addresses or Points of Interest in any language!</p>
141-
</li>
142-
<li class="block rounded-[1.5em]">
143-
<h1 class="pb-2 sm:pb-4 font-bold text-2xl flex flex-row gap-3 items-center justify-center sm:justify-start">
144-
<svg xmlns="http://www.w3.org/2000/svg" height="32" viewbox="0 -960 960 960" width="32">
145-
<defs>
146-
<lineargradient id="gradientD" xlink:href="#myGradient"
147-
gradienttransform="rotate(90)">
148-
</lineargradient>
149-
</defs>
150-
<path fill="url(#gradientD)"
151-
d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-40-82v-78q-33 0-56.5-23.5T360-320v-40L168-552q-3 18-5.5 36t-2.5 36q0 121 79.5 212T440-162Zm276-102q20-22 36-47.5t26.5-53q10.5-27.5 16-56.5t5.5-59q0-98-54.5-179T600-776v16q0 33-23.5 56.5T520-680h-80v80q0 17-11.5 28.5T400-560h-80v80h240q17 0 28.5 11.5T600-440v120h40q26 0 47 15.5t29 40.5Z"></path>
152-
</svg>
153-
<span>Global</span>
154-
</h1>
155-
<p>Worldwide coverage. Optionally restrict the search to certain areas.</p>
156-
</li>
157-
</ul>
158-
-->
15925
</SiteLayout>

0 commit comments

Comments
 (0)