naslovnica: naslovna slika v karuselu ne more vec postati pokoncna
Vzrok: slika v FeaturedHeroCard ima lg:flex-1 lg:aspect-auto, torej pozre ves visek visine vrstice. Visina vrstice je najvisji stolpec, in ko je bil ta visok, je 16:9 naslovnica v object-cover postala pokoncna in mocno prirezana - obraz cez cel okvir. Dvoje: - karusel dobi lg:max-h-[560px] poleg obstojecega lg:min-h-[460px], tako da je visina slike omejena med priblizno 16:10 in 16:13 in nikoli pokoncna; - stranski stolpec je zdaj lg:flex lg:flex-col, seznam Zuletzt hinzugefuegt pa lg:flex-1 z overflow-hidden in osmimi namesto petimi novicami, tako da visek visine poziera on in ne slika.
This commit is contained in:
@@ -602,7 +602,7 @@ function FeaturedCarousel({ articles, popular, galleryImages, focalPoints }: { a
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div
|
<div
|
||||||
className="grid grid-cols-1 lg:grid-cols-5 lg:grid-rows-1 gap-4 lg:flex-1 lg:min-h-[460px] transition-opacity duration-300"
|
className="grid grid-cols-1 lg:grid-cols-5 lg:grid-rows-1 gap-4 lg:flex-1 lg:min-h-[460px] lg:max-h-[560px] transition-opacity duration-300"
|
||||||
style={{ opacity: fading ? 0 : 1 }}
|
style={{ opacity: fading ? 0 : 1 }}
|
||||||
>
|
>
|
||||||
<div className="lg:col-span-3">
|
<div className="lg:col-span-3">
|
||||||
@@ -916,9 +916,9 @@ export default function Home() {
|
|||||||
focalPoints={focalPoints}
|
focalPoints={focalPoints}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="lg:col-span-1 space-y-4">
|
<div className="lg:col-span-1 space-y-4 lg:flex lg:flex-col">
|
||||||
<SidebarWeatherWidget />
|
<SidebarWeatherWidget />
|
||||||
{articles && articles.length > 0 && <TopStoriesList articles={[...articles].sort((a, b) => new Date(b.publishedAt).getTime() - new Date(a.publishedAt).getTime()).slice(0, 5)} />}
|
{articles && articles.length > 0 && <TopStoriesList articles={[...articles].sort((a, b) => new Date(b.publishedAt).getTime() - new Date(a.publishedAt).getTime()).slice(0, 8)} className="lg:flex-1 lg:min-h-0 overflow-hidden" />}
|
||||||
<SidebarAd />
|
<SidebarAd />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user