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

Enlarge geometric logo elements for a more prominent visual presence

Browse Source 
Increase the size, opacity, and contrast of background logo elements in the header and home page for a more impactful visual display.

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/6G8Idjn
This commit is contained in:
sebastjanartic 2025-08-28 15:55:30 +00:00
parent ec397a188c
commit c5c9bb43f9
2 changed files with 133 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
client/src/components/search-header.tsx
View File

@ -45,21 +45,21 @@ export default function SearchHeader({
return ( return (
<div className="bunny-gray border-b border-white/20 sticky top-0 z-50 backdrop-blur-md relative overflow-hidden"> <div className="bunny-gray border-b border-white/20 sticky top-0 z-50 backdrop-blur-md relative overflow-hidden">
{/* go4.video logoti v headerju - transparentni */} {/* go4.video logoti v headerju - povečani */}
<img <img
src={go4LogoPath} src={go4LogoPath}
alt="" alt=""
style={{ style={{
position: 'absolute', position: 'absolute',
top: '5px', top: '-10px',
right: '15%', right: '10%',
transform: 'rotate(-15deg)', transform: 'rotate(-15deg)',
width: '300px', width: '600px',
height: '150px', height: '300px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.2, opacity: 0.3,
filter: 'contrast(1.5) brightness(1.3)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -67,15 +67,31 @@ export default function SearchHeader({
alt="" alt=""
style={{ style={{
position: 'absolute', position: 'absolute',
top: '8px', top: '-5px',
left: '20%', left: '15%',
transform: 'rotate(25deg)', transform: 'rotate(25deg)',
width: '250px', width: '500px',
height: '125px', height: '250px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.15, opacity: 0.25,
filter: 'contrast(1.5) brightness(1.3)' filter: 'contrast(1.8) brightness(1.4)'
}}
/>
<img
src={go4LogoPath}
alt=""
style={{
position: 'absolute',
top: '5px',
left: '50%',
transform: 'rotate(-30deg)',
width: '400px',
height: '200px',
pointerEvents: 'none',
zIndex: -1,
opacity: 0.2,
filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />

176
client/src/pages/home.tsx
View File

@ -86,21 +86,21 @@ export default function Home() {
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 relative"> <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 */} {/* Background logo decorations - fiksni veliki go4.video logoti v ozadju */}
{/* VELIKI go4.video logoti v ozadju - s transparenco */} {/* OGROMNI go4.video logoti v ozadju - povečani */}
<img <img
src={go4LogoPath} src={go4LogoPath}
alt="" alt=""
style={{ style={{
position: 'fixed', position: 'fixed',
top: '5%', top: '2%',
left: '2%', left: '-5%',
transform: 'rotate(-25deg)', transform: 'rotate(-25deg)',
width: '800px', width: '1600px',
height: '400px', height: '800px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.3, opacity: 0.4,
filter: 'contrast(1.5) brightness(1.2)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -108,15 +108,31 @@ export default function Home() {
alt="" alt=""
style={{ style={{
position: 'fixed', position: 'fixed',
top: '10%', top: '5%',
right: '5%', right: '-8%',
transform: 'rotate(30deg)', transform: 'rotate(30deg)',
width: '700px', width: '1400px',
height: '350px', height: '700px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.25, opacity: 0.35,
filter: 'contrast(1.5) brightness(1.2)' filter: 'contrast(1.8) brightness(1.4)'
}}
/>
<img
src={go4LogoPath}
alt=""
style={{
position: 'fixed',
top: '35%',
left: '2%',
transform: 'rotate(18deg)',
width: '1800px',
height: '900px',
pointerEvents: 'none',
zIndex: -1,
opacity: 0.3,
filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -125,14 +141,14 @@ export default function Home() {
style={{ style={{
position: 'fixed', position: 'fixed',
top: '40%', top: '40%',
left: '8%', right: '-10%',
transform: 'rotate(18deg)', transform: 'rotate(-35deg)',
width: '900px', width: '1500px',
height: '450px', height: '750px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.2, opacity: 0.28,
filter: 'contrast(1.5) brightness(1.2)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -140,15 +156,15 @@ export default function Home() {
alt="" alt=""
style={{ style={{
position: 'fixed', position: 'fixed',
top: '45%', bottom: '5%',
right: '3%', left: '5%',
transform: 'rotate(-35deg)', transform: 'rotate(-15deg)',
width: '750px', width: '1700px',
height: '375px', height: '850px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.18, opacity: 0.25,
filter: 'contrast(1.5) brightness(1.2)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -157,48 +173,32 @@ export default function Home() {
style={{ style={{
position: 'fixed', position: 'fixed',
bottom: '8%', bottom: '8%',
left: '12%', right: '3%',
transform: 'rotate(-15deg)',
width: '850px',
height: '425px',
pointerEvents: 'none',
zIndex: -1,
opacity: 0.15,
filter: 'contrast(1.5) brightness(1.2)'
}}
/>
<img
src={go4LogoPath}
alt=""
style={{
position: 'fixed',
bottom: '12%',
right: '8%',
transform: 'rotate(22deg)', transform: 'rotate(22deg)',
width: '650px', width: '1300px',
height: '325px', height: '650px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.12, opacity: 0.22,
filter: 'contrast(1.5) brightness(1.2)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
{/* Dodatni veliki logoti na sredini */} {/* Dodatni ogromni logoti na sredini */}
<img <img
src={go4LogoPath} src={go4LogoPath}
alt="" alt=""
style={{ style={{
position: 'fixed', position: 'fixed',
top: '30%', top: '25%',
left: '50%', left: '50%',
transform: 'translate(-50%, -50%) rotate(-45deg)', transform: 'translate(-50%, -50%) rotate(-45deg)',
width: '1200px', width: '2400px',
height: '600px', height: '1200px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -2, zIndex: -2,
opacity: 0.08, opacity: 0.15,
filter: 'contrast(2) brightness(1.5)' filter: 'contrast(2.2) brightness(1.6)'
}} }}
/> />
<img <img
@ -206,15 +206,31 @@ export default function Home() {
alt="" alt=""
style={{ style={{
position: 'fixed', position: 'fixed',
top: '70%', top: '65%',
left: '30%', left: '25%',
transform: 'rotate(60deg)', transform: 'rotate(60deg)',
width: '1000px', width: '2000px',
height: '500px', height: '1000px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -2, zIndex: -2,
opacity: 0.06, opacity: 0.12,
filter: 'contrast(2) brightness(1.5)' filter: 'contrast(2.2) brightness(1.6)'
}}
/>
<img
src={go4LogoPath}
alt=""
style={{
position: 'fixed',
top: '15%',
left: '75%',
transform: 'rotate(-60deg)',
width: '1800px',
height: '900px',
pointerEvents: 'none',
zIndex: -2,
opacity: 0.1,
filter: 'contrast(2.2) brightness(1.6)'
}} }}
/> />
@ -237,21 +253,21 @@ export default function Home() {
{/* Footer with large triangle design */} {/* Footer with large triangle design */}
<footer className="bunny-gray border-t border-white/20 mt-16 relative overflow-hidden"> <footer className="bunny-gray border-t border-white/20 mt-16 relative overflow-hidden">
{/* go4.video logoti v footerju - transparentni */} {/* go4.video logoti v footerju - povečani */}
<img <img
src={go4LogoPath} src={go4LogoPath}
alt="" alt=""
style={{ style={{
position: 'absolute', position: 'absolute',
top: '15px', top: '5px',
right: '8%', right: '3%',
transform: 'rotate(-20deg)', transform: 'rotate(-20deg)',
width: '350px', width: '700px',
height: '175px', height: '350px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.25, opacity: 0.35,
filter: 'contrast(1.5) brightness(1.3)' filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />
<img <img
@ -259,15 +275,31 @@ export default function Home() {
alt="" alt=""
style={{ style={{
position: 'absolute', position: 'absolute',
bottom: '15px', bottom: '5px',
left: '10%', left: '5%',
transform: 'rotate(30deg)', transform: 'rotate(30deg)',
width: '300px', width: '600px',
height: '150px', height: '300px',
pointerEvents: 'none', pointerEvents: 'none',
zIndex: -1, zIndex: -1,
opacity: 0.2, opacity: 0.3,
filter: 'contrast(1.5) brightness(1.3)' filter: 'contrast(1.8) brightness(1.4)'
}}
/>
<img
src={go4LogoPath}
alt=""
style={{
position: 'absolute',
top: '30px',
left: '50%',
transform: 'rotate(-45deg)',
width: '500px',
height: '250px',
pointerEvents: 'none',
zIndex: -1,
opacity: 0.25,
filter: 'contrast(1.8) brightness(1.4)'
}} }}
/> />