Skip to content

Commit 1e7aa61

Browse files
lovable-dev[bot]lovable-dev[bot]
committed
Fix: Improve UI and content organization
- Make menu titles bolder. - Clean up visual elements in Explore Spaces and DAO Ecosystem sections. - Move stats to the "Join the Cosmic Governance" section.
1 parent 3f503d1 commit 1e7aa61

File tree

7 files changed

+95
-109
lines changed

7 files changed

+95
-109
lines changed

‎src/components/EcosystemSection.tsx‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1+
12
import React from 'react';
23
import { motion } from 'framer-motion';
34
import { Dna, Coins, Wifi, Beaker, Database, Shield, Leaf, Building, Share2, Landmark, ArrowRight } from 'lucide-react';
5+
46
const ecosystems = [{
57
id: 'biofi',
68
title: 'BioFi',
@@ -52,6 +54,7 @@ const ecosystems = [{
5254
description: 'Traditional finance integration and bridging.',
5355
icon: <Landmark className="h-8 w-8 text-alien-gold" />
5456
}];
57+
5558
const EcosystemCard = ({
5659
ecosystem,
5760
index
@@ -86,6 +89,7 @@ const EcosystemCard = ({
8689
</div>
8790
</motion.div>;
8891
};
92+
8993
const EcosystemSection = () => {
9094
return <section id="ecosystem" className="relative overflow-hidden cosmic-grid py-[30px] my-[10px]">
9195
<div className="container mx-auto px-4">
@@ -108,9 +112,8 @@ const EcosystemSection = () => {
108112
</div>
109113
</div>
110114

111-
{/* Background decoration */}
112-
<div className="absolute -bottom-40 -right-40 w-80 h-80 bg-alien-green opacity-5 rounded-full blur-3xl"></div>
113-
<div className="absolute -top-20 -left-20 w-60 h-60 bg-alien-gold opacity-5 rounded-full blur-2xl"></div>
115+
{/* Remove background decoration */}
114116
</section>;
115117
};
116-
export default EcosystemSection;
118+
119+
export default EcosystemSection;

‎src/components/ExploreSpacesSection.tsx‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ const ExploreSpacesSection = () => {
3636
viewport={{ once: true }}
3737
className="text-center mb-16"
3838
>
39-
<h2 className="text-4xl font-bold mb-4 text-alien-gold text-glow font-[Atomic Age]">Explore Spaces</h2>
39+
<h2 className="text-4xl font-bold mb-4 text-alien-gold text-glow font-atomic">Explore Spaces</h2>
4040
<p className="text-xl text-gray-300 max-w-3xl mx-auto">
4141
Discover specialized environments designed to enhance your journey through the cosmos
4242
</p>
@@ -55,7 +55,7 @@ const ExploreSpacesSection = () => {
5555
<div className="mb-6 p-4 bg-alien-space-dark rounded-full">
5656
{space.icon}
5757
</div>
58-
<h3 className="text-2xl font-bold mb-4 text-alien-gold font-[Atomic Age]">{space.title}</h3>
58+
<h3 className="text-2xl font-bold mb-4 text-alien-gold font-atomic">{space.title}</h3>
5959
<p className="text-gray-300 mb-8 flex-grow">{space.description}</p>
6060
<Link to={space.link}>
6161
<Button className="bg-alien-green hover:bg-alien-green-light text-alien-space-dark">
@@ -67,9 +67,7 @@ const ExploreSpacesSection = () => {
6767
</div>
6868
</div>
6969

70-
{/* Background decorations */}
71-
<div className="absolute -bottom-20 -right-20 w-80 h-80 bg-alien-green opacity-5 rounded-full blur-3xl"></div>
72-
<div className="absolute -top-20 -left-20 w-60 h-60 bg-alien-gold opacity-5 rounded-full blur-2xl"></div>
70+
{/* Remove background decorations that were causing yellow glow */}
7371
</section>
7472
);
7573
};

‎src/components/Header/DesktopNav.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,16 +14,16 @@ const DesktopNav = () => {
1414
return (
1515
<nav className="hidden md:flex items-center gap-6">
1616
<div className="hidden md:flex space-x-4">
17-
<Link to="/" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-semibold">
17+
<Link to="/" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-bold">
1818
Home
1919
</Link>
20-
<Link to="/about" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-semibold">
20+
<Link to="/about" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-bold">
2121
About
2222
</Link>
23-
<Link to="/alien-trip" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-semibold">
23+
<Link to="/alien-trip" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-bold">
2424
AlienTrip
2525
</Link>
26-
<Link to="/contact" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-semibold">
26+
<Link to="/contact" className="text-alien-gold hover:text-alien-green px-2 py-2 font-atomic font-bold">
2727
Contact
2828
</Link>
2929

@@ -32,7 +32,7 @@ const DesktopNav = () => {
3232
<DropdownMenuTrigger asChild>
3333
<Button
3434
variant="ghost"
35-
className="text-alien-gold hover:text-alien-green bg-transparent hover:bg-alien-space-light/30 px-2 py-2 rounded flex items-center group font-atomic font-semibold"
35+
className="text-alien-gold hover:text-alien-green bg-transparent hover:bg-alien-space-light/30 px-2 py-2 rounded flex items-center group font-atomic font-bold"
3636
>
3737
Explore Spaces
3838
<ChevronDown
@@ -50,7 +50,7 @@ const DesktopNav = () => {
5050
className="flex items-start p-2 rounded-lg hover:bg-alien-space-light/20 group cursor-pointer"
5151
>
5252
<div className="flex-1">
53-
<h3 className="text-alien-gold group-hover:text-alien-green font-semibold mb-1 font-atomic">Academy</h3>
53+
<h3 className="text-alien-gold group-hover:text-alien-green font-bold mb-1 font-atomic">Academy</h3>
5454
<p className="text-sm text-gray-400">Unlock cosmic knowledge through educational resources</p>
5555
</div>
5656
</Link>
@@ -61,7 +61,7 @@ const DesktopNav = () => {
6161
className="flex items-start p-2 rounded-lg hover:bg-alien-space-light/20 group cursor-pointer"
6262
>
6363
<div className="flex-1">
64-
<h3 className="text-alien-gold group-hover:text-alien-green font-semibold mb-1 font-atomic">Clubs</h3>
64+
<h3 className="text-alien-gold group-hover:text-alien-green font-bold mb-1 font-atomic">Clubs</h3>
6565
<p className="text-sm text-gray-400">Join specialized communities focused on interests</p>
6666
</div>
6767
</Link>
@@ -72,7 +72,7 @@ const DesktopNav = () => {
7272
className="flex items-start p-2 rounded-lg hover:bg-alien-space-light/20 group cursor-pointer"
7373
>
7474
<div className="flex-1">
75-
<h3 className="text-alien-gold group-hover:text-alien-green font-semibold mb-1 font-atomic">CoNetWorKing</h3>
75+
<h3 className="text-alien-gold group-hover:text-alien-green font-bold mb-1 font-atomic">CoNetWorKing</h3>
7676
<p className="text-sm text-gray-400">Connect with like-minded and profits across the multiverse</p>
7777
</div>
7878
</Link>
@@ -110,7 +110,7 @@ const DesktopNav = () => {
110110
].map((lang) => (
111111
<DropdownMenuItem
112112
key={lang.code}
113-
className="flex items-center gap-2 text-alien-gold hover:text-alien-green hover:bg-alien-space-light/20 cursor-pointer p-2 rounded"
113+
className="flex items-center gap-2 text-alien-gold hover:text-alien-green hover:bg-alien-space-light/20 cursor-pointer p-2 rounded font-bold"
114114
>
115115
<img
116116
src={`https://flagcdn.com/w20/${lang.code}.png`}

‎src/components/Header/MobileNav.tsx‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
12
import React, { useState } from 'react';
23
import { motion } from 'framer-motion';
34
import { Link } from 'react-router-dom';
@@ -26,28 +27,28 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
2627
<nav className="flex flex-col space-y-4">
2728
<Link
2829
to="/"
29-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-semibold"
30+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-bold"
3031
onClick={() => setIsMenuOpen(false)}
3132
>
3233
Home
3334
</Link>
3435
<Link
3536
to="/about"
36-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-semibold"
37+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-bold"
3738
onClick={() => setIsMenuOpen(false)}
3839
>
3940
About
4041
</Link>
4142
<Link
4243
to="/alien-trip"
43-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-semibold"
44+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-bold"
4445
onClick={() => setIsMenuOpen(false)}
4546
>
4647
AlienTrip
4748
</Link>
4849
<Link
4950
to="/contact"
50-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-semibold"
51+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md font-atomic font-bold"
5152
onClick={() => setIsMenuOpen(false)}
5253
>
5354
Contact
@@ -57,7 +58,7 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
5758
<div className="flex flex-col">
5859
<button
5960
onClick={() => setSpacesExpanded(!spacesExpanded)}
60-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md flex justify-between items-center font-atomic font-semibold"
61+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md flex justify-between items-center font-atomic font-bold"
6162
>
6263
<span>Explore Spaces</span>
6364
{spacesExpanded ? <ChevronUp size={16} /> : <ChevronDown size={16} />}
@@ -70,23 +71,23 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
7071
className="p-2 hover:bg-alien-space-light rounded-md text-alien-gold hover:text-alien-green"
7172
onClick={() => setIsMenuOpen(false)}
7273
>
73-
<h3 className="font-semibold font-atomic">Academy</h3>
74+
<h3 className="font-bold font-atomic">Academy</h3>
7475
<p className="text-sm text-gray-400">Unlock cosmic knowledge through educational resources</p>
7576
</Link>
7677
<Link
7778
to="/clubs"
7879
className="p-2 hover:bg-alien-space-light rounded-md text-alien-gold hover:text-alien-green"
7980
onClick={() => setIsMenuOpen(false)}
8081
>
81-
<h3 className="font-semibold font-atomic">Clubs</h3>
82+
<h3 className="font-bold font-atomic">Clubs</h3>
8283
<p className="text-sm text-gray-400">Join specialized communities focused on interests</p>
8384
</Link>
8485
<Link
8586
to="/conetworking"
8687
className="p-2 hover:bg-alien-space-light rounded-md text-alien-gold hover:text-alien-green"
8788
onClick={() => setIsMenuOpen(false)}
8889
>
89-
<h3 className="font-semibold font-atomic">CoNetWorKing</h3>
90+
<h3 className="font-bold font-atomic">CoNetWorKing</h3>
9091
<p className="text-sm text-gray-400">Connect with like-minded and profits across the multiverse</p>
9192
</Link>
9293
</div>
@@ -97,7 +98,7 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
9798
<div className="flex flex-col">
9899
<button
99100
onClick={() => setLanguageExpanded(!languageExpanded)}
100-
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md flex items-center justify-between font-atomic"
101+
className="text-alien-gold py-2 px-4 hover:text-alien-green hover:bg-alien-space-light rounded-md flex items-center justify-between font-atomic font-bold"
101102
>
102103
<div className="flex items-center">
103104
<Globe className="mr-2 h-5 w-5" />
@@ -140,7 +141,7 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
140141
)}
141142
</div>
142143

143-
<Button className="bg-alien-green hover:bg-alien-green-light text-alien-gold font-atomic rounded-full mt-4 flex items-center gap-2">
144+
<Button className="bg-alien-green hover:bg-alien-green-light text-alien-gold font-atomic rounded-full mt-4 flex items-center gap-2 font-bold">
144145
<img
145146
src="/lovable-uploads/e2d45b36-c4c1-4b45-953d-5376a5f5b6cc.png"
146147
alt="Wallet"

‎src/components/ParticipationSection.tsx‎

Lines changed: 62 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,37 @@
1+
12
import React from 'react';
23
import { motion } from 'framer-motion';
34
import { Button } from '@/components/ui/button';
4-
import { CircleDollarSign, Calendar, MessagesSquare, Network } from 'lucide-react';
5+
import { CircleDollarSign, Calendar, MessagesSquare, Network, Users, ShieldCheck, Database, Coins } from 'lucide-react';
6+
7+
// Stats that were previously in StatsSection
8+
const stats = [
9+
{
10+
icon: <Users className="h-8 w-8" />,
11+
value: "10,000+",
12+
label: "DAO Members",
13+
color: "text-alien-gold"
14+
},
15+
{
16+
icon: <ShieldCheck className="h-8 w-8" />,
17+
value: "99.9%",
18+
label: "Protocol Security",
19+
color: "text-alien-green"
20+
},
21+
{
22+
icon: <Database className="h-8 w-8" />,
23+
value: "250 TB",
24+
label: "Data Secured",
25+
color: "text-alien-gold"
26+
},
27+
{
28+
icon: <Coins className="h-8 w-8" />,
29+
value: "$125M",
30+
label: "Total Value Locked",
31+
color: "text-alien-green"
32+
}
33+
];
34+
535
const ParticipationSection = () => {
636
return <section id="participate" className="py-20 relative">
737
<div className="container mx-auto px-4">
@@ -19,16 +49,7 @@ const ParticipationSection = () => {
1949
once: true
2050
}}>
2151
<div className="relative">
22-
23-
24-
25-
2652
{/* Floating indicators */}
27-
28-
29-
30-
31-
3253
</div>
3354
</motion.div>
3455

@@ -79,16 +100,41 @@ const ParticipationSection = () => {
79100
</div>
80101
</div>
81102

82-
<Button className="bg-alien-gold hover:bg-alien-gold-light text-alien-space-dark font-medium px-8 py-6 text-lg rounded-full">
103+
<Button className="bg-alien-gold hover:bg-alien-gold-light text-alien-space-dark font-medium px-8 py-6 text-lg rounded-full mb-12">
83104
Connect & Participate
84105
</Button>
106+
107+
{/* Stats Grid - Moved from StatsSection */}
108+
<div className="grid grid-cols-2 gap-6 mt-12">
109+
{stats.map((stat, index) => (
110+
<motion.div
111+
key={index}
112+
initial={{ opacity: 0, y: 20 }}
113+
whileInView={{ opacity: 1, y: 0 }}
114+
transition={{ duration: 0.5, delay: index * 0.1 }}
115+
viewport={{ once: true }}
116+
className="text-center"
117+
>
118+
<div className={`mx-auto mb-4 p-3 rounded-full bg-alien-space-dark w-fit ${stat.color}`}>
119+
{stat.icon}
120+
</div>
121+
<motion.div
122+
initial={{ scale: 0.8 }}
123+
whileInView={{ scale: 1 }}
124+
transition={{ type: "spring", stiffness: 100, delay: index * 0.1 + 0.2 }}
125+
viewport={{ once: true }}
126+
className={`text-3xl font-bold mb-2 ${stat.color}`}
127+
>
128+
{stat.value}
129+
</motion.div>
130+
<div className="text-gray-300 text-sm">{stat.label}</div>
131+
</motion.div>
132+
))}
133+
</div>
85134
</motion.div>
86135
</div>
87136
</div>
88-
89-
{/* Background decoration */}
90-
<div className="absolute -bottom-40 -left-40 w-96 h-96 bg-alien-green opacity-5 rounded-full blur-3xl"></div>
91-
<div className="absolute top-1/2 right-0 translate-x-1/2 w-80 h-80 bg-alien-gold opacity-5 rounded-full blur-3xl"></div>
92137
</section>;
93138
};
94-
export default ParticipationSection;
139+
140+
export default ParticipationSection;

0 commit comments

Comments
 (0)