ourworld_web/hero_web_try1
26
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

...

Browse Source
This commit is contained in:
despiegk 2025-08-03 07:16:59 +02:00
parent 4be83564fa
commit 484f3d3e1b
26 changed files with 40 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
index.html
View File

@ -9,5 +9,6 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/main.jsx"></script> <script type="module" src="/src/main.jsx"></script>
<script src="https://player.vimeo.com/api/player.js"></script>
</body> </body>
</html> </html>

BIN
src/assets/47WALTyZu0ep.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 67 KiB

BIN
src/assets/LubjiSy2yrT2.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 25 KiB

BIN
src/assets/balls.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 204 KiB

BIN
src/assets/bjNv78U6CA3e.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 61 KiB

BIN
src/assets/city_digital.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 390 KiB

BIN
src/assets/communicate.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 224 KiB

BIN
src/assets/develop.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 220 KiB

BIN
src/assets/discover.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 63 KiB

BIN
src/assets/heart.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 172 KiB

BIN
src/assets/heartblue.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 357 KiB

BIN
src/assets/herowork.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 453 KiB

BIN
src/assets/myherozoom.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 MiB

BIN
src/assets/person.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 69 KiB

BIN
src/assets/poVm1zm8mO0y.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.5 KiB

BIN
src/assets/share.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 227 KiB

BIN
src/assets/sphere.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 434 KiB

BIN
src/assets/swarm.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 309 KiB

BIN
src/assets/transact.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 130 KiB

BIN
src/assets/white_keyb.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 94 KiB

BIN
src/assets/yKQ5gi1xUIrM.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 16 KiB

1
src/components/HeroSection.jsx
View File

