diff --git a/components/ProductBox.tsx b/components/ProductBox.tsx new file mode 100644 index 00000000..5ed9b17f --- /dev/null +++ b/components/ProductBox.tsx @@ -0,0 +1,22 @@ +import React from "react"; + +export const ProductBox = ({ + icon, + title, + description, + link, +}: { + icon: React.ReactNode; + title: string; + description: string; + link: string; +}) => ( + +
{icon}
+

{title}

+

{description}

+ +); diff --git a/components/icons/BenchmarkIcon.tsx b/components/icons/BenchmarkIcon.tsx new file mode 100644 index 00000000..7495b665 --- /dev/null +++ b/components/icons/BenchmarkIcon.tsx @@ -0,0 +1,18 @@ +const BenchmarkIcon = () => { + return ( + + + + ); +}; + +export default BenchmarkIcon; diff --git a/components/icons/EntropyIcon.tsx b/components/icons/EntropyIcon.tsx new file mode 100644 index 00000000..7577da0d --- /dev/null +++ b/components/icons/EntropyIcon.tsx @@ -0,0 +1,30 @@ +const EntropyIcon = () => { + return ( + + + + + + + ); +}; + +export default EntropyIcon; diff --git a/components/icons/ExpressRelayIcon.tsx b/components/icons/ExpressRelayIcon.tsx new file mode 100644 index 00000000..b6fdc178 --- /dev/null +++ b/components/icons/ExpressRelayIcon.tsx @@ -0,0 +1,18 @@ +const ExpressRelayIcon = () => { + return ( + + + + ); +}; + +export default ExpressRelayIcon; diff --git a/components/icons/PriceFeedIcon.tsx b/components/icons/PriceFeedIcon.tsx new file mode 100644 index 00000000..7553573b --- /dev/null +++ b/components/icons/PriceFeedIcon.tsx @@ -0,0 +1,18 @@ +const PriceFeedIcon = () => { + return ( + + + + ); +}; + +export default PriceFeedIcon; diff --git a/pages/home/index.mdx b/pages/home/index.mdx index edc7353b..1ccef1eb 100644 --- a/pages/home/index.mdx +++ b/pages/home/index.mdx @@ -1,20 +1,67 @@ -# Introduction +import React from "react"; +import { ProductBox } from "../../components/ProductBox"; +import PriceFeedIcon from "../../components/icons/PriceFeedIcon"; +import EntropyIcon from "../../components/icons/EntropyIcon"; +import ExpressRelayIcon from "../../components/icons/ExpressRelayIcon"; +import BenchmarkIcon from "../../components/icons/BenchmarkIcon"; -Pyth Network is an oracle protocol that connects the owners of market data to applications on multiple blockchains. -Pyth's market data is contributed by over 100 [first-party publishers](https://pyth.network/publishers/), including some of the biggest exchanges and market making firms in the world. -[Over 350 protocols](https://defillama.com/oracles/Pyth) on 55+ blockchains trust Pyth to secure their applications. - -Pyth Network offers several products for developers: - -- [Price Feeds](../price-feeds) provide real-time prices for 500+ assets on 55+ blockchain ecosystems, including Solana, many EVM chains, - Aptos, Sui, NEAR, and several Cosmos chains. -- [Benchmarks](../benchmarks) provides historical Pyth prices for both on- and off-chain use. -- [Express Relay](../express-relay/) enables protocols to eliminate their MEV while gaining access to active searchers and liquidators. -- [Entropy](../entropy) allows developers to generate secure random numbers on the blockchain. - -Please follow the links above to learn about each product and how to integrate them into your application. - -Other useful links may be: - -- [Pyth Token](home/pyth-token) -- Learn more about the Pyth governance token PYTH. -- [Pyth Metrics](home/metrics) -- See metrics of the network's adoption and growth. +
+
+
+

+ Introduction to Pyth Documentation +

+
+

+ Pyth Network is the permissionless data infrastructure that empowers + the next generation of decentralized applications. Pyth provides + builders with the supercharged infrastructure to create dApps that + compete with apps. +

+
+
+
+
+

Products

+
+
+
+ } + title="Price Feeds" + description="Price Feeds provide real-time prices for crypto, stocks, forex, and metals on number of blockchains, including Solana, many EVM chains, Aptos, Sui, NEAR, and several Cosmos chains." + link="/price-feeds" + /> + } + title="Benchmarks" + description="Benchmarks provides historical Pyth prices for both on- and off-chain use." + link="/benchmarks" + /> + } + title="Entropy" + description="Entropy allows developers to generate secure random numbers on the blockchain." + /> + } + title="Express Relay" + description="Express Relayer provides a secure and reliable way to connect your application to the Pyth network." + link="/express-relayer" + /> +
+
+ } + title="Pyth Token" + description="Learn more about the Pyth governance token PYTH." + link="/pyth-token" + /> + } + title="Pyth Metrics" + description="See metrics of the network's adoption and growth." + link="/metrics" + /> +
+