Compare commits
2 Commits
a66db56156
...
46bbeed525
| Author | SHA1 | Date | |
|---|---|---|---|
| 46bbeed525 | |||
| 7258f059ce |
@ -57,9 +57,9 @@ export function HeroArticle() {
|
|||||||
{article.featuredImage && (
|
{article.featuredImage && (
|
||||||
<div className="relative overflow-hidden">
|
<div className="relative overflow-hidden">
|
||||||
<div className="absolute top-0 left-0 z-10">
|
<div className="absolute top-0 left-0 z-10">
|
||||||
<span className="inline-block px-4 py-2 bg-accent text-foreground font-body text-sm font-bold uppercase tracking-wider border-b-2 border-r-2 border-foreground">
|
<span className="inline-block px-4 py-2 bg-accent text-foreground font-body text-sm font-bold uppercase tracking-wider border-b-2 border-r-2 border-foreground">
|
||||||
Прекршени Вести
|
Прекршени Вести
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="relative h-72 md:h-96 overflow-hidden">
|
<div className="relative h-72 md:h-96 overflow-hidden">
|
||||||
<img
|
<img
|
||||||
@ -76,7 +76,7 @@ export function HeroArticle() {
|
|||||||
<h2 className="text-3xl md:text-4xl font-display leading-tight mb-4 line-clamp-2 group-hover:text-accent transition-colors">
|
<h2 className="text-3xl md:text-4xl font-display leading-tight mb-4 line-clamp-2 group-hover:text-accent transition-colors">
|
||||||
{article.title}
|
{article.title}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<div className="flex flex-wrap items-center gap-4 font-body text-sm uppercase tracking-wider text-muted-foreground mb-6 pb-4 border-b-2 border-foreground/10">
|
<div className="flex flex-wrap items-center gap-4 font-body text-sm uppercase tracking-wider text-muted-foreground mb-6 pb-4 border-b-2 border-foreground/10">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<Calendar className="w-4 h-4" />
|
<Calendar className="w-4 h-4" />
|
||||||
@ -88,14 +88,14 @@ export function HeroArticle() {
|
|||||||
})}
|
})}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{article.author && (
|
{article.author && (
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<User className="w-4 h-4" />
|
<User className="w-4 h-4" />
|
||||||
<span>{article.author.name}</span>
|
<span>{article.author.name}</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<Eye className="w-4 h-4" />
|
<Eye className="w-4 h-4" />
|
||||||
<span>{article.views} views</span>
|
<span>{article.views} views</span>
|
||||||
@ -124,11 +124,11 @@ export function HeroArticle() {
|
|||||||
<div className="flex items-center justify-between pt-4 border-t-2 border-foreground/10">
|
<div className="flex items-center justify-between pt-4 border-t-2 border-foreground/10">
|
||||||
<Link to="/articles/$id" params={{ id: article.id }}>
|
<Link to="/articles/$id" params={{ id: article.id }}>
|
||||||
<Button variant="brutalAccent" className="gap-2">
|
<Button variant="brutalAccent" className="gap-2">
|
||||||
Read Full Story
|
Прочитај повеќе
|
||||||
<ArrowRight className="w-4 h-4" />
|
<ArrowRight className="w-4 h-4" />
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<div className="font-body text-xs uppercase tracking-wider text-muted-foreground">
|
<div className="font-body text-xs uppercase tracking-wider text-muted-foreground">
|
||||||
<span className="font-bold text-foreground">
|
<span className="font-bold text-foreground">
|
||||||
{(article.facebookShares || 0) + (article.twitterShares || 0) + (article.whatsappShares || 0) + (article.telegramShares || 0)}
|
{(article.facebookShares || 0) + (article.twitterShares || 0) + (article.whatsappShares || 0) + (article.telegramShares || 0)}
|
||||||
|
|||||||
@ -196,7 +196,7 @@ const articleDetailRoute = createRoute({
|
|||||||
return <ArticleDetailComponent id={id} />
|
return <ArticleDetailComponent id={id} />
|
||||||
},
|
},
|
||||||
loader: async ({ params }) => {
|
loader: async ({ params }) => {
|
||||||
const response = await fetch(`${import.meta.env.VITE_API_URL || 'http://localhost:3000'}/api/v1/articles/${params.id}`)
|
const response = await fetch(`${import.meta.env.VITE_API_URL || 'http://localhost:3000/api/v1'}/articles/${params.id}`)
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
return { article: null }
|
return { article: null }
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user