Personal-Site/src/pages/index.astro
Thomas Cole 8c7cec7e7c
All checks were successful
Build Site / Build-Site (18.x) (push) Successful in 49s
Refactor tailwind calsses with the headwind extension
2023-07-30 08:17:02 -04:00

39 lines
1.2 KiB
Plaintext

---
import BlogProjectCard from "../components/misc/BlogProjectCard.astro";
import Divider from "../components/misc/Divider.astro";
import Layout from "../layouts/Layout.astro";
const projects = (await Astro.glob("./projects/**/*.{md,mdx}")).sort(
(a,b) =>
new Date(b.frontmatter.date).valueOf()-
new Date(a.frontmatter.date).valueOf()
).slice(0,5);
---
<Layout>
<main class="flex flex-col w-5/6 m-6 mx-auto sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2">
<section>
<div class="flex flex-row">
<p class="text-5xl sm:text-5xl md:text-5xl lg:text-6xl py-1 font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-[#1f89db] to-[#f42a8b]">Hello World!</p>
</div>
<p class="text-3xl font-semibold">I'm Thomas Cole</p>
<p class="font-thin">Web Developer, System Administrator, Network Engineer</p>
</section>
<div class="divider"/>
<section>
<p class="py-2 text-2xl font-bold sm:text-2xl md:text-2xl lg:text-4xl xl:text-4xl 2xl:text-4xl">Latest Projects</p>
{
projects.map((post) => (
<BlogProjectCard
title={post.frontmatter.title}
subtitle={post.frontmatter.tagline}
image={post.frontmatter.image}
link={post.url}
/>
<div class="divider"/>
))
}
</section>
</main>
</Layout>