Fix display issues on news pages and article pages
Correctly displays Facebook Reels by adjusting iframe CSS to respect 9:16 aspect ratio, fixes "Zurück" button text encoding, and ensures news badges are fully visible by adjusting overflow clipping. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 413891e8-d784-4bea-b9f5-91a5a68316b4 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: acf16132-83c0-4f3b-ae14-09484805bc0f Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/413891e8-d784-4bea-b9f5-91a5a68316b4/cftwqyT Replit-Helium-Checkpoint-Created: true
This commit is contained in:
parent
000edc48e5
commit
5aea2be41d
BIN
attached_assets/image_1772297429956.png
Normal file
BIN
attached_assets/image_1772297429956.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 754 KiB |
@ -128,7 +128,7 @@ export default function ArticlePage() {
|
|||||||
<Link href="/">
|
<Link href="/">
|
||||||
<Button variant="ghost" size="sm" className="mb-6 gap-2" data-testid="button-back">
|
<Button variant="ghost" size="sm" className="mb-6 gap-2" data-testid="button-back">
|
||||||
<ArrowLeft className="w-4 h-4" />
|
<ArrowLeft className="w-4 h-4" />
|
||||||
Zur\u00fcck
|
Zurück
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
|
|||||||
@ -24,7 +24,7 @@ export default function CategoryPage() {
|
|||||||
<Link href="/">
|
<Link href="/">
|
||||||
<Button variant="ghost" size="sm" className="mb-6 gap-2" data-testid="button-back">
|
<Button variant="ghost" size="sm" className="mb-6 gap-2" data-testid="button-back">
|
||||||
<ArrowLeft className="w-4 h-4" />
|
<ArrowLeft className="w-4 h-4" />
|
||||||
Zur\u00fcck
|
Zurück
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
@ -53,14 +53,16 @@ export default function CategoryPage() {
|
|||||||
className="group cursor-pointer bg-card rounded-md border border-card-border transition-all duration-300"
|
className="group cursor-pointer bg-card rounded-md border border-card-border transition-all duration-300"
|
||||||
data-testid={`card-article-${article.id}`}
|
data-testid={`card-article-${article.id}`}
|
||||||
>
|
>
|
||||||
<div className="relative overflow-hidden rounded-t-md">
|
<div className="relative rounded-t-md">
|
||||||
<img
|
<div className="overflow-hidden rounded-t-md">
|
||||||
src={article.coverImage || "/images/article-1.png"}
|
<img
|
||||||
alt={article.title}
|
src={article.coverImage || "/images/article-1.png"}
|
||||||
className="w-full aspect-video object-cover transition-transform duration-500 group-hover:scale-105"
|
alt={article.title}
|
||||||
loading="lazy"
|
className="w-full aspect-video object-cover transition-transform duration-500 group-hover:scale-105"
|
||||||
/>
|
loading="lazy"
|
||||||
<Badge className="absolute top-3 left-3 text-xs no-default-active-elevate">
|
/>
|
||||||
|
</div>
|
||||||
|
<Badge className="absolute top-3 left-3 text-xs no-default-active-elevate z-10">
|
||||||
{article.category}
|
{article.category}
|
||||||
</Badge>
|
</Badge>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user