/
index.html
76 lines (69 loc) · 4.23 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
---
layout: home-portfolio
---
<p class="text-center m-0 pt-32 md:pt-48 px-4 pb-4 text-6xl font-black lh-64">Product Designer</p>
<p class="mx-auto px-4 pb-16 md:pb-32 sm:text-lg" style="max-width: 390px;">
My name is Webb. I design
<span class="typed-text"></span>
<span class="typed-cursor">|</span>
</p>
<section id="work-samples" class="pt-10">
<div class="grid lg:grid-cols-3 items-center border-t border-b border-gray-200 dark:border-gray-900 lg:px-24 py-16 text-center lg:text-left gap-6 lg:gap-10">
<picture class="mx-auto col-span-2 lg:col-span-1 justify-self-center w-40 lg:w-56">
<source
srcset="https://user-images.githubusercontent.com/178044/112753089-758be900-8f93-11eb-8afe-2e91af5b5276.png"
media="(prefers-color-scheme: dark)">
<img src="https://user-images.githubusercontent.com/178044/112753081-6a38bd80-8f93-11eb-9fee-b5ef75a7a0c8.png" alt= "Moov logo">
</picture>
<div class="col-span-2">
<span class="inline-block text-gray-600 text-xs">2021 - present</span>
<h2 class="text-4xl">Moov</h2>
<p class="mb-3 text-lg">Delivering an amazing developer experience.</p>
<span class="text-gray-500" href="work/truecoach">Coming soon</span>
</div>
</div>
<div class="grid lg:grid-cols-3 items-center border-t border-b border-gray-200 dark:border-gray-900 lg:px-24 py-16 text-center lg:text-left gap-6 lg:gap-10">
<a href="work/truecoach" class="mx-auto col-span-2 lg:col-span-1">
<img class="justify-self-center w-40 lg:w-56" src="https://user-images.githubusercontent.com/178044/96371311-4f2d6c00-111e-11eb-9d79-6470d21b1193.png" alt="TrueCoach logo" />
</a>
<div class="col-span-2">
<span class="inline-block text-gray-600 text-xs">2017 - 2020</span>
<h2 class="text-4xl"><a class="link--text" href="work/truecoach">TrueCoach</a></h2>
<p class="mb-3 text-lg">Enabling fitness coaches to manage & grow their business.</p>
<a class="link--highlight text-lg" href="work/truecoach">View projects</a>
</div>
</div>
<div class="grid lg:grid-cols-3 items-center border-b border-gray-200 dark:border-gray-900 lg:px-24 py-16 text-center lg:text-left gap-6 lg:gap-10">
<a href="work/bonusly" class="mx-auto col-span-2 lg:col-span-1">
<img class="justify-self-center w-40 lg:w-56" src="/assets/img/bonusly.svg" alt="Bonusly logo" />
</a>
<div class="col-span-2">
<span class="inline-block text-gray-600 text-xs">2017</span>
<h2 class="text-4xl"><a class="link--text" href="work/bonusly">Bonusly</a></h2>
<p class="mb-3 text-lg">Helping users understand their options and make better purchasing decisions.</p>
<a class="link--highlight text-lg" href="work/bonusly">View project</a>
</div>
</div>
<div class="grid lg:grid-cols-3 items-center border-b border-gray-200 dark:border-gray-900 lg:px-24 py-16 text-center lg:text-left gap-6 lg:gap-10">
<a href="work/sendgrid" class="mx-auto col-span-2 lg:col-span-1">
<img class="justify-self-center w-40 lg:w-56" src="https://cloud.githubusercontent.com/assets/178044/24669962/97580832-1929-11e7-931a-adad9155cd34.png" alt="Sendgrid logo" />
</a>
<div class="col-span-2">
<span class="inline-block text-gray-600 text-xs">2017</span>
<h2 class="text-4xl"><a class="link--text" href="work/sendgrid">SendGrid</a></h2>
<p class="mb-3 text-lg">Improving the email marketing experience.</p>
<a class="link--highlight text-lg" href="work/sendgrid">View project</a>
</div>
</div>
<div class="grid lg:grid-cols-3 items-center border-b border-gray-200 dark:border-gray-900 lg:px-24 py-16 text-center lg:text-left gap-6 lg:gap-10">
<a href="work/foxden" class="mx-auto col-span-2 lg:col-span-1">
<img class="justify-self-center w-40 lg:w-56" src="https://cloud.githubusercontent.com/assets/178044/24670825/dc0b3442-192c-11e7-8a26-da4516d688e7.png" alt="Foxden logo" />
</a>
<div class="col-span-2">
<span class="inline-block text-gray-600 text-xs">2016</span>
<h2 class="text-4xl"><a class="link--text" href="work/foxden">Foxden</a></h2>
<p class="mb-3 text-lg">Building a mobile and in-room meeting platform.</p>
<a class="link--highlight text-lg" href="work/foxden">View projects</a>
</div>
</div>
</section>