feat: Criação menu de navegação Desktop

src/components/Header/Header.tsx

@@ -1,6 +1,6 @@
 import styles from "./header.module.scss";
 
-export function Header() {
+export default function Header() {
   return (
     <header className={styles.header}>
       <img

src/components/MenuNav/MenuNav.tsx

@@ -0,0 +1,19 @@
+import styles from "./menuNav.module.scss";
+
+export default function MenuNav() {
+  return (
+    <nav>
+      <ul className={styles.menuNav}>
+        <li>
+          <a href="/">Cursos</a>
+        </li>
+        <li>
+          <a href="/">Saiba mais</a>
+        </li>
+        <li>
+          <a href="/">Institucionais</a>
+        </li>
+      </ul>
+    </nav>
+  );
+}

src/components/MenuNav/menuNav.module.scss

@@ -0,0 +1,20 @@
+.menuNav {
+  border-top: 1px solid var(--gray-400);
+
+  display: flex;
+  background: var(--black);
+  gap: 55px;
+  padding: 0 100px;
+
+  li {
+    color: var(--white);
+    list-style: none;
+    text-transform: uppercase;
+
+    font-weight: 500;
+    font-size: 14px;
+    line-height: 16px;
+
+    padding: 14px 0;
+  }
+}

src/global.scss

@@ -25,3 +25,7 @@ code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+
+a {
+  color: inherit;
+}

src/pages/Home.tsx

@@ -1,8 +1,13 @@
-import React from "react";
-import { Header } from "../components/Header/Header";
+import Header from "../components/Header/Header";
+import MenuNav from "../components/MenuNav/MenuNav";
 
 function Home() {
-  return <Header />;
+  return (
+    <>
+      <Header />
+      <MenuNav />
+    </>
+  );
 }
 
 export default Home;