{{ define "main" }}
<main id="work">
	<header class="section" id="intro">
		<div class="container">
			<h1 class="tagline">i can help you<br> <em>figure out the hard parts.</em></h1>
			<p class="blurb">need something done? perhaps a website, some documentation, or simply advice on a project? i'm here for you.</p>
			<a href="mailto:a@trwnh.com" class="primary button"><svg version="1.1" viewBox="0 -256 1850 1850" width=16 height=16 xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <g transform="matrix(1 0 0 -1 30.373 1252.3)"> <path d="m1792 826v-794q0-66-47-113t-113-47h-1472q-66 0-113 47t-47 113v794q44-49 101-87 362-246 497-345 57-42 92.5-65.5t94.5-48 110-24.5h2q51 0 110 24.5t94.5 48 92.5 65.5q170 123 498 345 57 39 100 87zm0 294q0-79-49-151t-122-123q-376-261-468-325-10-7-42.5-30.5t-54-38-52-32.5-57.5-27-50-9h-2q-23 0-50 9t-57.5 27-52 32.5-54 38-42.5 30.5q-91 64-262 182.5t-205 142.5q-62 42-117 115.5t-55 136.5q0 78 41.5 130t118.5 52h1472q65 0 112.5-47t47.5-113z" fill="currentColor"/> </g> </svg><span>email me</span></a>
		</div>
	</header>
	<section class="section" id="process">
		<div class="container">
			<h2 class="title"><a href="#process">#</a>a <strong>no-nonsense</strong> approach <br>to making things <em>make sense.</em></h2>
			<section>
				<h3 class="subtitle">
					your needs come first.
				</h3>
				<p class="blurb">we'll sit down and figure out <br>exactly what your problem is, <br>and what your requirements are.</p>
			</section>
			<section>
				<h3 class="subtitle">
					
				</h3>
				<p class="blurb"></p>
			</section>
		</div>
	</section>
	<section class="section" id="praise">
		<div class="container">
			<h2 class="title"><a href="#praise">#</a>what others have said:</h2>
			<div class="testimonials">
				<div class="testimonial">
					{{ template "shortcodes/people/khalil.html" . }}
					<p class="name">Khalil Saadiq,<br>former classmate</p>
					<blockquote class="bubble">it's scary how much you know.</blockquote>
				</div>
				<div class="testimonial">
					{{ template "shortcodes/people/gargron.html" . }}
					<p class="name">Eugen Rochko,<br>Mastodon developer</p>
					<blockquote class="bubble">bless you for being here to work on the docs btw. it's a big relief.</blockquote>
				</div>
				<div class="testimonial">
					{{ template "shortcodes/people/dansup.html" . }}
					<p class="name">Daniel Supernault,<br>Pixelfed developer</p>
					<blockquote class="bubble">i don't trust anyone as much as you to shape the direction of the project.</blockquote>
				</div>
			</div>
		</div>
	</section>
	<section class="section" id="interstitial">
		<div class="container">
			<h2 class="title">i bet i can make <em class="you">you</em> feel the same way.</h2>
			<p class="blurb">do you want a <strong>knowledgeable</strong> person you can <strong>trust</strong> to do the work <strong>right</strong>, as well? i'd love to add <em class="you">your</em> praise above.</p>
			<a href="mailto:a@trwnh.com" class="email button primary"><svg version="1.1" viewBox="0 -256 1850 1850" width=16 height=16 xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <g transform="matrix(1 0 0 -1 30.373 1252.3)"> <path d="m1792 826v-794q0-66-47-113t-113-47h-1472q-66 0-113 47t-47 113v794q44-49 101-87 362-246 497-345 57-42 92.5-65.5t94.5-48 110-24.5h2q51 0 110 24.5t94.5 48 92.5 65.5q170 123 498 345 57 39 100 87zm0 294q0-79-49-151t-122-123q-376-261-468-325-10-7-42.5-30.5t-54-38-52-32.5-57.5-27-50-9h-2q-23 0-50 9t-57.5 27-52 32.5-54 38-42.5 30.5q-91 64-262 182.5t-205 142.5q-62 42-117 115.5t-55 136.5q0 78 41.5 130t118.5 52h1472q65 0 112.5-47t47.5-113z" fill="currentColor"/> </g> </svg> Email me</a>
		</div>
	</section>
	<section class="section" id="timeline">
		<div class="container">
			<h2 class="title"><a href="#timeline">#</a>here's a timeline of work i've done.</h2>
			<div class="timeline">
			{{ range .Pages.ByDate }}
				<article class="timeline-item {{ .Permalink | relURL | anchorize }}">
					<span class="timeline-item__daterange">
						<datetime class="timeline-item__date">{{ .Params.start }}</datetime> – <datetime class="timeline-item__date">{{ .Params.end }}</datetime>
					</span>
					<span class="timeline-item__at">at {{ .Params.at }}</span>
				<h3 class="timeline-item__title">{{ .Params.position }}</h3>
				<p class="timeline-item__summary">{{.Summary}}</p>
				<a class="timeline-item__readmore button primary" href="{{ .Permalink }}">Read more...</a>
			</article>
			{{ end }}
			<section class="you timeline-item" id="hireme">
				<span class="timeline-item__daterange">Today</span>
				<span class="timeline-item__at">at your service</span>
				<h3 class="timeline-item__title">You could be here.</h3>
				<p class="timeline-item__summary">i'm currently <strong>available</strong> for work. let's get in touch.</p>
			</section>
			</div>
		</div>
	</section>
	<section class="section" id="cta">
		<div class="container">
			<div class="buttons">
				<a href="mailto:a@trwnh.com" class="email button primary"><svg version="1.1" viewBox="0 -256 1850 1850" width=16 height=16 xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <g transform="matrix(1 0 0 -1 30.373 1252.3)"> <path d="m1792 826v-794q0-66-47-113t-113-47h-1472q-66 0-113 47t-47 113v794q44-49 101-87 362-246 497-345 57-42 92.5-65.5t94.5-48 110-24.5h2q51 0 110 24.5t94.5 48 92.5 65.5q170 123 498 345 57 39 100 87zm0 294q0-79-49-151t-122-123q-376-261-468-325-10-7-42.5-30.5t-54-38-52-32.5-57.5-27-50-9h-2q-23 0-50 9t-57.5 27-52 32.5-54 38-42.5 30.5q-91 64-262 182.5t-205 142.5q-62 42-117 115.5t-55 136.5q0 78 41.5 130t118.5 52h1472q65 0 112.5-47t47.5-113z" fill="currentColor"/> </g> </svg> Email me</a>
				<a href="https://resume.abdullahtarawneh.com" class="resume button secondary"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" width=16 height=16><path d="M528 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h480c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm0 400H303.2c.9-4.5.8 3.6.8-22.4 0-31.8-30.1-57.6-67.2-57.6-10.8 0-18.7 8-44.8 8-26.9 0-33.4-8-44.8-8-37.1 0-67.2 25.8-67.2 57.6 0 26-.2 17.9.8 22.4H48V144h480v288zm-168-80h112c4.4 0 8-3.6 8-8v-16c0-4.4-3.6-8-8-8H360c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8zm0-64h112c4.4 0 8-3.6 8-8v-16c0-4.4-3.6-8-8-8H360c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8zm0-64h112c4.4 0 8-3.6 8-8v-16c0-4.4-3.6-8-8-8H360c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8zm-168 96c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64z"/></svg> Résume (HTML)</a>
				<a href="https://resume.abdullahtarawneh.com/resume.pdf" class="resume button secondary"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" width=16 height=16><path d="M224 136V0H24C10.7 0 0 10.7 0 24v464c0 13.3 10.7 24 24 24h336c13.3 0 24-10.7 24-24V160H248c-13.2 0-24-10.8-24-24zm76.45 211.36l-96.42 95.7c-6.65 6.61-17.39 6.61-24.04 0l-96.42-95.7C73.42 337.29 80.54 320 94.82 320H160v-80c0-8.84 7.16-16 16-16h32c8.84 0 16 7.16 16 16v80h65.18c14.28 0 21.4 17.29 11.27 27.36zM377 105L279.1 7c-4.5-4.5-10.6-7-17-7H256v128h128v-6.1c0-6.3-2.5-12.4-7-16.9z"/></svg> Résume (PDF)</a>
				</div>
		</div>
	</section>
</main>
{{ end }}