Skip to content

Commit 68fb39e

Browse files
alex-beckettalex-beckett
authored
Merge pull request #85 from celestiaorg/jcs/fix-links
docs: fix links
2 parents 04cb3bf + 2f80552 commit 68fb39e

File tree

1 file changed

+203
-160
lines changed

1 file changed

+203
-160
lines changed

‎src/app/run-a-light-node/page.js

+203-160
Original file line numberDiff line numberDiff line change
@@ -14,169 +14,212 @@ import seo from "@/data/run-a-light-node/seo";
1414
export const metadata = meta(seo);
1515

1616
export default async function RunALightNode() {
17-
const networkGroups = [
18-
{
19-
cards: [
20-
{
21-
title: "Beginner",
22-
description: "Run a light node in your browser with Lumina.",
23-
url: "https://lumina.rs",
24-
},
25-
{
26-
title: "Intermediate",
27-
description: "Power up a light node in under 3 minutes with Docker.",
28-
url: "https://docs.celestia.org/how-to-guides/docker-images",
29-
},
30-
{
31-
title: "Advanced",
32-
description: "Start a light node with the command line.",
33-
url: "https://docs.celestia.org/how-to-guides/light-node",
34-
},
35-
],
36-
},
37-
];
17+
const networkGroups = [
18+
{
19+
cards: [
20+
{
21+
title: "Beginner",
22+
description: "Run a light node in your browser with Lumina.",
23+
url: "https://lumina.rs",
24+
},
25+
{
26+
title: "Intermediate",
27+
description: "Power up a light node in under 3 minutes with Docker.",
28+
url: "https://docs.celestia.org/how-to-guides/docker-images",
29+
},
30+
{
31+
title: "Advanced",
32+
description: "Start a light node with the command line.",
33+
url: "https://docs.celestia.org/how-to-guides/light-node",
34+
},
35+
],
36+
},
37+
];
3838

39-
const developerGroups = [
40-
{
41-
cards: [
42-
{
43-
title: "Publish data",
44-
description: "Publish transaction data to Celestia’s DA network.",
45-
url: "https://docs.celestia.org/developers/node-tutorial",
46-
},
47-
{
48-
title: "Retrieve data",
49-
description: "Retrieve transaction data from Celestia’s DA network.",
50-
url: "https://docs.celestia.org/developers/node-tutorial#retrieving-data",
51-
},
52-
{
53-
title: "Manage Tia wallet",
54-
description: "Generate a Celestia wallet to store Tia and pay for publishing transaction data to Celestia.",
55-
url: "https://docs.celestia.org/developers/celestia-node-key",
56-
},
57-
],
58-
},
59-
];
39+
const developerGroups = [
40+
{
41+
cards: [
42+
{
43+
title: "Publish data",
44+
description: "Publish data blobs to Celestia’s DA network.",
45+
url: "https://docs.celestia.org/how-to-guides/quick-start",
46+
},
47+
{
48+
title: "Retrieve data",
49+
description: "Retrieve transaction data from Celestia’s DA network.",
50+
url: "https://docs.celestia.org/how-to-guides/quick-start#retrieving-data",
51+
},
52+
{
53+
title: "Manage Tia wallet",
54+
description:
55+
"Generate a Celestia wallet to store Tia and pay for publishing transaction data to Celestia.",
56+
url: "https://docs.celestia.org/tutorials/celestia-node-key",
57+
},
58+
],
59+
},
60+
];
6061

61-
return (
62-
<>
63-
<SecondaryHero
64-
title={"Directly verify"}
65-
buttons={[
66-
{
67-
text: "Run a light node",
68-
url: "/run-a-light-node#start-up-a-node",
69-
iconDirection: "down-right",
70-
},
71-
{
72-
text: "Integrate",
73-
url: "/run-a-light-node#integrate",
74-
iconDirection: "down-right",
75-
},
76-
]}
77-
videos={{
78-
src: {
79-
xl: "/videos/hero/light-desktop_xl.mp4",
80-
lg: "/videos/hero/light-desktop_lg.mp4",
81-
sm: "/videos/hero/light-mobile_sm.mp4",
82-
},
83-
poster: {
84-
lg: "/videos/hero/light-desktop_xl_poster.jpg",
85-
sm: "/videos/hero/light-mobile_sm_poster.jpg",
86-
},
87-
}}
88-
/>
62+
return (
63+
<>
64+
<SecondaryHero
65+
title={"Directly verify"}
66+
buttons={[
67+
{
68+
text: "Run a light node",
69+
url: "/run-a-light-node#start-up-a-node",
70+
iconDirection: "down-right",
71+
},
72+
{
73+
text: "Integrate",
74+
url: "/run-a-light-node#integrate",
75+
iconDirection: "down-right",
76+
},
77+
]}
78+
videos={{
79+
src: {
80+
xl: "/videos/hero/light-desktop_xl.mp4",
81+
lg: "/videos/hero/light-desktop_lg.mp4",
82+
sm: "/videos/hero/light-mobile_sm.mp4",
83+
},
84+
poster: {
85+
lg: "/videos/hero/light-desktop_xl_poster.jpg",
86+
sm: "/videos/hero/light-mobile_sm_poster.jpg",
87+
},
88+
}}
89+
/>
8990

90-
<section id={"What-is-a-light-node"} className={"pt-10 lg:pt-20"}>
91-
<Container size={"lg"}>
92-
<div className={`pb-40 lg:flex`}>
93-
<div className='w-full mx-auto lg:w-2/3'>
94-
<Heading size={"md"} className={"!font-untitledSans mb-4 lg:mb-6"} tag={"p"}>
95-
What is a light node?
96-
</Heading>
97-
<Heading size={"md"} className={"!font-untitledSans mb-4 lg:mb-6"} tag={"p"}>
98-
Light nodes allow anyone to directly verify data availability and interact with Celestia without centralized gateways
99-
or RPC providers.
100-
</Heading>
101-
<Heading size={"md"} className={"!font-untitledSans mb-4 lg:mb-6"} tag={"p"}>
102-
Data availability sampling enables Celestia to securely increase throughput for rollups as new light nodes join the
103-
network over time.
104-
</Heading>
105-
<Heading size={"md"} className={"!font-untitledSans"} tag={"p"}>
106-
Each rollup on Celestia uses a light node to directly publish and retrieve transaction data.
107-
</Heading>
108-
</div>
109-
</div>
110-
</Container>
111-
</section>
91+
<section id={"What-is-a-light-node"} className={"pt-10 lg:pt-20"}>
92+
<Container size={"lg"}>
93+
<div className={`pb-40 lg:flex`}>
94+
<div className="w-full mx-auto lg:w-2/3">
95+
<Heading
96+
size={"md"}
97+
className={"!font-untitledSans mb-4 lg:mb-6"}
98+
tag={"p"}
99+
>
100+
What is a light node?
101+
</Heading>
102+
<Heading
103+
size={"md"}
104+
className={"!font-untitledSans mb-4 lg:mb-6"}
105+
tag={"p"}
106+
>
107+
Light nodes allow anyone to directly verify data availability
108+
and interact with Celestia without centralized gateways or RPC
109+
providers.
110+
</Heading>
111+
<Heading
112+
size={"md"}
113+
className={"!font-untitledSans mb-4 lg:mb-6"}
114+
tag={"p"}
115+
>
116+
Data availability sampling enables Celestia to securely increase
117+
throughput for rollups as new light nodes join the network over
118+
time.
119+
</Heading>
120+
<Heading size={"md"} className={"!font-untitledSans"} tag={"p"}>
121+
Each rollup on Celestia uses a light node to directly publish
122+
and retrieve transaction data.
123+
</Heading>
124+
</div>
125+
</div>
126+
</Container>
127+
</section>
112128

113-
<section id={"start-up-a-node"} className='text-white bg-black'>
114-
<Container size={"lg"} className={"py-10 lg:py-24"}>
115-
<Row className={"mb-6 lg:mb-16"}>
116-
<Col width={60}>
117-
<Display size={"sm"} tag={"h2"} className={"mb-4 lg:mb-0"}>
118-
Join the network
119-
</Display>
120-
</Col>
121-
<Col width={40}></Col>
122-
</Row>
123-
<Row>
124-
<Col width={100}>
125-
{networkGroups.map((group, index) => (
126-
<div className='grid w-full grid-cols-1 gap-4 mb-4 md:grid-col-2 lg:grid-cols-3' key={`cardGroup-${index}`}>
127-
{group.cards.map((card, index) => (
128-
<VerticalTitleCard dark key={index} title={card.title} description={card.description} url={card.url} />
129-
))}
130-
</div>
131-
))}
132-
</Col>
133-
</Row>
134-
</Container>
135-
</section>
129+
<section id={"start-up-a-node"} className="text-white bg-black">
130+
<Container size={"lg"} className={"py-10 lg:py-24"}>
131+
<Row className={"mb-6 lg:mb-16"}>
132+
<Col width={60}>
133+
<Display size={"sm"} tag={"h2"} className={"mb-4 lg:mb-0"}>
134+
Join the network
135+
</Display>
136+
</Col>
137+
<Col width={40}></Col>
138+
</Row>
139+
<Row>
140+
<Col width={100}>
141+
{networkGroups.map((group, index) => (
142+
<div
143+
className="grid w-full grid-cols-1 gap-4 mb-4 md:grid-col-2 lg:grid-cols-3"
144+
key={`cardGroup-${index}`}
145+
>
146+
{group.cards.map((card, index) => (
147+
<VerticalTitleCard
148+
dark
149+
key={index}
150+
title={card.title}
151+
description={card.description}
152+
url={card.url}
153+
/>
154+
))}
155+
</div>
156+
))}
157+
</Col>
158+
</Row>
159+
</Container>
160+
</section>
136161

137-
<section id={"integrate"} className='text-white bg-black'>
138-
<Container size={"lg"} className={"py-10 lg:py-24"}>
139-
<Row className={"mb-6 lg:mb-16"}>
140-
<Col width={60}>
141-
<Display size={"sm"} tag={"h2"} className={"mb-4 lg:mb-6"}>
142-
Light nodes for developers
143-
</Display>
144-
<Body size={"md"} className={"mb-6 lg:mb-0"}>
145-
How developers can use a Celestia light node for their chain
146-
</Body>
147-
</Col>
148-
<Col width={40}>
149-
<PrimaryButton href={"https://docs.celestia.org/nodes/light-node"} size='md' dark className={"lg:mr-0 lg:ml-auto table"}>
150-
<div className={"w-full inline-flex justify-between items-center group gap-2"}>
151-
<span>Start light node</span>
152-
<Icon
153-
Icon={<ArrowLongSVG dark />}
154-
hover
155-
HoverIcon={<ArrowLongSVG dark />}
156-
className={`flex-grow-0`}
157-
direction='up-right'
158-
border={false}
159-
size={"xs"}
160-
transparentBg
161-
/>
162-
</div>
163-
</PrimaryButton>
164-
</Col>
165-
</Row>
166-
<Row>
167-
<Col width={100}>
168-
{developerGroups.map((group, index) => (
169-
<div className='grid w-full grid-cols-1 gap-4 mb-4 md:grid-col-2 lg:grid-cols-3' key={`cardGroup-${index}`}>
170-
{group.cards.map((card, index) => (
171-
<VerticalTitleCard dark key={index} title={card.title} description={card.description} url={card.url} />
172-
))}
173-
</div>
174-
))}
175-
</Col>
176-
</Row>
177-
</Container>
178-
</section>
179-
<div className='block h-10 -mb-10 bg-black w-fill'></div>
180-
</>
181-
);
162+
<section id={"integrate"} className="text-white bg-black">
163+
<Container size={"lg"} className={"py-10 lg:py-24"}>
164+
<Row className={"mb-6 lg:mb-16"}>
165+
<Col width={60}>
166+
<Display size={"sm"} tag={"h2"} className={"mb-4 lg:mb-6"}>
167+
Light nodes for developers
168+
</Display>
169+
<Body size={"md"} className={"mb-6 lg:mb-0"}>
170+
How developers can use a Celestia light node for their chain
171+
</Body>
172+
</Col>
173+
<Col width={40}>
174+
<PrimaryButton
175+
href={"https://lumina.rs"}
176+
size="md"
177+
dark
178+
className={"lg:mr-0 lg:ml-auto table"}
179+
>
180+
<div
181+
className={
182+
"w-full inline-flex justify-between items-center group gap-2"
183+
}
184+
>
185+
<span>Start light node</span>
186+
<Icon
187+
Icon={<ArrowLongSVG dark />}
188+
hover
189+
HoverIcon={<ArrowLongSVG dark />}
190+
className={`flex-grow-0`}
191+
direction="up-right"
192+
border={false}
193+
size={"xs"}
194+
transparentBg
195+
/>
196+
</div>
197+
</PrimaryButton>
198+
</Col>
199+
</Row>
200+
<Row>
201+
<Col width={100}>
202+
{developerGroups.map((group, index) => (
203+
<div
204+
className="grid w-full grid-cols-1 gap-4 mb-4 md:grid-col-2 lg:grid-cols-3"
205+
key={`cardGroup-${index}`}
206+
>
207+
{group.cards.map((card, index) => (
208+
<VerticalTitleCard
209+
dark
210+
key={index}
211+
title={card.title}
212+
description={card.description}
213+
url={card.url}
214+
/>
215+
))}
216+
</div>
217+
))}
218+
</Col>
219+
</Row>
220+
</Container>
221+
</section>
222+
<div className="block h-10 -mb-10 bg-black w-fill"></div>
223+
</>
224+
);
182225
}

0 commit comments

Comments
 (0)