sebastjan/folx-tv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Increase logo size and correct brand colors for better visual consistency

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
attached_assets/image_1772297651090.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 179 B

4
client/src/components/header.tsx
View File

@ -16,10 +16,10 @@ export default function Header() {
return ( return (
<header className="sticky top-0 z-50 bg-background/95 backdrop-blur-md border-b border-card-border" data-testid="header"> <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="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="/"> <Link href="/">
<div className="flex items-center gap-2 cursor-pointer" data-testid="link-logo"> <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> </div>
</Link> </Link>

26
client/src/index.css
View File

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