feat: review crafted for web devs (#371)

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

Author: peterpeterparker

src/components/Build/index.tsx

@@ -1,9 +1,7 @@
 import Guide from "@site/src/components/Guide";
 import Angular from "@site/static/icons/angular.svg";
 import Astro from "@site/static/icons/astro.svg";
-import JavaScript from "@site/static/icons/javascript.svg";
 import NextJS from "@site/static/icons/nextjs.svg";
-import NodeJS from "@site/static/icons/nodejs.svg";
 import ReactLogo from "@site/static/icons/react.svg";
 import Rust from "@site/static/icons/rust.svg";
 import Svelte from "@site/static/icons/svelte.svg";
@@ -13,10 +11,11 @@ import styles from "./styles.module.scss";
 export default function Build(): JSX.Element {
   return (
     <div className={styles.section}>
-      <h2 className={styles.sub}>Crafted for web devs</h2>
+      <h2 className={styles.sub}>Crafted for Web Devs</h2>
       <p className={styles.build}>
-        There are numerous ways to develop on Juno without sacrificing your
-        preferred tech stack
+        Use the frontend frameworks you{" "}
+        <span className="visually-hidden">love</span>❤️ and write serverless
+        functions in Rust.
       </p>
 
       <div className={styles.grid}>
@@ -25,50 +24,32 @@ export default function Build(): JSX.Element {
           link="/docs/guides/nextjs"
           icon={<NextJS />}
         />
-
         <Guide
           title="Use Juno with React"
           link="/docs/guides/React"
           icon={<ReactLogo />}
         />
-
         <Guide
           title="Use Juno with SvelteKit"
           link="/docs/guides/sveltekit"
           icon={<Svelte />}
         />
-
         <Guide
           title="Use Juno with Vue"
           link="/docs/guides/vue"
           icon={<Vue />}
         />
-
         <Guide
           title="Use Juno with Angular"
           link="/docs/guides/angular"
           icon={<Angular />}
         />
-
         <Guide
           title="Use Juno with Astro"
           link="/docs/guides/astro"
           icon={<Astro />}
         />
-
-        <Guide
-          title="A vanilla JavaScript example showcasing most of Juno's features"
-          link="https://github.com/junobuild/examples/tree/main/vanilla"
-          icon={<JavaScript />}
-          external={true}
-        />
-
-        <Guide
-          title="Use Juno in non-interactive environment with NodeJS."
-          link="/docs/guides/nodejs"
-          icon={<NodeJS />}
-        />
-
+        •
         <Guide
           title="Juno can also be extended with serverless functions written in Rust."
           link="/docs/guides/rust"

src/components/Build/styles.module.scss

@@ -10,6 +10,7 @@
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
+  align-items: center;
   gap: 1rem;
   padding: 0.75rem 0 4rem;
   margin: 0 0 4rem;

src/css/a11y.scss

@@ -0,0 +1,9 @@
+.visually-hidden {
+  clip: rect(0 0 0 0);
+  clip-path: inset(100%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}

src/css/custom.scss

@@ -8,3 +8,4 @@
 @use "navbar";
 @use "search";
 @use "table";
+@use "a11y";