troy/troylusty.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

display article description after title (#4)

Browse source 
inspired by https://p.atrick.org
This commit is contained in:
Troy 2024-12-26 22:45:38 +00:00 • committed by GitHub
parent 3aa7ca486b
commit a886bfaa5a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 149 additions and 133 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/pages/cv.astro
View file

@ -14,7 +14,7 @@ import Prose from "@components/Prose.astro";
<div
class="flex flex-col items-start justify-between gap-6 md:flex-row md:items-center"
>
<h1 class="animate-reveal break-words text-4xl font-medium opacity-0">
<h1 class="animate-reveal break-words text-4xl font-semibold opacity-0">
Troy Lusty
</h1>
<div

21
src/pages/index.astro
View file

@ -3,7 +3,8 @@ import Layout from "@layouts/Layout.astro";
import { HOME } from "@consts";
import { getCollection } from "astro:content";
import { Icon } from "astro-icon/components";
import Showcase from "@components/Showcase.astro";
import ShowcaseProject from "@components/ShowcaseProject.astro";
import ShowcasePost from "@components/ShowcasePost.astro";
const posts = (await getCollection("posts"))
.filter((post) => !post.data.draft)
@ -21,7 +22,7 @@ const projects = (await getCollection("projects"))
<div class="group flex flex-row items-center justify-between gap-6">
<a href="/projects">
<h2
class="animate-reveal break-words text-4xl font-medium opacity-0"
class="animate-reveal break-words text-4xl font-semibold opacity-0"
id="featured-projects"
>
Featured projects
@ -38,17 +39,17 @@ const projects = (await getCollection("projects"))
/>
</a>
</div>
<div
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s] md:grid-cols-3 md:[&>*:nth-child(4n+2)]:col-span-2 md:[&>*:nth-child(4n+3)]:col-span-2 md:[&>*:only-child]:col-span-3"
>
{projects.map((project) => <Showcase collection={project} />)}
</div>
{projects.map((project) => <ShowcaseProject collection={project} />)}
</ol>
</section>
<section aria-labelledby="recent-posts">
<div class="group flex flex-row items-center justify-between gap-6">
<a href="/posts">
<h2
class="animate-reveal break-words text-4xl font-medium opacity-0 [animation-delay:0.2s]"
class="animate-reveal break-words text-4xl font-semibold opacity-0 [animation-delay:0.2s]"
id="recent-posts"
>
Recent posts
@ -65,10 +66,10 @@ const projects = (await getCollection("projects"))
/>
</a>
</div>
<div
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.3s] md:grid-cols-3 md:[&>*:nth-child(4n+2)]:col-span-2 md:[&>*:nth-child(4n+3)]:col-span-2 md:[&>*:only-child]:col-span-3"
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.3s]"
>
{posts.map((post) => <Showcase collection={post} />)}
</div>
{posts.map((post) => <ShowcasePost collection={post} />)}
</ol>
</section>
</Layout>

16
src/pages/posts/index.astro
View file

@ -1,11 +1,21 @@
---
import { getCollection } from "astro:content";
import { POSTS } from "@consts";
import ShowcasePage from "@components/ShowcasePage.astro";
import { SITE, POSTS } from "@consts";
import ShowcasePost from "@components/ShowcasePost.astro";
import Layout from "@layouts/Layout.astro";
const posts = (await getCollection("posts"))
.filter((post) => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
---
<ShowcasePage content={posts} CONSTS={POSTS} />
<Layout title={SITE.TITLE} description={POSTS.DESCRIPTION}>
<h1 class="animate-reveal break-words text-4xl font-semibold opacity-0">
{POSTS.TITLE}
</h1>
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s]"
>
{posts.map((article: any) => <ShowcasePost collection={article} />)}
</ol>
</Layout>

16
src/pages/projects/index.astro
View file

@ -1,11 +1,21 @@
---
import { getCollection } from "astro:content";
import { PROJECTS } from "@consts";
import ShowcasePage from "@components/ShowcasePage.astro";
import { PROJECTS, SITE } from "@consts";
import Layout from "@layouts/Layout.astro";
import ShowcaseProject from "@components/ShowcaseProject.astro";
const projects = (await getCollection("projects"))
.filter((project) => !project.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
---
<ShowcasePage content={projects} CONSTS={PROJECTS} />
<Layout title={SITE.TITLE} description={PROJECTS.DESCRIPTION}>
<h1 class="animate-reveal break-words text-4xl font-semibold opacity-0">
{PROJECTS.TITLE}
</h1>
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s] md:grid-cols-3 md:[&>*:nth-child(4n+2)]:col-span-2 md:[&>*:nth-child(4n+3)]:col-span-2 md:[&>*:only-child]:col-span-3"
>
{projects.map((article: any) => <ShowcaseProject collection={article} />)}
</ol>
</Layout>