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

fix: add back reveal animations on index

Browse source
This commit is contained in:
Troy 2025-02-13 12:54:26 +00:00
parent 73c269a59c
commit 0edd672a70
Signed by: troy
GPG key ID: DFC06C02ED3B4711
7 changed files with 17 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/pages/index.astro
View file

@ -27,12 +27,12 @@ const projectsJSON = JSON.stringify(projects);
<Layout title={HOME.TITLE} description={HOME.DESCRIPTION}>
<Hero />
<section aria-labelledby="featured-projects">
<section aria-labelledby="featured-projects" class="animate-reveal opacity-0 [animation-delay:0.1s]">
<div
class="mx-auto flex flex-col items-start justify-between sm:flex-row sm:items-center"
>
<h2
class=" animate-reveal text-2xl font-semibold break-words capitalize opacity-0"
class=" text-2xl font-semibold break-words capitalize "
id="featured-projects"
>
Featured projects
@ -57,16 +57,16 @@ const projectsJSON = JSON.stringify(projects);
<Carousel data={projectsJSON} />
</section>
<section aria-labelledby="recent-posts" class="mt-24">
<section aria-labelledby="recent-posts" class="mt-24 animate-reveal opacity-0 [animation-delay:0.2s]">
<div class="group flex w-fit flex-row items-center">
<h2
class="animate-reveal text-2xl font-semibold break-words capitalize opacity-0"
class="text-2xl font-semibold break-words capitalize"
>
Recent posts
</h2>
</div>
<ol
class="animate-reveal mt-8 grid grid-cols-1 gap-6 opacity-0 [animation-delay:0.3s]"
class="mt-8 grid grid-cols-1 gap-6"
>
{posts.map((post) => <ShowcasePost collection={post} />)}
</ol>

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

@ -15,7 +15,7 @@ const projects = (await getCollection("projects"))
{PROJECTS.TITLE}
</h1>
<ol
class="animate-reveal mt-8 grid grid-cols-2 gap-6 opacity-0 [animation-delay:0.1s] md:grid-cols-3"
class="animate-reveal mt-8 grid grid-cols-2 gap-2 opacity-0 [animation-delay:0.1s] md:grid-cols-3"
>
{projects.map((article: any) => <ShowcaseProject collection={article} />)}
</ol>