marsultor/public-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

blog: sharpen cards, search, toc

Browse Source
This commit is contained in:
kbot
2026-07-06 22:06:32 -05:00
parent ca4885301a
commit 76676ddfed
3 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/posts/PostCard.tsx
View File

@@ -15,11 +15,11 @@ export function PostCard({ slug, title, date, excerpt, tags = [], author, readin
whileHover={shouldReduceMotion ? undefined : { y: -2 }}
transition={{ duration: 0.35, delay: shouldReduceMotion ? 0 : Math.min(index * 0.04, 0.18), ease: [0.22, 1, 0.36, 1] }}
viewport={{ once: true, amount: 0.2 }}
className="group relative scroll-mt-20 rounded-2xl border border-border/90 bg-canvas p-5 shadow-card transition-[background-color,border-color,box-shadow] duration-200 ease-out hover:border-ink/25 hover:bg-surface/40 hover:shadow-card-hover dark:hover:border-ink/35 sm:p-7"
className="group relative scroll-mt-20 rounded-lg border border-border/90 bg-canvas p-5 shadow-card transition-[background-color,border-color,box-shadow] duration-200 ease-out hover:border-ink/25 hover:bg-surface/40 hover:shadow-card-hover dark:hover:border-ink/35 sm:p-7"
>
<Link href={`/blog/${slug}/`} className="block">
{coverImage && (
<div className="mb-5 overflow-hidden rounded-xl border border-border/80 bg-surface">
<div className="mb-5 overflow-hidden rounded-md border border-border/80 bg-surface">
<img
src={coverImage}
alt={`Cover image for ${title}`}
@@ -45,7 +45,7 @@ export function PostCard({ slug, title, date, excerpt, tags = [], author, readin
{tags && tags.length > 0 && (
<div className="mt-5 flex flex-wrap gap-2">
{tags.slice(0, 3).map((tag) => (
<Link key={tag} href={`/blog/tags/${tagToSlug(tag)}/`} className="rounded-full border border-border bg-surface/70 px-3 py-1 text-xs text-ink-soft transition-colors duration-200 hover:border-accent/60 hover:text-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent">
<Link key={tag} href={`/blog/tags/${tagToSlug(tag)}/`} className="rounded-sm border border-border bg-surface/70 px-3 py-1 font-mono text-[11px] uppercase tracking-wider text-ink-soft transition-colors duration-200 hover:border-accent/60 hover:text-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent">
{tag}
</Link>
))}