💡 (#180) Criando navbar para o contact

src/components/navbar/NavbarContact.js

@@ -0,0 +1,25 @@
+import React from "react";
+import "../../style/components/navbarContact.css";
+import logo from "../../assets/logo 3.svg";
+
+const NavbarContact = () => {
+  return (
+    <div className="container-navbar-contact">
+      <img alt="" src={logo}></img>
+
+      <div className="button-navbar-contact">
+        <button className="home-navbar-contact">
+          <a href="http://localhost:3000/">Home</a>
+        </button>
+        <button className="aboutUs-navbar-contact">
+          <a href="http://localhost:3000/quemsomos">Quem Somos</a>
+        </button>
+        <button className="contact-navbar-contact">
+          {" "}
+          <a href="http://localhost:3000/contato">Contato</a>
+        </button>
+      </div>
+    </div>
+  );
+};
+export default NavbarContact;

src/pages/Contact.js

@@ -3,7 +3,7 @@ import "../style/pages/contact.css";
 import Imagem_Homen from "../assets/imagem-homen-ruivo.svg";
 import Input from "../components/Input";
 import emailjs from "@emailjs/browser";
-import NavbarSimple from "../components/navbar/NavbarSimple";
+import NavbarContact from "../components/navbar/NavbarContact";
 
 export default function Contact() {
   const [nome, setNome] = useState("");
@@ -44,7 +44,7 @@ export default function Contact() {
 
   return (
     <>
-      <NavbarSimple />
+      <NavbarContact />
       <div className="Main-page-contact">
         <h1>Contato</h1>
         <div className="Contact-principal">

src/style/components/navbarContact.css

@@ -0,0 +1,32 @@
+.container-navbar-contact {
+  width: 100%;
+  background-color: #ffff;
+  height: 7vh;
+  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
+  margin-bottom: 5rem;
+  display: flex;
+}
+
+.container-navbar-contact img {
+  width: 18vw;
+  height: 7vh;
+}
+
+.button-navbar-contact button {
+  background-color: #ffff;
+  color: #003366;
+  border: none;
+  font-size: 18px;
+  padding-right: 75px;
+  cursor: pointer;
+  margin-top: 1.5rem;
+}
+.button-navbar-contact a {
+  text-decoration: none;
+  color: #003366;
+}
+.button-navbar-contact:hover {
+  background-color: #ffff;
+  color: #006633;
+  cursor: pointer;
+}

src/style/components/navbarSimple.css

@@ -48,6 +48,11 @@
   text-decoration: none;
   color: #003366;
 }
+
+.login-navbar-simple a {
+  text-decoration: none;
+  color: #003366;
+}
 .button-login-navbar-simple :hover {
   background-color: #003366;
   color: #ffff;