Remove the side column and adjust layout for two main sections
Remove the unused `wide` variable, `SideCard` component, and adjust grid column spans to accommodate the removal of the side column, ensuring the hero section takes up 75% width and the Top Stories section takes up 25% width. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 517dfa7b-26ac-463d-a6e1-a58c6df97188 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 3785250a-79ce-4d5b-9dae-ed3c4db23160 Replit-Helium-Checkpoint-Created: true
This commit is contained in:
parent
f6ca0a2e70
commit
3987e78957
BIN
attached_assets/image_1772311384148.png
Normal file
BIN
attached_assets/image_1772311384148.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 325 KiB |
@ -223,37 +223,21 @@ function FeaturedCarousel({ articles, popular, galleryImages }: { articles: Arti
|
||||
const isWidePage = page === 1;
|
||||
|
||||
let hero: Article | null = null;
|
||||
let side: Article[] = [];
|
||||
|
||||
if (!isGalleryPage && articles.length > 0) {
|
||||
hero = articles[page % articles.length];
|
||||
if (!isWidePage) {
|
||||
side = [
|
||||
articles[(page * 2 + 1) % articles.length],
|
||||
articles[(page * 2 + 2) % articles.length],
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
const wide = isGalleryPage || isWidePage;
|
||||
|
||||
return (
|
||||
<section data-testid="featured-carousel" onMouseEnter={() => setPaused(true)} onMouseLeave={() => setPaused(false)}>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-8 gap-4">
|
||||
<div className={wide ? "lg:col-span-6" : "lg:col-span-5"}>
|
||||
<div className="lg:col-span-6">
|
||||
{isGalleryPage && galleryImages ? (
|
||||
<GalleryHeroCard images={galleryImages.slice(0, 30)} />
|
||||
) : hero ? (
|
||||
<HeroCard article={hero} />
|
||||
) : null}
|
||||
</div>
|
||||
{!wide && (
|
||||
<div className="lg:col-span-1 grid grid-cols-1 gap-3">
|
||||
{side.map((a) => (
|
||||
<SideCard key={a.id} article={a} />
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<div className="lg:col-span-2">
|
||||
{popular && popular.length > 0 && <TopStoriesList articles={popular} />}
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user