sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust layout of Folx Stadl page to center title and reposition logo

Browse Source 
Modify client/src/pages/FolxStadlPage.tsx to center the "FOLX STADL" title, move the logo to the right side, and rearrange navigation elements for a more organized layout.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/izllXJt
This commit is contained in:
sebastjanartic 2025-08-30 20:36:17 +00:00
parent d27c7c00d0
commit a43a1a584f
2 changed files with 33 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
attached_assets/image_1756586103437.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

53
client/src/pages/FolxStadlPage.tsx
View File

@ -56,7 +56,7 @@ export default function FolxStadlPage() {
<div className="border-b border-white/10 bg-black/20 backdrop-blur-sm sticky top-0 z-40">
<div className="max-w-7xl mx-auto px-4 py-4">
<div className="flex items-center justify-between">
{/* Left side - Back button and title */}
{/* Left side - Back button */}
<div className="flex items-center gap-4">
<Link href="/">
<button className="flex items-center gap-2 text-bunny-light hover:text-white transition-colors">
@ -64,29 +64,42 @@ export default function FolxStadlPage() {
<span className="hidden sm:inline">Zurück</span>
</button>
</Link>
</div>
{/* Center - FOLX STADL title */}
<div className="flex-1 flex justify-center">
<h1 className="text-2xl sm:text-3xl font-bold text-white uppercase tracking-wide">FOLX STADL</h1>
</div>
{/* Right side - Mobile menu button */}
<div className="md:hidden">
<Button
variant="ghost"
size="sm"
onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
className="text-white hover:bg-white/10"
data-testid="button-mobile-menu-folx"
>
{isMobileMenuOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
</Button>
</div>
{/* Desktop navigation */}
<div className="hidden md:flex items-center space-x-6">
<nav className="flex space-x-6">
<Link href="/" className="text-bunny-light hover:text-white transition-colors">
Home
{/* Right side - Logo and navigation */}
<div className="flex items-center gap-4">
{/* Desktop navigation with logo */}
<div className="hidden md:flex items-center space-x-6">
<nav className="flex space-x-6">
<Link href="/" className="text-bunny-light hover:text-white transition-colors">
Home
</Link>
</nav>
<Link href="/" className="flex items-center space-x-2 hover:opacity-80 transition-opacity">
<div className="w-8 h-8 gradient-primary rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1"></div>
</div>
<span className="text-lg font-bold text-white tracking-wide">go4.video</span>
</Link>
</nav>
</div>
{/* Mobile menu button */}
<div className="md:hidden">
<Button
variant="ghost"
size="sm"
onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
className="text-white hover:bg-white/10"
data-testid="button-mobile-menu-folx"
>
{isMobileMenuOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
</Button>
</div>
</div>
</div>