veda/www_veda_2025
12
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
sasha-astiadi
2025-08-21 16:13:23 +02:00
parent 563ff04ae5
commit 82394b564f
20 changed files with 239 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/Hero.jsx
View File

@@ -5,36 +5,42 @@ import { Container } from '@/components/Container'
export function Hero() {
return (
<section className="relative w-full h-screen -mt-24">
<section className="relative w-full h-screen lg:mt-0 mt-0">
{/* Background Video */}
<div className="absolute top-0 left-0 w-full h-full z-0">
<div style={{padding: '56.25% 0 0 0', position: 'relative', height: '100%'}}>
<iframe
src="https://player.vimeo.com/video/1111694092?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&loop=1&muted=1&background=1"
frameBorder="0"
allow="autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media; web-share"
referrerPolicy="strict-origin-when-cross-origin"
style={{position: 'absolute', top: 0, left: 0, width: '100%', height: '100%'}}
title="hero2"
/>
</div>
</div>
<video
autoPlay
loop
muted
playsInline
className="absolute top-0 left-0 w-full h-full object-cover z-0 bg-[#FEFFF6] opacity-20"
>
<source src="/videos/hero4.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
{/* Welcome Content Overlay */}
<div className="bg-[#FEFFF6] py-6 mt-0 absolute -bottom-20 left-0 right-0 z-10">
<div className="mx-auto max-w-7xl px-6 lg:px-4">
<div className="mx-auto max-w-5xl lg:mx-0">
<h2 className="mt-2 text-2xl font-medium tracking-[-0.05em] text-[#1f4922] lg:text-3xl">Veda welcomes you into her home providing unique wellness cruises blending cultural authentic experiences with unparalleled freedom and privacy.
Our organic cuisine, cultural activities and dedicated warm hearted crew will make your veda cruise an unforgettable experience.
</h2>
<div className="bg-transparent py-6 mt-0 absolute top-16 sm:top-32 left-0 right-0 z-10">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-4">
<div className="flex items-start justify-start mb-4">
<Image src="/images/logos/veda_logo_dark.svg" alt="VEDA" width={200} height={60} className="h-8 sm:h-12 w-auto" unoptimized />
</div>
<div className="mx-auto max-w-5xl lg:mx-0 mt-4 sm:mt-6">
<h2 className="text-lg sm:text-2xl font-medium tracking-[-0.05em] text-darkgr-800 lg:text-3xl">
Veda welcomes you into her home providing unique wellness cruises blending cultural authentic experiences with unparalleled freedom and privacy.
</h2>
<h2 className="mt-2 text-lg sm:text-2xl font-medium tracking-[-0.05em] text-darkgr-800 lg:text-3xl">
Our organic cuisine, cultural activities and dedicated warm hearted crew will make your veda cruise an unforgettable experience.
</h2>
</div>
<div className="mx-auto max-w-3xl lg:mx-0">
<p className="mt-6 text-2xl font-semibold tracking-[-0.05em] text-[#1f4922] lg:text-3xl">
<p className="mt-4 sm:mt-6 text-2xl sm:text-3xl font-semibold tracking-[-0.05em] text-darkgr-700 lg:text-4xl">
Nile Cruises, Reimagined.
</p>
<p className="mt-4 mb-12 font-normal text-pretty text-gray-950 sm:text-lg">
</p>
<Button href="/story" color="blue" className="mt-6 sm:mt-8">
<span className="font-semibold tracking-wide">
Read Our Story
</span>
</Button>
</div>
</div>
</div>