abdullahtarawneh.com/layouts/work/list.html

{{ define "main" }}
<main class="work">
	<header id="intro">
		<div class="container">
			<h1 class="tagline">I can help you <em>figure out the hard parts.</em></h1>
			<p class="blurb">Need something done? Perhaps some documentation, a static website, or simply advice on a project? I'm here for you.</p>
			<a href="mailto:a@trwnh.com" class="cta button primary">
				<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><title>email envelope</title><path fill="currentColor" d="M32.33 6a2 2 0 0 0-.41 0h-28a2 2 0 0 0-.53.08l14.45 14.39Z" class="clr-i-solid clr-i-solid-path-1"/><path fill="currentColor" d="m33.81 7.39l-14.56 14.5a2 2 0 0 1-2.82 0L2 7.5a2 2 0 0 0-.07.5v20a2 2 0 0 0 2 2h28a2 2 0 0 0 2-2V8a2 2 0 0 0-.12-.61M5.3 28H3.91v-1.43l7.27-7.21l1.41 1.41Zm26.61 0h-1.4l-7.29-7.23l1.41-1.41l7.27 7.21Z" class="clr-i-solid clr-i-solid-path-2"/><path fill="none" d="M0 0h36v36H0z"/></svg>
				<span>Send a proposal</span>
			</a>
		</div>
	</header>
	<section id="services">
		<div class="container">
			<h2 class="title"></h2>
		</div>
	</section>
	<section class="section" id="process">
		<div class="container">
			<h2 class="title">A <strong>no-nonsense</strong> approach to making things <em>make sense.</em></h2>
			<section>
				<h3 class="subtitle">
					<span class="you">Your</span> needs come first.
				</h3>
				<p class="blurb">We'll sit down and figure out exactly what <span class="you">your</span> problem is, and what <span class="you">your</span> 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">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 <span class="me">knowledgeable</span> person you can <span class="me">trust</span> to do the work <span class="me">right</span>, as well? I'd love to add <em class="you">your</em> praise above.</p>
			<a href="mailto:a@trwnh.com" class="email cta button primary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><title>email envelope</title><path fill="currentColor" d="M32.33 6a2 2 0 0 0-.41 0h-28a2 2 0 0 0-.53.08l14.45 14.39Z" class="clr-i-solid clr-i-solid-path-1"/><path fill="currentColor" d="m33.81 7.39l-14.56 14.5a2 2 0 0 1-2.82 0L2 7.5a2 2 0 0 0-.07.5v20a2 2 0 0 0 2 2h28a2 2 0 0 0 2-2V8a2 2 0 0 0-.12-.61M5.3 28H3.91v-1.43l7.27-7.21l1.41 1.41Zm26.61 0h-1.4l-7.29-7.23l1.41-1.41l7.27 7.21Z" class="clr-i-solid clr-i-solid-path-2"/><path fill="none" d="M0 0h36v36H0z"/></svg><span>Send a proposal</span></a>
		</div>
	</section>
	<section class="section" id="examples">
		<div class="container">
			<h2 class="title">Here's some of my more notable work.</h2>
			<div class="work-items">
			{{ range .Pages }}
				<section class="work-item {{ .Permalink | relURL | anchorize }}">
					<a class="work-item__link" href="{{ .Permalink }}">
						<h3 class="work-item__title">{{ .Title }}</h3>
						{{ with .Resources.GetMatch "cover" }}
						<img class="work-item__image" src="{{ .Permalink }}" alt="">
						{{ end }}
					</a>
					<p class="work-item__summary">{{.Summary}}</p>
			</section>
			{{ end }}
			<section class="your-item">
				<div>
					<h3 class="your-item__title">You could be here.</h3>
				<p class="your-item__summary">I'm currently <strong>available</strong> for work. Let's get in touch.</p>
				<a href="mailto:a@trwnh.com" class="email cta button primary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><title>email envelope</title><path fill="currentColor" d="M32.33 6a2 2 0 0 0-.41 0h-28a2 2 0 0 0-.53.08l14.45 14.39Z" class="clr-i-solid clr-i-solid-path-1"/><path fill="currentColor" d="m33.81 7.39l-14.56 14.5a2 2 0 0 1-2.82 0L2 7.5a2 2 0 0 0-.07.5v20a2 2 0 0 0 2 2h28a2 2 0 0 0 2-2V8a2 2 0 0 0-.12-.61M5.3 28H3.91v-1.43l7.27-7.21l1.41 1.41Zm26.61 0h-1.4l-7.29-7.23l1.41-1.41l7.27 7.21Z" class="clr-i-solid clr-i-solid-path-2"/><path fill="none" d="M0 0h36v36H0z"/></svg><span>Send a proposal</span></a>
				</div>
			</section>
			</div>
		</div>
	</section>
	<section class="section" id="hire-me">
		<div class="container">
			<h2>Got something more permanent in mind?</h2>
			<p>I'm also open to remote work on a 1099 or W2. I'm particularly interested in software and API documentation / technical writing and information architecture!</p>
			<a href="mailto:a@trwnh.com" class="email button primary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 36 36"><title>email envelope</title><path fill="currentColor" d="M32.33 6a2 2 0 0 0-.41 0h-28a2 2 0 0 0-.53.08l14.45 14.39Z" class="clr-i-solid clr-i-solid-path-1"/><path fill="currentColor" d="m33.81 7.39l-14.56 14.5a2 2 0 0 1-2.82 0L2 7.5a2 2 0 0 0-.07.5v20a2 2 0 0 0 2 2h28a2 2 0 0 0 2-2V8a2 2 0 0 0-.12-.61M5.3 28H3.91v-1.43l7.27-7.21l1.41 1.41Zm26.61 0h-1.4l-7.29-7.23l1.41-1.41l7.27 7.21Z" class="clr-i-solid clr-i-solid-path-2"/><path fill="none" d="M0 0h36v36H0z"/></svg><span>Offer me a job</span></a>
			<div class="resume">
				<a href="/resume" class="resume button secondary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><title>personal document</title><path fill="currentColor" d="M13 9h5.5L13 3.5zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m8 18v-1c0-1.33-2.67-2-4-2s-4 .67-4 2v1zm-4-8a2 2 0 0 0-2 2a2 2 0 0 0 2 2a2 2 0 0 0 2-2a2 2 0 0 0-2-2"/></svg><span>Résume (HTML)</span></a>
				<a href="/resume/abdullah-tarawneh_resume.pdf" class="resume button secondary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><title>personal document</title><path fill="currentColor" d="M13 9h5.5L13 3.5zM6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4c0-1.11.89-2 2-2m8 18v-1c0-1.33-2.67-2-4-2s-4 .67-4 2v1zm-4-8a2 2 0 0 0-2 2a2 2 0 0 0 2 2a2 2 0 0 0 2-2a2 2 0 0 0-2-2"/></svg><span>Résume (PDF)</span></a>
			</div>
			<div class="writing-samples">
				<a href="/resume/abdullah-tarawneh_resume.pdf" class="writing-samples button secondary"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><title>writing document</title><path fill="currentColor" d="M12 2v6a2 2 0 0 0 2 2h4.92c-.596.22-1.144.554-1.558.97l-6.05 6.092a2.8 2.8 0 0 0-.728 1.279l-.525 2.03A2.08 2.08 0 0 0 10.3 22H5.5A1.5 1.5 0 0 1 4 20.5v-17A1.5 1.5 0 0 1 5.5 2zm1.5.5V8a.5.5 0 0 0 .5.5h5.5zm-1.304 15.072l5.902-5.902a2.285 2.285 0 1 1 3.233 3.232l-5.903 5.902a2.7 2.7 0 0 1-1.247.707l-1.831.457a1.087 1.087 0 0 1-1.318-1.318l.457-1.83c.118-.473.362-.904.707-1.248"/></svg><span>Tech writing samples (PDF)</span></a>
			</div>
		</div>
	</section>
</main>
{{ end }}