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

Update page backgrounds with animated logo elements

Browse Source 
Replaces static text background elements with dynamic, scaled, and rotated logo images across multiple pages (VideoPage, Home, NotFound) using new CSS classes (bg-logo-large, bg-logo-medium, bg-logo-small).

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d7424866-83d1-4486-a212-ac12b4c7becf
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/d7424866-83d1-4486-a212-ac12b4c7becf/3OFqUb2
This commit is contained in:
sebastjanartic
2025-08-28 15:33:56 +00:00
parent 89932a2530
commit 79841d36be
4 changed files with 46 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/pages/home.tsx
+9 -19
View File
@@ -84,25 +84,15 @@ export default function Home() {
/>
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 relative">
{/* Background text decorations - go4.video in different sizes */}
<div className="bg-text-large" style={{top: '10%', right: '5%', transform: 'rotate(-20deg)'}}>
go4.video
</div>
<div className="bg-text-medium" style={{top: '40%', left: '2%', transform: 'rotate(15deg)'}}>
go4.video
</div>
<div className="bg-text-small" style={{top: '70%', right: '15%', transform: 'rotate(-10deg)'}}>
go4.video
</div>
<div className="bg-text-large" style={{top: '85%', left: '25%', transform: 'rotate(25deg)'}}>
go4.video
</div>
<div className="bg-text-medium" style={{top: '25%', left: '55%', transform: 'rotate(-30deg)'}}>
go4.video
</div>
<div className="bg-text-small" style={{top: '60%', left: '70%', transform: 'rotate(12deg)'}}>
go4.video
</div>
{/* Background logo decorations - go4.video logos at different angles */}
<div className="bg-logo-large" style={{top: '10%', right: '5%', transform: 'rotate(-20deg)'}}></div>
<div className="bg-logo-medium" style={{top: '40%', left: '2%', transform: 'rotate(15deg)'}}></div>
<div className="bg-logo-small" style={{top: '70%', right: '15%', transform: 'rotate(-10deg)'}}></div>
<div className="bg-logo-large" style={{top: '85%', left: '25%', transform: 'rotate(25deg)'}}></div>
<div className="bg-logo-medium" style={{top: '25%', left: '55%', transform: 'rotate(-30deg)'}}></div>
<div className="bg-logo-small" style={{top: '60%', left: '70%', transform: 'rotate(12deg)'}}></div>
<div className="bg-logo-medium" style={{top: '15%', left: '80%', transform: 'rotate(45deg)'}}></div>
<div className="bg-logo-small" style={{top: '50%', right: '8%', transform: 'rotate(-35deg)'}}></div>
{/* Large geometric triangles */}
<div className="absolute top-10 right-10 w-0 h-0 border-l-[100px] border-l-transparent border-r-[100px] border-r-transparent border-b-[150px] border-b-blue-400/8 rotate-12 z-0"></div>