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

kartice ob oglasu: izvlecek omejen na dve vrstici, da ga ne odreze sredi stavka

Browse Source
This commit is contained in:
sebastjan
2026-08-31 17:39:57 +02:00
parent 3ca2a02618
commit 7a57fcfbfd
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/pages/home.tsx
+5 -3
View File
@@ -383,7 +383,9 @@ function VideoCard({ video }: { video: YtVideo }) {
); );
} }
function MediumCard({ article, focalPoints }: { article: Article; focalPoints?: Record<string, { x: number; y: number }> }) { // compact: kartica ob oglasu je visoka 292 px namesto 399, zato se izvlecek
// omeji na dve vrstici, sicer ga spodaj odreze sredi stavka.
function MediumCard({ article, focalPoints, compact }: { article: Article; focalPoints?: Record<string, { x: number; y: number }>; compact?: boolean }) {
const isVideo = article.category === "Video"; const isVideo = article.category === "Video";
const objPos = getObjectPosition(article.coverImage, focalPoints); const objPos = getObjectPosition(article.coverImage, focalPoints);
return ( return (
@@ -407,7 +409,7 @@ function MediumCard({ article, focalPoints }: { article: Article; focalPoints?:
<span className="text-muted-foreground text-[10px]">{timeAgo(new Date(article.publishedAt))}</span> <span className="text-muted-foreground text-[10px]">{timeAgo(new Date(article.publishedAt))}</span>
</div> </div>
<h3 className="font-semibold text-card-foreground text-sm leading-snug line-clamp-2 group-hover:text-primary transition-colors">{article.title}</h3> <h3 className="font-semibold text-card-foreground text-sm leading-snug line-clamp-2 group-hover:text-primary transition-colors">{article.title}</h3>
<p className="text-xs text-muted-foreground mt-1.5 leading-relaxed flex-1">{article.excerpt}</p> <p className={`text-xs text-muted-foreground mt-1.5 leading-relaxed flex-1 ${compact ? "line-clamp-2" : ""}`}>{article.excerpt}</p>
<div className="flex items-center gap-2 mt-2 text-muted-foreground text-[10px]"> <div className="flex items-center gap-2 mt-2 text-muted-foreground text-[10px]">
<Eye className="w-3 h-3" /> <Eye className="w-3 h-3" />
{article.views.toLocaleString()} {article.views.toLocaleString()}
@@ -1083,7 +1085,7 @@ export default function Home() {
item.type === "video" && item.video item.type === "video" && item.video
? <VideoCard key={item.key} video={item.video} /> ? <VideoCard key={item.key} video={item.video} />
: item.article : item.article
? <MediumCard key={item.key} article={item.article} focalPoints={focalPoints} /> ? <MediumCard key={item.key} article={item.article} focalPoints={focalPoints} compact />
: null : null
)} )}
</div> </div>