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

remove top margin on article collections

Browse source
This commit is contained in:
Troy 2025-01-27 11:44:27 +00:00
parent c52e42a57f
commit 125f904b15
Signed by: troy
GPG key ID: DFC06C02ED3B4711
5 changed files with 15 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/ShowcaseProject.astro
View file

@ -27,12 +27,12 @@ const { collection } = Astro.props;
href={`/${collection.collection}/${collection.slug}`}
aria-label={collection.data.title}></a>
<h3
class="text-primary dark:text-secondary z-10 w-fit text-xl font-semibold opacity-0 transition-opacity duration-300 group-hover:opacity-100"
class="text-white z-10 w-fit text-xl font-semibold opacity-0 transition-opacity duration-300 group-hover:opacity-100"
>
{collection.data.title}
</h3>
<div
class="text-accent z-10 w-fit gap-y-1 overflow-hidden text-sm leading-6 opacity-0 transition-opacity duration-500 group-hover:opacity-100"
class="text-neutral-400 z-10 w-fit gap-y-1 overflow-hidden text-sm leading-6 opacity-0 transition-opacity duration-500 group-hover:opacity-100"
>
{
collection.data.collection ? (

4
src/pages/index.astro
View file

@ -25,7 +25,7 @@ const projects = allProjects
<Layout title={HOME.TITLE} description={HOME.DESCRIPTION}>
<Hero />
<section aria-labelledby="featured-projects">
<div class="group flex w-fit flex-row items-center justify-between gap-6">
<div class="group flex w-fit flex-row items-center">
<a href="/projects">
<h2
class="animate-reveal group-hover:text-tertiary text-2xl font-semibold break-words capitalize opacity-0 transition-colors duration-500"
@ -49,7 +49,7 @@ const projects = allProjects
}
</section>
<section aria-labelledby="recent-posts">
<div class="group flex w-fit flex-row items-center justify-between gap-6">
<div class="group flex w-fit flex-row items-center">
<a href="/posts">
<h2
class="animate-reveal group-hover:text-tertiary text-2xl font-semibold break-words capitalize opacity-0 transition-colors duration-500 [animation-delay:0.2s]"

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

@ -14,7 +14,7 @@ const posts = (await getCollection("posts"))
{POSTS.TITLE}
</h1>
<ol
class="animate-reveal mt-16 grid grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s]"
class="animate-reveal grid grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s]"
>
{posts.map((article: any) => <ShowcasePost collection={article} />)}
</ol>

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

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

17
src/styles/global.css
View file

@ -21,6 +21,7 @@
--animate-gradient-x: gradient-x 6s ease infinite;
--animate-gradient-y: gradient-y 6s ease infinite;
--animate-gradient-xy: gradient-xy 6s ease infinite;
@keyframes reveal {
0% {
opacity: 0;
@ -79,18 +80,18 @@
}
:root {
--primary: oklch(99% 0 0);
--secondary: oklch(15% 0 0);
--tertiary: oklch(40% 0 0);
--accent: oklch(25% 0 0);
--primary: var(--color-neutral-50);
--secondary: var(--color-neutral-950);
--tertiary: var(--color-neutral-500);
--accent: var(--color-neutral-700);
}
@media (prefers-color-scheme: dark) {
:root {
--primary: oklch(0% 0 0);
--secondary: oklch(95% 0 0);
--tertiary: oklch(60% 0 0);
--accent: oklch(75% 0 0);
--primary: var(--color-black);
--secondary: var(--color-neutral-50);
--tertiary: var(--color-neutral-500);
--accent: var(--color-neutral-300);
}
.astro-code,