docs - new homepage (#29793)
* refactor: new home page * refactor: line lengths and meta description * docs: removed text section * refactor: links label and comments * chore: removed comment * refactor: removed page
This commit is contained in:
parent
5108350710
commit
54416451f6
|
@ -37,11 +37,14 @@ function Card({ to, header, body, externalIcon = false }) {
|
||||||
)}
|
)}
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{typeof body === "object" && (
|
||||||
<div className="card__body">
|
<div className="card__body">
|
||||||
<p>
|
<p>
|
||||||
<Translate description={body.translateId}>{body.label}</Translate>
|
<Translate description={body.translateId}>{body.label}</Translate>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
)}
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -0,0 +1,34 @@
|
||||||
|
import React from "react";
|
||||||
|
import Card from "./Card";
|
||||||
|
|
||||||
|
export default function HomeCtaLinks() {
|
||||||
|
return (
|
||||||
|
<div className="container">
|
||||||
|
<div className="row cards__container">
|
||||||
|
<Card
|
||||||
|
to="developers"
|
||||||
|
header={{
|
||||||
|
label: "Developers",
|
||||||
|
translateId: "cta-developers",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Card
|
||||||
|
to="running-validator"
|
||||||
|
header={{
|
||||||
|
label: "Validators",
|
||||||
|
translateId: "cta-validators",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Card
|
||||||
|
to="cluster/overview"
|
||||||
|
header={{
|
||||||
|
label: "Architecture",
|
||||||
|
translateId: "cta-architecture",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
|
@ -57,11 +57,11 @@ main {
|
||||||
}
|
}
|
||||||
|
|
||||||
.cards__container {
|
.cards__container {
|
||||||
margin: 3em 0;
|
/* margin-bottom: 0; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.cards__container .col {
|
.cards__container .col {
|
||||||
margin-bottom: 1em;
|
margin-bottom: 3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
|
@ -73,7 +73,12 @@ main {
|
||||||
transition-duration: 200ms;
|
transition-duration: 200ms;
|
||||||
align-items: start;
|
align-items: start;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-shadow: 0 8px 15px 2px rgba(86, 91, 115, 0.1);
|
/* box-shadow: 0 8px 15px 2px rgba(86, 91, 115, 0.1); */
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="dark"] .card {
|
||||||
|
border-color: #444;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card a {
|
.card a {
|
||||||
|
@ -81,7 +86,8 @@ main {
|
||||||
}
|
}
|
||||||
|
|
||||||
.card:hover {
|
.card:hover {
|
||||||
transform: translate(0px, -5px);
|
/* transform: translate(0px, -5px); */
|
||||||
|
border-color: var(--ifm-color-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer--dark {
|
.footer--dark {
|
||||||
|
|
|
@ -0,0 +1,56 @@
|
||||||
|
---
|
||||||
|
slug: /
|
||||||
|
id: home
|
||||||
|
title: Home
|
||||||
|
sidebar_label: Home
|
||||||
|
description:
|
||||||
|
"Solana is a high performance network that is utilized for a range of use cases, \
|
||||||
|
including finance, NFTs, payments, and gaming."
|
||||||
|
# displayed_sidebar: introductionSidebar
|
||||||
|
---
|
||||||
|
|
||||||
|
# Solana Documentaion
|
||||||
|
|
||||||
|
Solana is a blockchain built for mass adoption. It's a high performance network that is utilized for
|
||||||
|
a range of use cases, including finance, NFTs, payments, and gaming. Solana operates as a single
|
||||||
|
global state machine, and is open, interoperable and decentralized.
|
||||||
|
|
||||||
|
## Getting started
|
||||||
|
|
||||||
|
Dive right into Solana to start building or setup your tooling.
|
||||||
|
|
||||||
|
- [Setup local environment](/cli) - Install the Solana CLI to get your local development environment setup
|
||||||
|
- [Hello World in your browser](getstarted/hello-world) - Build and deploy your first on-chain Solana program,
|
||||||
|
directly in your browser using Solana Playground
|
||||||
|
|
||||||
|
## Start learning
|
||||||
|
|
||||||
|
Build a strong understanding of the core concepts that make Solana different from other blockchains.
|
||||||
|
|
||||||
|
- [Transactions](./developing/programming-model/transactions) - Collection of instructions for the blockchain to execute
|
||||||
|
- [Accounts](./developing/programming-model/accounts) - Data and state storage mechanism for Solana
|
||||||
|
- [Programs](./developing/intro/programs) - The executable code used to perform actions on the blockchain
|
||||||
|
- [Cross-Program Invocation](./developing/programming-model/calling-between-programs) - Core of the "composability"
|
||||||
|
of Solana, this is how programs can "call" each other.
|
||||||
|
|
||||||
|
## Understanding the architecture
|
||||||
|
|
||||||
|
Get to know the underlying architecture of how the proof-of-stake blockchain works.
|
||||||
|
|
||||||
|
- [Validators](./validator/anatomy) - the individual nodes that are the backbone of the network
|
||||||
|
- [Clusters](./cluster/overview) - a collection of validators that work together for consensus
|
||||||
|
|
||||||
|
## Running a validator
|
||||||
|
|
||||||
|
Explore what it takes to operate a Solana validator and help secure the network.
|
||||||
|
|
||||||
|
- [System requirements](./running-validator/validator-reqs) - Recommended hardware requirements and expected SOL
|
||||||
|
needed to operate a validator
|
||||||
|
- [Quick start guide](./running-validator/validator-start) - Setup a validator and get connected to a cluster
|
||||||
|
for the first time
|
||||||
|
|
||||||
|
## Learn more
|
||||||
|
|
||||||
|
import HomeCtaLinks from "../components/HomeCtaLinks";
|
||||||
|
|
||||||
|
<HomeCtaLinks />
|
|
@ -1,102 +0,0 @@
|
||||||
import React from "react";
|
|
||||||
import Layout from "@theme/Layout";
|
|
||||||
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
|
|
||||||
import styles from "./styles.module.css";
|
|
||||||
import Card from "../../components/Card";
|
|
||||||
|
|
||||||
function Home() {
|
|
||||||
const context = useDocusaurusContext();
|
|
||||||
const { siteConfig = {} } = context;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Layout title="Homepage" description="Solana Documentation">
|
|
||||||
<main>
|
|
||||||
<section className={styles.features}>
|
|
||||||
<div className="container">
|
|
||||||
<div className="row cards__container">
|
|
||||||
<Card
|
|
||||||
to="developers"
|
|
||||||
header={{
|
|
||||||
label: "⛏ Start Developing",
|
|
||||||
translateId: "start-building",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Get started building your decentralized app or marketplace with Solana.",
|
|
||||||
translateId: "get-started-building",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Card
|
|
||||||
to="running-validator"
|
|
||||||
header={{
|
|
||||||
label: "🎛 Run a Validator Node",
|
|
||||||
translateId: "run-validator",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Validate transactions, secure the network, and earn rewards.",
|
|
||||||
translateId: "validate-transactions",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Card
|
|
||||||
to="https://spl.solana.com/token"
|
|
||||||
header={{
|
|
||||||
label: "🏛 Create an SPL Token",
|
|
||||||
translateId: "create-spl",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Launch your own SPL Token, Solana's equivalent of ERC-20.",
|
|
||||||
translateId: "erc-20",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Card
|
|
||||||
to="integrations/exchange"
|
|
||||||
header={{
|
|
||||||
label: "🏦 Integrate an Exchange",
|
|
||||||
translateId: "integrate-exchange",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Follow our extensive integration guide to ensure a seamless user experience.",
|
|
||||||
translateId: "integration-guide",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Card
|
|
||||||
to="wallet-guide"
|
|
||||||
header={{
|
|
||||||
label: "📲 Manage a Wallet",
|
|
||||||
translateId: "manage-wallet",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Create a wallet, check your balance, and learn about wallet options.",
|
|
||||||
translateId: "wallet-options",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Card
|
|
||||||
to="introduction"
|
|
||||||
header={{
|
|
||||||
label: "🤯 Learn How Solana Works",
|
|
||||||
translateId: "learn-how",
|
|
||||||
}}
|
|
||||||
body={{
|
|
||||||
label:
|
|
||||||
"Get a high-level understanding of Solana's architecture.",
|
|
||||||
translateId: "high-level",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
</Layout>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Home;
|
|
Loading…
Reference in New Issue