vibeasite-templates/template-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Seed: blog template (17 files)

Browse Source
This commit is contained in:
jyswee
2026-07-23 22:56:18 +00:00
parent 3f7551ca38
commit 3a56fd256e
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Author.tsx
+4 -4
View File
@@ -98,14 +98,14 @@ export default function AuthorPage() {
<h2 className="text-3xl sm:text-4xl font-bold tracking-tight mb-12 animate-fade-up">Articles by Sarah Chen</h2> <h2 className="text-3xl sm:text-4xl font-bold tracking-tight mb-12 animate-fade-up">Articles by Sarah Chen</h2>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 stagger"> <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 stagger">
{authorArticles.map((article) => ( {authorArticles.map((article) => (
<Link to={`/article/\${article.slug}`} key={article.id} className="group"> <Link to={`/article/${article.slug}`} key={article.id} className="group">
<Card className="overflow-hidden border-0 shadow-sm hover:shadow-xl hover:-translate-y-1 transition-all duration-300 bg-white"> <Card className="overflow-hidden border-0 shadow-sm hover:shadow-xl hover:-translate-y-1 transition-all duration-300 bg-white">
<div className={`relative aspect-video bg-gradient-to-br \${article.gradient}`}> <div className={`relative aspect-video bg-gradient-to-br ${article.gradient}`}>
<div className="absolute inset-0" style={{ backgroundImage: "radial-gradient(circle at 25% 25%, rgba(255,255,255,0.15) 1px, transparent 1px)", backgroundSize: "20px 20px" }} /> <div className="absolute inset-0" style={{ backgroundImage: "radial-gradient(circle at 25% 25%, rgba(255,255,255,0.15) 1px, transparent 1px)", backgroundSize: "20px 20px" }} />
<div className="absolute top-1/3 left-1/4 w-24 h-24 rounded-full bg-white/10 blur-2xl" /> <div className="absolute top-1/3 left-1/4 w-24 h-24 rounded-full bg-white/10 blur-2xl" />
</div> </div>
<CardContent className="p-5"> <CardContent className="p-5">
<Badge className={`mb-2 border-0 text-xs hover:bg-primary hover:text-primary-foreground transition-colors \${categoryColors[article.category] || "bg-emerald-100 text-emerald-700"}`}> <Badge className={`mb-2 border-0 text-xs hover:bg-primary hover:text-primary-foreground transition-colors ${categoryColors[article.category] || "bg-emerald-100 text-emerald-700"}`}>
{article.category} {article.category}
</Badge> </Badge>
<h3 className="font-semibold text-stone-900 group-hover:text-emerald-600 transition-colors leading-snug line-clamp-2"> <h3 className="font-semibold text-stone-900 group-hover:text-emerald-600 transition-colors leading-snug line-clamp-2">
@@ -132,7 +132,7 @@ export default function AuthorPage() {
key={page} key={page}
variant={page === 1 ? "default" : "outline"} variant={page === 1 ? "default" : "outline"}
size="icon" size="icon"
className={`h-9 w-9 rounded-full \${page === 1 ? "bg-emerald-600 hover:bg-emerald-700" : ""}`} className={`h-9 w-9 rounded-full ${page === 1 ? "bg-emerald-600 hover:bg-emerald-700" : ""}`}
> >
{page} {page}
</Button> </Button>