Increase logo size and correct brand colors for better visual consistency

Adjusted header height and logo size in `header.tsx`. Updated primary, ring, destructive, and shadow color variables in `index.css` to match the Folx brand crimson red.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 413891e8-d784-4bea-b9f5-91a5a68316b4
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 991dee47-c7dd-4087-bd5d-e9f65b13eff8
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:
sebastjanartic 2026-02-28 16:54:20 +00:00
parent 6939777e7b
commit b2078aa6ef
3 changed files with 15 additions and 15 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 179 B

View File

@ -16,10 +16,10 @@ export default function Header() {
return (
<header className="sticky top-0 z-50 bg-background/95 backdrop-blur-md border-b border-card-border" data-testid="header">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between gap-4 h-20">
<div className="flex items-center justify-between gap-4 h-24">
<Link href="/">
<div className="flex items-center gap-2 cursor-pointer" data-testid="link-logo">
<img src={folxLogo} alt="Folx TV" className="h-20 w-auto object-contain" />
<img src={folxLogo} alt="Folx TV" className="h-24 w-auto object-contain" />
</div>
</Link>

View File

@ -102,15 +102,15 @@
--sidebar: 0 0% 9%;
--sidebar-foreground: 0 0% 92%;
--sidebar-border: 0 0% 15%;
--sidebar-primary: 356 85% 48%;
--sidebar-primary: 345 85% 50%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 0 0% 16%;
--sidebar-accent-foreground: 0 0% 92%;
--sidebar-ring: 356 85% 48%;
--sidebar-ring: 345 85% 50%;
--popover: 0 0% 10%;
--popover-foreground: 0 0% 95%;
--popover-border: 0 0% 16%;
--primary: 356 85% 48%;
--primary: 345 85% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 0 0% 15%;
--secondary-foreground: 0 0% 95%;
@ -118,23 +118,23 @@
--muted-foreground: 0 0% 55%;
--accent: 0 0% 16%;
--accent-foreground: 0 0% 92%;
--destructive: 356 91% 54%;
--destructive: 345 91% 54%;
--destructive-foreground: 0 0% 100%;
--input: 0 0% 18%;
--ring: 356 85% 48%;
--ring: 345 85% 50%;
--chart-1: 204 88% 53%;
--chart-2: 160 100% 36%;
--chart-3: 42 93% 56%;
--chart-4: 147 79% 42%;
--chart-5: 341 75% 51%;
--shadow-2xs: 0px 2px 0px 0px hsl(9 75% 61% / 0.00);
--shadow-xs: 0px 2px 0px 0px hsl(9 75% 61% / 0.00);
--shadow-sm: 0px 2px 0px 0px hsl(9 75% 61% / 0.00), 0px 1px 2px -1px hsl(9 75% 61% / 0.00);
--shadow: 0px 2px 0px 0px hsl(9 75% 61% / 0.00), 0px 1px 2px -1px hsl(9 75% 61% / 0.00);
--shadow-md: 0px 2px 0px 0px hsl(9 75% 61% / 0.00), 0px 2px 4px -1px hsl(9 75% 61% / 0.00);
--shadow-lg: 0px 2px 0px 0px hsl(9 75% 61% / 0.00), 0px 4px 6px -1px hsl(9 75% 61% / 0.00);
--shadow-xl: 0px 2px 0px 0px hsl(9 75% 61% / 0.00), 0px 8px 10px -1px hsl(9 75% 61% / 0.00);
--shadow-2xl: 0px 2px 0px 0px hsl(9 75% 61% / 0.00);
--shadow-2xs: 0px 2px 0px 0px hsl(345 85% 50% / 0.00);
--shadow-xs: 0px 2px 0px 0px hsl(345 85% 50% / 0.00);
--shadow-sm: 0px 2px 0px 0px hsl(345 85% 50% / 0.00), 0px 1px 2px -1px hsl(345 85% 50% / 0.00);
--shadow: 0px 2px 0px 0px hsl(345 85% 50% / 0.00), 0px 1px 2px -1px hsl(345 85% 50% / 0.00);
--shadow-md: 0px 2px 0px 0px hsl(345 85% 50% / 0.00), 0px 2px 4px -1px hsl(345 85% 50% / 0.00);
--shadow-lg: 0px 2px 0px 0px hsl(345 85% 50% / 0.00), 0px 4px 6px -1px hsl(345 85% 50% / 0.00);
--shadow-xl: 0px 2px 0px 0px hsl(345 85% 50% / 0.00), 0px 8px 10px -1px hsl(345 85% 50% / 0.00);
--shadow-2xl: 0px 2px 0px 0px hsl(345 85% 50% / 0.00);
/* Fallback for older browsers */
--sidebar-primary-border: hsl(var(--sidebar-primary));