Mr.Gay100
/
steelforesight
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add compressed hero background video (40MB → 10MB) 

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
alireza 2026-05-31 12:23:22 +03:30
parent 3643c5cfea
commit 4e0f2e2a0e
1 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/pages/Home/sections/HeroSection.tsx
View File

@ -36,8 +36,18 @@ export default function HeroSection() {
justifyContent: 'center',
}}
>
{/* Background video */}
<video
aria-hidden="true"
autoPlay
muted
loop
playsInline
style={{ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover', zIndex: 0 }}
src="/hero-bg.mp4"
/>
{/* Dark overlay */}
<div aria-hidden="true" style={{ position: 'absolute', inset: 0, background: 'linear-gradient(135deg, rgba(26,23,18,0.92) 0%, rgba(26,23,18,0.70) 100%)', zIndex: 1 }} />
<div aria-hidden="true" style={{ position: 'absolute', inset: 0, background: 'linear-gradient(135deg, rgba(26,23,18,0.88) 0%, rgba(26,23,18,0.72) 100%)', zIndex: 1 }} />
{/* Grid texture */}
<div aria-hidden="true" style={{ position: 'absolute', inset: 0, backgroundImage: 'linear-gradient(to right, rgba(244,239,231,0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(244,239,231,0.03) 1px, transparent 1px)', backgroundSize: '80px 80px', pointerEvents: 'none', zIndex: 2 }} />
{/* Red glow */}