index.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. import React from "react";
  2. import clsx from "clsx";
  3. import Layout from "@theme/Layout";
  4. import Link from "@docusaurus/Link";
  5. import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
  6. import styles from "./index.module.css";
  7. import HomepageFeatures from "@site/src/components/Homepage";
  8. function HomepageHeader() {
  9. const { siteConfig } = useDocusaurusContext();
  10. return (
  11. <header className={clsx("hero hero--primary", styles.heroBanner)}>
  12. <div className="container">
  13. <h1 className="hero__title">{siteConfig.title}</h1>
  14. <p className="hero__subtitle">{siteConfig.tagline}</p>
  15. <div className={styles.buttons}>
  16. <Link
  17. className="button button--secondary button--lg"
  18. to="/docs/get-started"
  19. >
  20. Get started
  21. </Link>
  22. </div>
  23. </div>
  24. </header>
  25. );
  26. }
  27. export default function Home() {
  28. const { siteConfig } = useDocusaurusContext();
  29. return (
  30. <Layout
  31. title={`Hello from ${siteConfig.title}`}
  32. description="Description will go into a meta tag in <head />"
  33. >
  34. <HomepageHeader />
  35. <main>
  36. <HomepageFeatures />
  37. </main>
  38. </Layout>
  39. );
  40. }