| 1 | --- |
| 2 | import { getCollection } from "astro:content"; |
| 3 | import PageLayout from "@/layouts/Base"; |
| 4 | import PostPreview from "@/components/blog/PostPreview"; |
| 5 | import SocialList from "@/components/SocialList"; |
| 6 | import { sortMDByDate } from "@/utils"; |
| 7 | |
| 8 | const MAX_POSTS = 10; |
| 9 | const allPosts = await getCollection("post"); |
| 10 | const allPostsByDate = sortMDByDate(allPosts).slice(0, MAX_POSTS); |
| 11 | --- |
| 12 | |
| 13 | <PageLayout meta={{ title: "Home" }}> |
| 14 | <section> |
| 15 | <h1 class="title mb-6">Hey there!</h1> |
| 16 | <p class="mb-4"> |
| 17 | My name is Steve. I'm a developer, technical writer, and creator with a desire to help build |
| 18 | the future of the web. Stay a while to see what I'm working on! |
| 19 | </p> |
| 20 | <SocialList /> |
| 21 | <p>Or anywhere with my handle <span class="text-accent">@stevedylandev</span></p> |
| 22 | </section> |
| 23 | <section aria-label="Blog post list" class="mt-16"> |
| 24 | <h2 class="title mb-4 text-xl">Posts</h2> |
| 25 | <ul class="space-y-4 sm:space-y-2"> |
| 26 | { |
| 27 | allPostsByDate.map((p) => ( |
| 28 | <li class="flex flex-col gap-x-2 sm:flex-row"> |
| 29 | <PostPreview post={p} /> |
| 30 | </li> |
| 31 | )) |
| 32 | } |
| 33 | </ul> |
| 34 | </section> |
| 35 | <section class="mt-16"> |
| 36 | <h2 class="title mb-4 text-xl">Extras</h2> |
| 37 | <ul class="space-y-4 sm:space-y-2"> |
| 38 | <li> |
| 39 | <a |
| 40 | href="https://stevedylanphoto.com" |
| 41 | target="_blank" |
| 42 | rel="noopener noreferrer" |
| 43 | class="cactus-link inline-block" |
| 44 | >stevedylanphoto |
| 45 | </a>: |
| 46 | <p class="inline-block sm:mt-2">My personal photography portfolio</p> |
| 47 | </li> |
| 48 | <li> |
| 49 | <a |
| 50 | href="https://pinata.cloud" |
| 51 | target="_blank" |
| 52 | rel="noopener noreferrer" |
| 53 | class="cactus-link inline-block" |
| 54 | >Pinata |
| 55 | </a>: |
| 56 | <p class="inline-block sm:mt-2">Where I'm currently working as Head of Community</p> |
| 57 | </li> |
| 58 | <li> |
| 59 | <a |
| 60 | href="https://medium.com/@stevedsimkins" |
| 61 | target="_blank" |
| 62 | rel="noopener noreferrer" |
| 63 | class="cactus-link inline-block" |
| 64 | >Medium |
| 65 | </a>: |
| 66 | <p class="inline-block sm:mt-2">Technical blog posts I've written for Pinata</p> |
| 67 | </li> |
| 68 | <li> |
| 69 | <a |
| 70 | href="https://substack.com/profile/92321712-steve" |
| 71 | target="_blank" |
| 72 | rel="noopener noreferrer" |
| 73 | class="cactus-link inline-block" |
| 74 | >Substack |
| 75 | </a>: |
| 76 | <p class="inline-block sm:mt-2">A place where I write a little bit of everthing</p> |
| 77 | </li> |
| 78 | </ul> |
| 79 | </section> |
| 80 | </PageLayout> |