adicionando componentes

stag.io/package.json

@@ -7,6 +7,7 @@
     "@testing-library/react": "^12.1.4",
     "@testing-library/user-event": "^13.5.0",
     "react": "^17.0.2",
+    "react-bootstrap": "^2.2.3",
     "react-dom": "^17.0.2",
     "react-router-dom": "^6.2.2",
     "react-scripts": "5.0.0",

stag.io/src/App.js

@@ -1,15 +1,20 @@
 import "./App.css";
 import { Routes, Route } from "react-router-dom";
 import DetalhesCandidato from "../src/pages/DetalhesCandidato";
+import VagaEmpresa from "../src/pages/VagaEmpresa";
+
 
 import Inicio from "./pages/Inicio/Inicio";
+import NavBarLogo from "./components/NavBarLogo";
 
 function App() {
   return (
     <div className="App">
+      {/* <NavBarLogo/> */}
       <Routes>
         <Route path="/" element={<Inicio/>}></Route>
         <Route path="/detalhes-candidato" element={<DetalhesCandidato/>}></Route>
+        <Route path="/vaga-empresa" element={<VagaEmpresa/>}></Route>
 
       </Routes>
     </div>

stag.io/src/components/NavBar/index.css → stag.io/src/components/NavBarLogo/index.css

@@ -1,17 +1,18 @@
 .NavBar{
-    position: absolute;
+    position: fixed;
+    height: 150px;
     display: flex;
     justify-content: space-between;
-    padding: 20px;
+    padding: 0 20px ;
     width: 100%; 
-    /* background-color: blue; */
+    /* background-color: red; */
 }
-
 .Logo{
     display: flex;
     align-items: center;
     justify-content: space-between;
     width: 200px;
+    height: 48px;
 }
 
 .LogoName{

stag.io/src/components/NavBar/index.jsx → stag.io/src/components/NavBarLogo/index.jsx

@@ -1,25 +1,22 @@
 import React from "react";
 import { Link } from 'react-router-dom';
 import logo from "../../images/logo-white.svg";
+import { Button, Navbar } from 'react-bootstrap';
 import "./index.css";
 
-const NavBar = () => {
+const NavBarLogo = () => {
 
 
     return(
-        <nav className="NavBar">
+        <Navbar className="NavBar">
             <div className="Logo">
                 <Link to="/">
                     <img src={logo} />
                 </Link>
                 <ul className="LogoName">Stag.io</ul>
             </div>
-
-            {/* <button onClick={()=>{console.log("saiu")}}>
-                sair
-            </button> */}
-        </nav >
+        </Navbar >
     );
 }
 
-export default NavBar;
+export default NavBarLogo;

stag.io/src/components/Vaga/index.css

@@ -0,0 +1,25 @@
+.vaga{
+    display: flex;
+    align-items: center;
+    max-width: 30em;
+    height: 3.75em;
+    margin: 0.6em;
+    border: 0.1em solid #000000;
+    background-color: #FFFFFF;
+    box-sizing: border-box;
+    border-radius: 6.25em;
+    justify-content: space-between;
+}
+.body{
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    margin: 1.8em;
+    color:black;
+}
+
+.action{
+    display: flex;
+    width: 5em;
+    justify-content: space-between;
+}