diff --git a/index.html b/index.html index 5d5e000..cf4e0cc 100644 --- a/index.html +++ b/index.html @@ -612,7 +612,7 @@ - This website runs on green hosting - verified by thegreenwebfoundation.org diff --git a/src/scripts/animations/light-rays.js b/src/scripts/animations/light-rays.js index 1837235..3e1f68e 100644 --- a/src/scripts/animations/light-rays.js +++ b/src/scripts/animations/light-rays.js @@ -36,14 +36,21 @@ export function initLightRays(container, options = {}) { const blend = options.blend ?? 0.65; const raysSpeed = options.raysSpeed ?? 1.8; const lightSpread = options.lightSpread ?? 0.7; - const rayLength = options.rayLength ?? 0.6; + const isMobile = window.innerWidth < 768; + console.log('Mobile detection:', isMobile, 'window.innerWidth:', window.innerWidth); + const baseRayLength = options.rayLength ?? 0.6; + const rayLength = isMobile ? baseRayLength * 3.0 : baseRayLength * 1.8; const pulsating = Boolean(options.pulsating); - const fadeDistance = options.fadeDistance ?? 0.4; + const baseFadeDistance = options.fadeDistance ?? 0.4; + const fadeDistance = isMobile ? baseFadeDistance * 3.0 : baseFadeDistance * 1.8; + const baseGlowFalloffFactor = 4.9; + const glowFalloffFactor = isMobile ? baseGlowFalloffFactor / 3.0 : baseGlowFalloffFactor / 1.8; const saturation = options.saturation ?? 1.4; const followMouse = options.followMouse !== false; const mouseInfluence = options.mouseInfluence ?? 0.12; const noiseAmount = options.noiseAmount ?? 0.08; const distortion = options.distortion ?? 0.04; + console.log('Ray length:', rayLength, 'Fade distance:', fadeDistance, 'Glow falloff factor:', glowFalloffFactor); const mouse = { x: 0.5, y: 0.5 }; const smoothMouse = { x: 0.5, y: 0.5 }; @@ -96,6 +103,7 @@ export function initLightRays(container, options = {}) { uniform float mouseInfluence; uniform float noiseAmount; uniform float distortion; + uniform float glowFalloffFactor; float noise(vec2 st) { return fract(sin(dot(st.xy, vec2(12.9898,78.233))) * 43758.5453123); @@ -149,7 +157,7 @@ export function initLightRays(container, options = {}) { float maxDim = max(iResolution.x, iResolution.y); float distFromSource = length(coord - rayPos) / maxDim; - float glowFalloff = clamp(1.3 - distFromSource * 2.5, 0.4, 1.6); + float glowFalloff = clamp(1.01 - distFromSource * glowFalloffFactor, 0.01, 1.6); color.rgb *= glowFalloff; if (saturation != 1.0) { @@ -179,7 +187,8 @@ export function initLightRays(container, options = {}) { mousePos: { value: [0.5, 0.5] }, mouseInfluence: { value: mouseInfluence }, noiseAmount: { value: noiseAmount }, - distortion: { value: distortion } + distortion: { value: distortion }, + glowFalloffFactor: { value: glowFalloffFactor } }; const geometry = new Triangle(gl); diff --git a/src/styles/components/buttons.css b/src/styles/components/buttons.css index 62d59d7..8c89f0c 100644 --- a/src/styles/components/buttons.css +++ b/src/styles/components/buttons.css @@ -55,7 +55,7 @@ } .hero-cta:hover { - transform: scale(0.97); + transform: scale(0.99); } .hero-cta:active { @@ -84,10 +84,6 @@ transition: transform 0.2s ease, box-shadow 0.2s ease; } -.hero-cta-light:hover { - transform: translateY(-1px); -} - @media (hover: none) and (pointer: coarse) { .btn { min-height: 48px; diff --git a/src/styles/components/glass-surface.css b/src/styles/components/glass-surface.css index 5ea958e..65a2d5a 100644 --- a/src/styles/components/glass-surface.css +++ b/src/styles/components/glass-surface.css @@ -41,12 +41,4 @@ white-space: nowrap; border-radius: inherit; pointer-events: auto; -} - -.glass-surface:hover .glass-surface__backdrop { - border-color: rgba(255, 255, 255, 0.45); - box-shadow: - inset 0 1px 2px 0 rgba(255, 255, 255, 0.6), - inset 0 -1px 1px 0 rgba(255, 255, 255, 0.15), - 0 6px 20px 0 rgba(0, 0, 0, 0.35); } \ No newline at end of file diff --git a/src/styles/components/marquee.css b/src/styles/components/marquee.css index fb715c1..f1ced6f 100644 --- a/src/styles/components/marquee.css +++ b/src/styles/components/marquee.css @@ -24,7 +24,7 @@ } .marquee-row { - overflow: hidden; + overflow: visible; width: 100%; transform: translateZ(0); } @@ -74,4 +74,4 @@ animation: none !important; transform: none !important; } -} +} \ No newline at end of file diff --git a/src/styles/sections/cta-banner.css b/src/styles/sections/cta-banner.css index da6a559..033d0df 100644 --- a/src/styles/sections/cta-banner.css +++ b/src/styles/sections/cta-banner.css @@ -1,6 +1,6 @@ .cta-footer-wrap { position: relative; - overflow: hidden; + overflow: visible; isolation: isolate; background: #000000; width: 100%; @@ -9,9 +9,9 @@ .cta-rays-container { position: absolute; - inset: 0; + inset: -50vh 0 0 0; width: 100%; - height: 100%; + height: calc(100% + 50vh); pointer-events: none; z-index: 1; }