@ -103,3 +103,4 @@ const HeroSection = ({
export default HeroSection; export default HeroSection;

35
src/pages/Blog.jsx
View File

@ -6,10 +6,10 @@ import Section from '../components/Section';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
// Import images // Import images
import blogBackground from '../assets/8a1DncT2SIYs.jpeg'; // Dark AI import blogBackground from '../assets/myhero.jpg'; // HERO background with panning effect
import post1Image from '../assets/VQMVMsOGQyW8.jpg'; // Emotional tech import post1Image from '../assets/VQMVMsOGQyW8.jpg'; // Emotional tech
import post2Image from '../assets/H2coK1FCuiPB.jpeg'; // AI Agent creation import post2Image from '../assets/balls.jpg'; // AI Agent creation
import post3Image from '../assets/bjNv78U6CA3e.jpg'; // Digital privacy import post3Image from '../assets/white_keyb.jpg'; // Digital privacy
const Blog = () => { const Blog = () => {
const featuredPost = { const featuredPost = {
@ -91,16 +91,25 @@ const Blog = () => {
return ( return (
<div className="min-h-screen"> <div className="min-h-screen">
{/* Hero Section */} {/* Hero Section with lower positioning */}
<HeroSection <div className="relative min-h-screen">
subtitle="Insights & Updates" <HeroSection
title="HERO Blog" subtitle="Insights & Updates"
description="Stay informed about the latest developments in digital sovereignty, Personal Agents, and the future of private technology." title="HERO Blog"
backgroundImage={blogBackground} description="Stay informed about the latest developments in digital sovereignty, Personal Agents, and the future of private technology."
ctaText="Subscribe to Updates" backgroundImage={blogBackground}
ctaLink="#subscribe" ctaText="Subscribe to Updates"
showVideo={false} ctaLink="#subscribe"
/> showVideo={false}
/>
<style>{`
.relative.min-h-screen > section {
display: flex !important;
align-items: flex-end !important;
padding-bottom: 8rem !important;
}
`}</style>
</div>
{/* Featured Post Section */} {/* Featured Post Section */}
<Section background="gradient" padding="xlarge"> <Section background="gradient" padding="xlarge">

22
src/pages/Home.jsx
View File

@ -7,11 +7,13 @@ import FeatureCard from '../components/FeatureCard';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
// Import images // Import images
import networkImage from '../assets/yKQ5gi1xUIrM.jpg'; // Connected lines import networkImage from '../assets/discover.jpg'; // Connected lines
import heartTechImage from '../assets/LubjiSy2yrT2.jpg'; // Technology heart import heartTechImage from '../assets/heart.jpg'; // Technology heart
import humanConnectionImage from '../assets/htZtx22e5QlA.jpg'; // Digital human connection import humanConnectionImage from '../assets/myherozoom.png'; // Digital human connection
import privacyImage from '../assets/wD5nv0lVwg3i.jpg'; // Digital privacy import privacyImage from '../assets/share.jpg'; // Digital privacy
import blockchainImage from '../assets/iQoW0Ohet4Cz.jpg'; // Blockchain visualization import transactImage from '../assets/transact.jpg'; // Digital transaction
import developImage from '../assets/develop.jpg'; // Development scene
import communicateImage from '../assets/communicate.jpg'; // Communication scene
const Home = () => { const Home = () => {
const capabilities = [ const capabilities = [
@ -19,7 +21,7 @@ const Home = () => {
icon: <Brain size={32} />, icon: <Brain size={32} />,
title: "Communicate", title: "Communicate",
description: "Secure messaging, voice, and video chat — all managed privately by your Personal Agent", description: "Secure messaging, voice, and video chat — all managed privately by your Personal Agent",
image: humanConnectionImage image: communicateImage
}, },
{ {
icon: <Zap size={32} />, icon: <Zap size={32} />,
@ -37,7 +39,7 @@ const Home = () => {
icon: <Users size={32} />, icon: <Users size={32} />,
title: "Develop", title: "Develop",
description: "Build and deploy applications faster with local AI and secure storage", description: "Build and deploy applications faster with local AI and secure storage",
image: blockchainImage image: developImage
}, },
{ {
icon: <Lock size={32} />, icon: <Lock size={32} />,
@ -49,7 +51,7 @@ const Home = () => {
icon: <Heart size={32} />, icon: <Heart size={32} />,
title: "Transact", title: "Transact",
description: "Send and receive digital value safely and without intermediaries", description: "Send and receive digital value safely and without intermediaries",
image: networkImage image: transactImage
} }
]; ];
@ -76,12 +78,12 @@ const Home = () => {
showVideo={true} showVideo={true}
videoEmbed={ videoEmbed={
<iframe <iframe
src="https://player.vimeo.com/video/1106820500?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&background=1&muted=1&loop=1" src="https://player.vimeo.com/video/1106821376?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&background=1&muted=1&loop=1"
frameBorder="0" frameBorder="0"
allow="autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media; web-share" allow="autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media; web-share"
referrerPolicy="strict-origin-when-cross-origin" referrerPolicy="strict-origin-when-cross-origin"
style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%", objectFit: "cover"}} style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%", objectFit: "cover"}}
title="heroback1" title="HERO BACK 2"
/> />
} }
ctaText="Start Your Journey" ctaText="Start Your Journey"

4
src/pages/How.jsx
View File

@ -6,8 +6,8 @@ import Section from '../components/Section';
import FeatureCard from '../components/FeatureCard'; import FeatureCard from '../components/FeatureCard';
// Import images // Import images
import agentImage from '../assets/H2coK1FCuiPB.jpeg'; // AI Agent Creation import agentImage from '../assets/balls.jpg'; // AI Agent Creation
import memoryImage from '../assets/bjNv78U6CA3e.jpg'; // Digital privacy/memory import memoryImage from '../assets/white_keyb.jpg'; // Digital privacy/memory
import ledgerImage from '../assets/SXifMdAlG29t.png'; // Blockchain visualization import ledgerImage from '../assets/SXifMdAlG29t.png'; // Blockchain visualization
import networkImage from '../assets/tech.jpg'; // Technology visualization with panning effect import networkImage from '../assets/tech.jpg'; // Technology visualization with panning effect

4
src/pages/Technology.jsx
View File

@ -8,8 +8,8 @@ import FeatureCard from '../components/FeatureCard';
// Import images // Import images
import techBackground from '../assets/herotech.jpg'; // HERO Technology background import techBackground from '../assets/herotech.jpg'; // HERO Technology background
import blockchainImage from '../assets/SXifMdAlG29t.png'; // Blockchain visualization import blockchainImage from '../assets/SXifMdAlG29t.png'; // Blockchain visualization
import networkImage from '../assets/yKQ5gi1xUIrM.jpg'; // Connected lines import networkImage from '../assets/discover.jpg'; // Connected lines
import securityImage from '../assets/bjNv78U6CA3e.jpg'; // Digital privacy import securityImage from '../assets/white_keyb.jpg'; // Digital privacy
const Technology = () => { const Technology = () => {
const comparisonData = [ const comparisonData = [