Skip to content

Commit a047233

Browse files
lovable-dev[bot]lovable-dev[bot]
committed
Visual edit in Lovable
Edited UI in Lovable
1 parent 0c903fd commit a047233

File tree

1 file changed

+50
-59
lines changed

1 file changed

+50
-59
lines changed

‎src/components/Hero.tsx‎

Lines changed: 50 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,40 @@
1-
21
import React from 'react';
32
import { motion } from 'framer-motion';
43
import { Button } from '@/components/ui/button';
54
import { ScrollText, Globe, Orbit } from 'lucide-react';
65
import { Link } from 'react-router-dom';
7-
86
const Hero = () => {
9-
return (
10-
<div className="relative min-h-[calc(100vh-4rem)] flex flex-col items-center justify-center py-16 overflow-hidden">
7+
return <div className="relative min-h-[calc(100vh-4rem)] flex flex-col items-center justify-center py-16 overflow-hidden">
118
<div className="container relative z-10 px-4 mx-auto text-center">
12-
<motion.div
13-
initial={{ opacity: 0, y: 20 }}
14-
animate={{ opacity: 1, y: 0 }}
15-
transition={{ duration: 0.8 }}
16-
className="mb-8"
17-
>
9+
<motion.div initial={{
10+
opacity: 0,
11+
y: 20
12+
}} animate={{
13+
opacity: 1,
14+
y: 0
15+
}} transition={{
16+
duration: 0.8
17+
}} className="mb-8">
1818
<div className="flex flex-col justify-center items-center mb-6 relative">
19-
<motion.img
20-
src="/lovable-uploads/ALogo.png"
21-
alt="AlienFlowSpaceDAO Logo"
22-
className="h-24 md:h-28 gold-glow z-20"
23-
initial={{ scale: 0.8 }}
24-
animate={{
25-
scale: [1, 1.05, 1],
26-
rotate: [0, 2, 0],
27-
y: [0, -10, 0]
28-
}}
29-
transition={{
30-
duration: 6,
31-
repeat: Infinity,
32-
repeatType: "reverse"
33-
}}
34-
/>
19+
<motion.img src="/lovable-uploads/ALogo.png" alt="AlienFlowSpaceDAO Logo" className="h-24 md:h-28 gold-glow z-20" initial={{
20+
scale: 0.8
21+
}} animate={{
22+
scale: [1, 1.05, 1],
23+
rotate: [0, 2, 0],
24+
y: [0, -10, 0]
25+
}} transition={{
26+
duration: 6,
27+
repeat: Infinity,
28+
repeatType: "reverse"
29+
}} />
3530
</div>
3631

3732
<div className="star-wars-crawl mb-4">
3833
<div className="star-wars-content py-4">
39-
<h1
40-
className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl mb-3 text-glow text-center font-nasalization leading-tight"
41-
style={{
42-
fontFamily: "'Nasalization', sans-serif !important",
43-
letterSpacing: '0.02em'
44-
}}
45-
>
34+
<h1 style={{
35+
fontFamily: "'Nasalization', sans-serif !important",
36+
letterSpacing: '0.02em'
37+
}} className="text-3xl sm:text-4xl lg:text-6xl mb-3 text-glow text-center font-nasalization leading-tight md:text-6xl">
4638
<span className="text-alien-green">Δlieπ</span>
4739
<span className="text-alien-gold">FlΦw</span>
4840
<span className="text-alien-green"> $pac€</span>
@@ -53,52 +45,51 @@ const Hero = () => {
5345

5446
<div className="star-wars-crawl mb-4">
5547
<div className="star-wars-content py-2">
56-
<motion.p
57-
className="text-base sm:text-lg md:text-xl text-gray-300 max-w-4xl mx-auto font-[Exo] text-center leading-relaxed"
58-
style={{ letterSpacing: '0.01em' }}
59-
initial={{ opacity: 0 }}
60-
animate={{ opacity: 1 }}
61-
transition={{ delay: 0.3, duration: 0.8 }}
62-
>
48+
<motion.p className="text-base sm:text-lg md:text-xl text-gray-300 max-w-4xl mx-auto font-[Exo] text-center leading-relaxed" style={{
49+
letterSpacing: '0.01em'
50+
}} initial={{
51+
opacity: 0
52+
}} animate={{
53+
opacity: 1
54+
}} transition={{
55+
delay: 0.3,
56+
duration: 0.8
57+
}}>
6358
Access & Explore the DAO with Innovative Solutions, Unlock Energy Efficiency & Environmental Sustainability, Uniting: BioFi, DeFi, DePin, DeSci, IPFS, QFS, ReFi, RWA, SocialFi, and TradFi under one cosmic ecosystem.
6459
</motion.p>
6560
</div>
6661
</div>
6762
</motion.div>
6863

69-
<motion.div
70-
className="flex flex-wrap justify-center gap-4 mt-8"
71-
initial={{ opacity: 0, y: 20 }}
72-
animate={{ opacity: 1, y: 0 }}
73-
transition={{ delay: 0.5, duration: 0.8 }}
74-
>
64+
<motion.div className="flex flex-wrap justify-center gap-4 mt-8" initial={{
65+
opacity: 0,
66+
y: 20
67+
}} animate={{
68+
opacity: 1,
69+
y: 0
70+
}} transition={{
71+
delay: 0.5,
72+
duration: 0.8
73+
}}>
7574
<Link to="/about">
76-
<Button
77-
className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors"
78-
>
75+
<Button className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors">
7976
<Orbit className="mr-2 h-4 w-4" /> About Enter Portal
8077
</Button>
8178
</Link>
8279

8380
<Link to="/alien-trip">
84-
<Button
85-
className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors"
86-
>
81+
<Button className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors">
8782
<ScrollText className="mr-2 h-4 w-4" /> Alientrip Manifesto
8883
</Button>
8984
</Link>
9085

9186
<Link to="/contact">
92-
<Button
93-
className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors"
94-
>
87+
<Button className="bg-alien-green text-alien-gold hover:bg-alien-gold hover:text-alien-green font-nasalization px-6 sm:px-8 py-4 sm:py-5 text-sm sm:text-base rounded-full transition-colors">
9588
<Globe className="mr-2 h-4 w-4" /> Contact & Join
9689
</Button>
9790
</Link>
9891
</motion.div>
9992
</div>
100-
</div>
101-
);
93+
</div>;
10294
};
103-
104-
export default Hero;
95+
export default Hero;

0 commit comments

Comments
 (0)