diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx index 568fcc5..97b0b70 100644 --- a/client/src/pages/home.tsx +++ b/client/src/pages/home.tsx @@ -1,5 +1,6 @@ import { useQuery } from "@tanstack/react-query"; import { artistGroup } from "@/lib/artists"; +import { objectPositionFor } from "@/lib/focal"; import { Link } from "wouter"; import { type Article } from "@shared/schema"; import { format } from "date-fns"; @@ -142,11 +143,14 @@ function GalleryHeroCard({ images }: { images: GalleryImage[] }) { ); } +/** + * Zaris naslovnice. Kljuci v /api/focal-points so relativni (/uploads/x.webp), + * coverImage pa je pogosto absoluten (https://folx.tv/uploads/x.webp) - prej se + * kljuc ni ujel, zaris se ni uporabil in kvadratne ploscice so rezale glave. + * Zato uporabimo skupno objectPositionFor, ki obe obliki poravna. + */ function getObjectPosition(coverImage: string | null, focalPoints?: Record): string { - if (!coverImage || !focalPoints) return "center 25%"; - const fp = focalPoints[coverImage]; - if (!fp) return "center 25%"; - return `${fp.x}% ${fp.y}%`; + return objectPositionFor(coverImage, focalPoints as any); } function MosaicTile({ article, focalPoints, tall = false }: { article: Article; focalPoints?: Record; tall?: boolean }) {