sebastjan/folx-tv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

naslovnica: glavna kartica se ne razteguje vec pod besedilom — visek visine gre v sliko (flex-1), besedilni del je fiksne visine, kot je ze pri stranskih karticah

Browse Source
This commit is contained in:
folx bot
2026-08-24 18:56:53 +02:00
parent 0e438b1d3c
commit 27e29b9c9a
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/pages/home.tsx
+5 -2
View File
@@ -523,7 +523,10 @@ function FeaturedHeroCard({ article, focalPoints }: { article: Article; focalPoi
return ( return (
<Link href={`/article/${article.slug}`}> <Link href={`/article/${article.slug}`}>
<div className="relative group cursor-pointer rounded-lg overflow-hidden bg-card border border-card-border h-full flex flex-col" data-testid={`card-featured-hero-${article.id}`}> <div className="relative group cursor-pointer rounded-lg overflow-hidden bg-card border border-card-border h-full flex flex-col" data-testid={`card-featured-hero-${article.id}`}>
<div className="relative flex-none aspect-[16/10] min-h-[300px]"> {/* Visek visine gre v sliko, ne v prazen prostor pod besedilom. Prej je
imela slika fiksno razmerje in se je raztegnil besedilni del, kar je
pod novico naredilo velik crn pas. */}
<div className="relative flex-1 min-h-[300px]">
<img src={article.coverImage || ""} alt={article.title} className="w-full h-full object-cover absolute inset-0 transition-transform duration-700 group-hover:scale-105" style={{ objectPosition: objPos }} loading="lazy" /> <img src={article.coverImage || ""} alt={article.title} className="w-full h-full object-cover absolute inset-0 transition-transform duration-700 group-hover:scale-105" style={{ objectPosition: objPos }} loading="lazy" />
{isVideo && ( {isVideo && (
<div className="absolute inset-0 flex items-center justify-center z-10"> <div className="absolute inset-0 flex items-center justify-center z-10">
@@ -533,7 +536,7 @@ function FeaturedHeroCard({ article, focalPoints }: { article: Article; focalPoi
</div> </div>
)} )}
</div> </div>
<div className="p-4 flex-1"> <div className="p-4 flex-none">
<div className="flex items-center gap-2 mb-1.5"> <div className="flex items-center gap-2 mb-1.5">
<span className="text-xs font-medium text-primary">{article.category}</span> <span className="text-xs font-medium text-primary">{article.category}</span>
<span className="text-muted-foreground text-xs">{timeAgo(new Date(article.publishedAt))}</span> <span className="text-muted-foreground text-xs">{timeAgo(new Date(article.publishedAt))}</span>