29 lines
1.2 KiB
HTML
29 lines
1.2 KiB
HTML
|
{{template "head" .}}
|
||
|
|
{{template "site_header" .}}
|
||
|
|
<main class="mx-auto max-w-7xl px-5 pb-24 pt-32 md:px-8 md:pt-40">
|
||
|
|
<div class="mb-10 flex flex-col gap-4 md:flex-row md:items-end md:justify-between">
|
||
|
|
<div>
|
||
|
|
<p class="mb-3 text-sm uppercase tracking-[0.2em] text-neutral-500">Selected work</p>
|
||
|
|
<h1 class="text-5xl font-semibold md:text-7xl">Projects</h1>
|
||
|
|
</div>
|
||
|
|
<p class="max-w-md text-neutral-600">A visual index of architectural and interior design work.</p>
|
||
|
|
</div>
|
||
|
|
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
|
||
|
|
{{range .Projects}}
|
||
|
|
<a href="/projects/{{.Slug}}" class="group block">
|
||
|
|
<div class="aspect-square overflow-hidden bg-neutral-200">
|
||
|
|
<img src="{{.CoverImage}}" alt="{{.Title}}" class="h-full w-full object-cover transition duration-500 group-hover:scale-105">
|
||
|
|
</div>
|
||
|
|
<div class="mt-3">
|
||
|
|
<h2 class="text-lg font-medium">{{.Title}}</h2>
|
||
|
|
<p class="text-sm text-neutral-500">{{.Location}} · {{.Year}}</p>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
{{end}}
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
{{template "footer" .}}
|
||
|
|
<div id="overlay-root"></div>
|
||
|
|
</body>
|
||
|
|
</html>
|