{{ define "main" }}
    <div class="panel space-y-2">
        <h1>Blog Posts</h1>
        <p>Here is an archive of articles I've written over the years. Some will be technical, and some will be more personal.</p>
    </div>
	{{ range .Pages.ByPublishDate.Reverse }}
	<div class="panel my-2">
		<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
		<div class="flex flex-row flex-wrap md:flex-nowrap mt-2">
			<span class="image-wrapper w-full h-32 md:w-32 md:h-32">
				<img srcset="/imgs/no-image-new.webp" src="/imgs/no-image-new.png" alt="Filler" />
			</span>
			<p class="m-2 flex-1">{{ .Params.Intro | markdownify }}</p>
		</div>
	</div>
	{{ end }}
{{ end }}