feat: use "Start Building" in outro

Signed-off-by: David Dal Busco <david.dalbusco@outlook.com>

Author: peterpeterparker

src/components/Hero/index.tsx

@@ -51,7 +51,7 @@ export default function Hero(): JSX.Element {
         </p>
         <p className={`${styles.item}`}></p>
         <div className={`${styles.item} ${styles.actions}`}>
-          <Start position="hero" />
+          <Start position="hero">Get Started</Start>
           <Link
             className="button button--juno"
             to="/docs/intro"

src/components/Outro/index.tsx

@@ -11,7 +11,9 @@ export default function Outro(): JSX.Element {
           <p className={styles.subText}>
             No setup. No DevOps. No strings attached.
           </p>
-          <Start position="footer" className={`button-lg ${styles.start}`} />
+          <Start position="footer" className={`button-lg ${styles.start}`}>
+            Start Building
+          </Start>
         </div>
         <picture aria-label="An astronaut planting a flag reading 'Juno' on a small planet, giving a thumbs up.">
           <MoonIllustration />

src/components/Start/index.tsx

@@ -1,15 +1,18 @@
 import Link from "@docusaurus/Link";
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import { ReactNode } from "react";
 import { trackEvent } from "../../providers/analytics.providers";
 
 type StartProps = {
   position: string;
   className?: string;
+  children: ReactNode;
 };
 
 export default function Start({
   position,
-  className = ""
+  className = "",
+  children
 }: StartProps): JSX.Element {
   const { siteConfig } = useDocusaurusContext();
 
@@ -28,7 +31,7 @@ export default function Start({
         })
       }
     >
-      Get started
+      {children}
     </Link>
   );
 }