Make background logo elements significantly larger and more prominent
Update various CSS styles for background logo elements in the search header and home page components to increase their width and height by approximately 8x, and adjust z-index for proper layering. 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/ccOtxbC
This commit is contained in:
sebastjanartic
parent
0998b6daf6
commit
51662647b3
@ -45,21 +45,21 @@ export default function SearchHeader({
|
||||
|
||||
return (
|
||||
<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 - veliki in vidni */}
|
||||
{/* go4.video logoti v headerju - ogromni v ozadju */}
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '2px',
|
||||
right: '15%',
|
||||
transform: 'rotate(-15deg)',
|
||||
width: '200px',
|
||||
height: '100px',
|
||||
width: '1600px',
|
||||
height: '800px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 1,
|
||||
zIndex: -10,
|
||||
opacity: 0.7,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -70,14 +70,14 @@ export default function SearchHeader({
|
||||
top: '5px',
|
||||
left: '20%',
|
||||
transform: 'rotate(25deg)',
|
||||
width: '180px',
|
||||
height: '90px',
|
||||
width: '1440px',
|
||||
height: '720px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 1,
|
||||
zIndex: -10,
|
||||
opacity: 0.65,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -88,14 +88,14 @@ export default function SearchHeader({
|
||||
top: '8px',
|
||||
right: '45%',
|
||||
transform: 'rotate(-35deg)',
|
||||
width: '160px',
|
||||
height: '80px',
|
||||
width: '1280px',
|
||||
height: '640px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 1,
|
||||
zIndex: -10,
|
||||
opacity: 0.6,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
|
||||
@ -85,7 +85,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 - veliki go4.video logoti po različnih kotih */}
|
||||
{/* Background logo decorations - ogromni go4.video logoti v ozadju */}
|
||||
{/* Zgoraj levo */}
|
||||
<div
|
||||
style={{
|
||||
@ -93,14 +93,14 @@ export default function Home() {
|
||||
top: '5%',
|
||||
left: '3%',
|
||||
transform: 'rotate(-25deg)',
|
||||
width: '300px',
|
||||
height: '150px',
|
||||
width: '2400px',
|
||||
height: '1200px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.6,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -112,14 +112,14 @@ export default function Home() {
|
||||
top: '8%',
|
||||
right: '2%',
|
||||
transform: 'rotate(30deg)',
|
||||
width: '280px',
|
||||
height: '140px',
|
||||
width: '2240px',
|
||||
height: '1120px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.55,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -131,14 +131,14 @@ export default function Home() {
|
||||
top: '40%',
|
||||
left: '1%',
|
||||
transform: 'rotate(18deg)',
|
||||
width: '260px',
|
||||
height: '130px',
|
||||
width: '2080px',
|
||||
height: '1040px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.5,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -150,14 +150,14 @@ export default function Home() {
|
||||
top: '45%',
|
||||
right: '1%',
|
||||
transform: 'rotate(-35deg)',
|
||||
width: '240px',
|
||||
height: '120px',
|
||||
width: '1920px',
|
||||
height: '960px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.45,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -169,14 +169,14 @@ export default function Home() {
|
||||
top: '75%',
|
||||
left: '2%',
|
||||
transform: 'rotate(-15deg)',
|
||||
width: '220px',
|
||||
height: '110px',
|
||||
width: '1760px',
|
||||
height: '880px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.4,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -188,14 +188,14 @@ export default function Home() {
|
||||
top: '80%',
|
||||
right: '3%',
|
||||
transform: 'rotate(22deg)',
|
||||
width: '200px',
|
||||
height: '100px',
|
||||
width: '1600px',
|
||||
height: '800px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.35,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -220,21 +220,21 @@ 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 - veliki in vidni */}
|
||||
{/* go4.video logoti v footerju - ogromni v ozadju */}
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '10px',
|
||||
right: '8%',
|
||||
transform: 'rotate(-20deg)',
|
||||
width: '250px',
|
||||
height: '125px',
|
||||
width: '2000px',
|
||||
height: '1000px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 1,
|
||||
zIndex: -10,
|
||||
opacity: 0.7,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -245,14 +245,14 @@ export default function Home() {
|
||||
bottom: '10px',
|
||||
left: '5%',
|
||||
transform: 'rotate(30deg)',
|
||||
width: '220px',
|
||||
height: '110px',
|
||||
width: '1760px',
|
||||
height: '880px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 1,
|
||||
zIndex: -10,
|
||||
opacity: 0.65,
|
||||
filter: 'blur(0.1px)'
|
||||
}}
|
||||
@ -263,14 +263,14 @@ export default function Home() {
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'rotate(-45deg)',
|
||||
width: '180px',
|
||||
height: '90px',
|
||||
width: '1440px',
|
||||
height: '720px',
|
||||
backgroundImage: `url(${go4LogoPath})`,
|
||||
backgroundSize: 'contain',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'center',
|
||||
pointerEvents: 'none',
|
||||
zIndex: 0,
|
||||
zIndex: -10,
|
||||
opacity: 0.3,
|
||||
filter: 'blur(0.2px)'
|
||||
}}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user