⬅️ Back to Table of Contents

📄 pages

📊 Analysis Summary

Metric	Count
🔧 Functions	1
📦 Imports	10
💠 JSX Elements	15

📚 Table of Contents

• Imports
• JSX Elements
• Functions

🛠️ File Location:

📂 packages/website/src/pages/index.tsx

📦 Imports

Name	Source
Link	@docusaurus/Link
useBaseUrl	@docusaurus/useBaseUrl
useDocusaurusContext	@docusaurus/useDocusaurusContext
Layout	@theme/Layout
clsx	clsx
React	react
Explainers	../components/home/Explainers
FinancialContributors	../components/home/FinancialContributors
RecentBlogPosts	../components/home/RecentBlogPosts
styles	./styles.module.css

---

JSX Elements

Component	Type	Props	Children
Layout	component	description={siteConfig.tagline}
main	element	none	, , ,
div	element	className={clsx('hero hero--dark', styles.hero)}
div	element	className={clsx('container', styles.heroContainer)}	,
div	element	className={styles.heroLeft}	, ,
h1	element	className="hero__title"	{siteConfig.title}
p	element	className="hero__subtitle"	{siteConfig.tagline.replace(' code', '')}
div	element	className={styles.buttons}	,
Link	component	className="button button--primary", to={useBaseUrl('getting-started')}	text: "Get Started"
Link	component	className="button button--secondary button--outline", to={useBaseUrl('play/')}	text: "Playground"
div	element	className={styles.heroRight}
img	element	alt="Hero Logo", className={styles.heroLogo}, src="/img/logo.svg"	none
Explainers	component	none	none
RecentBlogPosts	component	none	none
FinancialContributors	component	none	none

---

Functions

Home(): React.JSX.Element

Returns: React.JSX.Element

Calls:

• useDocusaurusContext (from @docusaurus/useDocusaurusContext)
• clsx (from clsx)
• siteConfig.tagline.replace
• useBaseUrl (from @docusaurus/useBaseUrl)

Code

function Home(): React.JSX.Element {
  const { siteConfig } = useDocusaurusContext();
  return (
    <Layout description={siteConfig.tagline}>
      <main>
        <div className={clsx('hero hero--dark', styles.hero)}>
          <div className={clsx('container', styles.heroContainer)}>
            <div className={styles.heroLeft}>
              <h1 className="hero__title">{siteConfig.title}</h1>
              <p className="hero__subtitle">
                {siteConfig.tagline.replace(' code', '')}
              </p>
              <div className={styles.buttons}>
                <Link
                  className="button button--primary"
                  to={useBaseUrl('getting-started')}
                >
                  Get Started
                </Link>
                <Link
                  className="button button--secondary button--outline"
                  to={useBaseUrl('play/')}
                >
                  Playground
                </Link>
              </div>
            </div>
            <div className={styles.heroRight}>
              <img
                alt="Hero Logo"
                className={styles.heroLogo}
                src="/img/logo.svg"
              />
            </div>
          </div>
        </div>

        <Explainers />
        <RecentBlogPosts />
        <FinancialContributors />
      </main>
    </Layout>
  );
}

---

Generated by Syntax Scribe