-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
145 lines (128 loc) · 10.6 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
---
layout: default
---
<div class="page">
<header class="section section-top" role="banner" vocab="http://schema.org/" typeof="Person">
<strong class="logo no-mark-link">
<svg class="rocket-img" viewBox="0 0 138 256">
<path class="rocket" d="M121.1 187.4l-18.2-30c3.4-11.6 6-24.6 6-37.3 0-1.7 0-3.3-.1-5-1.9-33.5-14.8-45.6-24.5-55.2-4.6-4.6-8.1-8.5-10.6-14.1 0-.1-.1-.2-.1-.3 1.7-.3 3.1-.7 4.1-1.4 1.8-1.1 2.7-2.9 2.7-5.1l-.5-1.2c-.9-.8-3.2-1.3-6.9-1.4-.3-2-.3-3.9.1-6.5.1-1.2.1-1.2 1.8-1.3h.3c1.2-.1 1.7-.8 2-1.3.7-1.3-.2-2.8-.7-3.7l-.2-.3-.3-.6c-2.6-6.4-3.9-10.9-3.9-13.4 0-3.2-.8-4-1.4-4.4-.5-.3-1.1-.3-1.6 0-.3.2-1.4.8-1.4 4.4 0 1.7-.7 5.4-4 13.6l-.2.4-.2.3c-.4.7-1 1.7-1 2.7 0 .3.1.7.2 1 .2.5.8 1.1 2 1.3h.3c1.6.2 1.6.2 1.8 1.3.2 1.5.3 2.8.3 3.9 0 .9-.1 1.7-.2 2.5-3.8.2-6.1.6-6.9 1.4l-.3 1.3c0 2.2.9 4 2.7 5.1 1 .7 2.4 1.1 4.1 1.4 0 .1-.1.2-.1.3-2.4 5.6-6.4 9.6-11.1 14.3-9.7 9.6-22.6 21.6-24.4 55-.1 1.7-.1 3.3-.1 5 0 12.7 2.6 25.7 6 37.3l-18.2 30-11 63.9h12.5l11.6-40.6L51 194.3l.7.3c.7.3 1.4.5 2.1.7.3 2 .7 4.2 1 5.5.2 1 .7 3.5 9.8 4.1v46.4h10.3V205c9.6-.6 10.1-3.1 10.3-4.1.3-1.3.6-3.5 1-5.5.8-.2 1.5-.4 2.1-.7l.4-.2 19.4 16.2 11.6 40.6h12.5l-11.1-63.9zm-38.9-2l-.4 1c-1.7.3-4.3.7-8.1 1h-7.5c-4.1-.3-6.8-.7-8.5-1.1v-.1l-.3-.8c-5.1-11.9-17-39.8-17-65.4 0-1.5 0-3 .1-4.5 1.6-28.7 11.8-38.9 20.8-47.9l.8-.8c2.7-2.7 5.5-5.5 7.9-8.6 2.4 3.2 5 5.9 7.5 8.5l.8.8c9 9 19.2 19.2 20.9 48.1.1 1.5.1 3 .1 4.5-.1 25.5-12 53.4-17.1 65.3z"/>
</svg>
</strong>
<div class="wrapper">
<h1 class="exa text-dark" tabindex="0" property="name"><span>Thomas J Bradley</span></h1>
<p class="giga text-medium" property="description"><strong>I believe that everybody should perpetually learn, try, build, break, & fix things—the Open Web is the perfect platform for exactly that.</strong></p>
<p class="link giga push-1-2"><a href="mailto:[email protected]" property="email">[email protected]</a></p>
<ul class="giga push-1-2 list-group social-links">
<li class="link push-1-4"><a href="https://github.com/thomasjbradley" rel="external">GitHub</a></li>
<li class="link push-1-4"><a href="https://keybase.io/thomasjbradley" rel="external">Keybase</a></li>
</ul>
</div>
<div class="photo me">
<img class="flex" src="img/thomasjbradley.jpg" alt="Me smiling and looking dapper." property="image">
</div>
<div hidden property="address" typeof="PostalAddress">
<meta property="addressLocality" content="Ottawa">
<meta property="addressRegion" content="Ontario">
<meta property="addressCountry" content="Canada">
</div>
</header>
<main class="grid grid-stretch" role="main">
<div class="unit [ xs-1 s-1 m-1 l-1-2 ] section section-prof">
<section class="wrapper">
<h2 class="tera text-dark" tabindex="0">Professor</h2>
<p class="mega">Learning new stuff kicks ass. I want to inspire the passion for learning and creating in others—the best way to do that is to teach.</p>
<p class="text-light">Professor of web development in the <a href="http://algonquindesign.ca" rel="external">Graphic Design</a> program at <a href="http://www.algonquincollege.com/" rel="external">Algonquin College</a>, Ottawa, Canada.</p>
<ul class="mega push-0 list-group clearfix">
<li class="link link-short push-1-4"><a href="http://learn-the-web.algonquindesign.ca" rel="external">Learn the Web</a></li>
<li class="link link-short push-1-4"><a href="https://www.youtube.com/user/acinteractivedesign" rel="external">Screencasts</a></li>
<li class="link link-short push-1-4"><a href="http://activities.learn-the-web.algonquindesign.ca" rel="external">Learning Activities</a></li>
<li class="link link-short push-1-4"><a href="http://algonquindesign.ca" rel="external">Algonquin Design</a></li>
</ul>
</section>
</div>
<div class="unit [ xs-1 s-1 m-1 l-1-2 ] section section-dev">
<section class="wrapper">
<h2 class="tera text-dark" tabindex="0">Developer</h2>
<p class="mega">The Web empowers humans in every nook and cranny of the world, and I endeavour to make elegant and accessible web projects—for every human.</p>
<ul class="mega push-0 list-group clearfix">
<li class="link link-short push-1-4"><a href="https://github.com/thomasjbradley/markbot/" rel="external">Markbot</a></li>
<li class="link push-1-4"><a href="http://elizabethandjane.ca/" rel="external spouse">elizabeth&jane photography</a></li>
<li class="link link-short push-1-4"><a href="https://web-dev.tools" rel="external">Web Dev Tools</a></li>
<li class="link link-short push-1-4"><a href="https://github.com/thomasjbradley/todosaurus" rel="external">Todosaurus</a></li>
<li class="link link-short push-1-4"><a href="https://github.com/thomasjbradley/spritebot/" rel="external">Spritebot</a></li>
<li class="link link-short push-1-4"><a href="https://github.com/thomasjbradley/jekyll_patternbot/" rel="external">Patternbot</a></li>
</ul>
</section>
</div>
<div class="unit [ xs-1 s-1 m-1 l-1-2 ] section section-write">
<section class="wrapper">
<h2 class="tera text-dark" tabindex="0">Author</h2>
<p class="mega">I create punctuated phrases, either in the English language or in a programming language—the keyboard is my bestie.</p>
<ul class="mega push-0 list-group clearfix">
<li class="link push-1-4"><a href="https://17thousandpages.ca/" rel="external">17 Thousand Pages</a></li>
<li class="link push-1-4"><a href="https://www.goodreads.com/author/show/3917042.Thomas_J_Bradley" rel="external">Goodreads</a></li>
<li class="link push-1-4"><a href="https://17thousandpages.ca/books/accidental-adventures-mariska-arisia/" rel="external">The Accidental Adventures of Mariska Arisia</a></li>
<li class="link push-1-4"><a href="http://www.blurb.ca/b/393229-bartholomew-the-bragging-bullfrog" rel="external">Bartholomew the Bragging Bullfrog</a></li>
<li class="link push-1-4"><a href="http://www.blurb.ca/b/435077-high-low-over-under" rel="external">High, Low, Over & Under</a></li>
</ul>
</section>
</div>
<div class="unit [ xs-1 s-1 m-1 l-1-2 ] section section-nerd">
<section class="wrapper">
<h2 class="tera text-dark" tabindex="0">Nerd</h2>
<p class="mega">Obviously! I’d probably consider myself a super nerd. I love sci-fi, Star Wars, Doctor Who, Firefly, Star Trek, Ghostbusters, Godzilla, science, space, and—of course, dinosaurs.</p>
<ul class="mega push-0 list-group clearfix">
<li class="link push-1-4"><a href="https://boardgamegeek.com/collection/user/thomasjbradley" rel="external">Board Games</a></li>
<li class="link push-1-4"><a href="https://www.instagram.com/p/BrqARmdF-6I/" rel="external">Book Nook</a> <a href="https://www.instagram.com/p/Bs4XPIxFkRf/">by the Fire</a></li>
<li class="link push-1-4">
<a href="https://www.pinterest.com/thomasjbradley/" rel="external">Pinterest</a>
(<a href="https://www.pinterest.com/thomasjbradley/sci-fi-battles/" rel="external">Space Battles!</a>)
</li>
<li class="link push-1-4"><a href="http://groundhogdayroundup.ca/" rel="external">Ground Hog Day Roundup</a></li>
<li class="link push-1-4"><a href="https://www.flickr.com/photos/thomasjbradley" rel="external">Lego Creations</a></li>
</ul>
</section>
</div>
<div class="unit [ xs-1 ] section section-family">
<section class="grid grid-middle">
<div class="unit [ xs-1 s-1 m-1 l-1-2 unit-push-l-1-4 ] wrapper">
<h2 class="tera text-dark" tabindex="0">Family man</h2>
<p class="mega">My favourite person in the world is my partner in crime, Liz. Together we have four kids — one of which is not a dog.</p>
<ul class="mega push-0 list-group clearfix">
<li class="link push-1-4"><a href="http://lizandthomasgotmarried.ca/" rel="external">Liz & Thomas Got Married</a></li>
<li class="link push-1-4"><a href="https://elizabethandjane.ca/2016/05/ottawa-family-photographer-ourfamily-spring-blossoms/" rel="external">Liz & Thomas Had a Kid</a></li>
</ul>
</div>
<div class="unit [ xs-1-2 s-1-2 m-1-2 l-1-4 unit-pull-l-1-2 ] photo-wrapper">
<div class="photo photo-family">
<img class="flex" src="img/liz-thomas-edith.jpg" alt="Liz in a Yoda hoodie, me in a TaunTaun hoddie, and Edith as Chewbacca.">
</div>
</div>
<div class="unit [ xs-1-2 s-1-2 m-1-2 l-1-4 ] photo-wrapper">
<div class="photo photo-family">
<img class="flex" src="img/paddy-welly-cordy.jpg" alt="Our three dogs: Paddington, Wellington, and Corduroy.">
</div>
</div>
</section>
</div>
</main>
<footer class="section section-bottom text-light grid">
<div class="unit [ xs-1 s-1 m-1-2 l-1-2 ] wrapper footer-details">
<small class="micro block push-0"><strong>No tracking, <a href="https://en.wikipedia.org/wiki/Veganism" rel="external">No animals harmed</a>, <a href="https://pgp.mit.edu/pks/lookup?op=get&search=0x315449230C25CE99" rel="external">GPG Public Key</a></strong></small>
<dl class="micro push-0">
<dt>Source code:</dt>
<dd><a href="https://github.com/thomasjbradley/thomasjbradley.ca" rel="external">GitHub</a></dd>
<dt>Tools:</dt>
<dd><a href="https://www.sublimetext.com/" rel="external">Sublime Text</a> + <a href="https://github.com/guillermooo/Vintageous" rel="external">Vintageous</a>, <a href="http://jekyllrb.com/" rel="external">Jekyll</a>, <a href="https://github.com/postcss/postcss" rel="external">PostCSS</a></dd>
<dt>Hosting & domains:</dt>
<dd><a href="https://www.keycdn.com/" rel="external">KeyCDN</a>, <a href="https://www.cloudflare.com/" rel="external">CloudFlare</a>, <a href="https://www.hover.com/" rel="external">Hover</a></dd>
</dl>
</div>
<div class="unit [ xs-1 s-1 m-1-2 l-1-2 ] wrapper footer-copyright">
<small class="micro block push-0">Text, graphics & design © Thomas J Bradley</small>
<small class="micro block push-0">Code licensed under the <a href="https://github.com/thomasjbradley/thomasjbradley.ca/blob/gh-pages/LICENSE" rel="license">MIT License</a></small>
<small class="micro block push-0">Dog photo © <a href="http://www.jenniferbaileyphotography.com" rel="external">Jennifer Bailey Photography</a></small>
<small class="micro block push-0">Other photos © <a href="http://elizabethandjane.ca" rel="external">elizabeth&jane photography</a></small>
</div>
</footer>
</div>