From e05bf1a08ee8f1092f037a4850427046eb0baf1b Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Thu, 28 Aug 2025 15:58:31 +0000
Subject: [PATCH] Improve background logo appearance with more variations and
 better visibility

Add multiple instances of the background logo with different rotations, opacities, and positioning, adjusting existing logo opacity for better visibility.

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/I7n64hF
---
 client/src/pages/home.tsx | 206 +++++++++++++++++++++++++++++++++++---
 1 file changed, 191 insertions(+), 15 deletions(-)

diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx
index 44ed02a..d70c7ba 100644
--- a/client/src/pages/home.tsx
+++ b/client/src/pages/home.tsx
@@ -86,7 +86,7 @@ export default function Home() {
 
       <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 relative">
         {/* Background logo decorations - fiksni veliki go4.video logoti v ozadju */}
-        {/* OGROMNI go4.video logoti v ozadju - povečani */}
+        {/* OGROMNI go4.video logoti v ozadju - več pod različnimi koti z manj transparence */}
         <img 
           src={go4LogoPath} 
           alt="" 
@@ -99,7 +99,7 @@ export default function Home() {
             height: '800px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.4,
+            opacity: 0.55,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -115,7 +115,39 @@ export default function Home() {
             height: '700px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.35,
+            opacity: 0.5,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '12%', 
+            left: '25%', 
+            transform: 'rotate(75deg)',
+            width: '1200px',
+            height: '600px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.45,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '20%', 
+            right: '30%', 
+            transform: 'rotate(-10deg)',
+            width: '1500px',
+            height: '750px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.42,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -131,7 +163,7 @@ export default function Home() {
             height: '900px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.3,
+            opacity: 0.45,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -147,7 +179,39 @@ export default function Home() {
             height: '750px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.28,
+            opacity: 0.43,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '55%', 
+            left: '40%', 
+            transform: 'rotate(85deg)',
+            width: '1300px',
+            height: '650px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.38,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '60%', 
+            right: '20%', 
+            transform: 'rotate(-55deg)',
+            width: '1400px',
+            height: '700px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.35,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -163,7 +227,7 @@ export default function Home() {
             height: '850px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.25,
+            opacity: 0.4,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -179,12 +243,28 @@ export default function Home() {
             height: '650px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.22,
+            opacity: 0.37,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            bottom: '15%', 
+            left: '35%', 
+            transform: 'rotate(95deg)',
+            width: '1600px',
+            height: '800px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.32,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
         
-        {/* Dodatni ogromni logoti na sredini */}
+        {/* Dodatni ogromni logoti na sredini - različni koti */}
         <img 
           src={go4LogoPath} 
           alt="" 
@@ -197,7 +277,7 @@ export default function Home() {
             height: '1200px',
             pointerEvents: 'none',
             zIndex: -2,
-            opacity: 0.15,
+            opacity: 0.3,
             filter: 'contrast(2.2) brightness(1.6)'
           }}
         />
@@ -213,7 +293,7 @@ export default function Home() {
             height: '1000px',
             pointerEvents: 'none',
             zIndex: -2,
-            opacity: 0.12,
+            opacity: 0.27,
             filter: 'contrast(2.2) brightness(1.6)'
           }}
         />
@@ -229,7 +309,39 @@ export default function Home() {
             height: '900px',
             pointerEvents: 'none',
             zIndex: -2,
-            opacity: 0.1,
+            opacity: 0.25,
+            filter: 'contrast(2.2) brightness(1.6)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '45%', 
+            left: '70%', 
+            transform: 'rotate(120deg)',
+            width: '1900px',
+            height: '950px',
+            pointerEvents: 'none',
+            zIndex: -2,
+            opacity: 0.22,
+            filter: 'contrast(2.2) brightness(1.6)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'fixed',
+            top: '75%', 
+            left: '60%', 
+            transform: 'rotate(-80deg)',
+            width: '1700px',
+            height: '850px',
+            pointerEvents: 'none',
+            zIndex: -2,
+            opacity: 0.2,
             filter: 'contrast(2.2) brightness(1.6)'
           }}
         />
@@ -253,7 +365,7 @@ export default function Home() {
 
       {/* Footer with large triangle design */}
       <footer className="bunny-gray border-t border-white/20 mt-16 relative overflow-hidden">
-        {/* go4.video logoti v footerju - povečani */}
+        {/* go4.video logoti v footerju - več pod različnimi koti */}
         <img 
           src={go4LogoPath} 
           alt="" 
@@ -266,7 +378,7 @@ export default function Home() {
             height: '350px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.35,
+            opacity: 0.5,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -282,7 +394,7 @@ export default function Home() {
             height: '300px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.3,
+            opacity: 0.45,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />
@@ -298,7 +410,71 @@ export default function Home() {
             height: '250px',
             pointerEvents: 'none',
             zIndex: -1,
-            opacity: 0.25,
+            opacity: 0.4,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'absolute',
+            bottom: '15px', 
+            right: '20%', 
+            transform: 'rotate(65deg)',
+            width: '650px',
+            height: '325px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.42,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'absolute',
+            top: '25px', 
+            left: '15%', 
+            transform: 'rotate(90deg)',
+            width: '550px',
+            height: '275px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.38,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'absolute',
+            bottom: '20px', 
+            left: '35%', 
+            transform: 'rotate(-70deg)',
+            width: '600px',
+            height: '300px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.35,
+            filter: 'contrast(1.8) brightness(1.4)'
+          }}
+        />
+        <img 
+          src={go4LogoPath} 
+          alt="" 
+          style={{
+            position: 'absolute',
+            top: '15px', 
+            right: '40%', 
+            transform: 'rotate(105deg)',
+            width: '480px',
+            height: '240px',
+            pointerEvents: 'none',
+            zIndex: -1,
+            opacity: 0.32,
             filter: 'contrast(1.8) brightness(1.4)'
           }}
         />