diff --git a/pagina-institucional/src/components/HeaderBottom.tsx b/pagina-institucional/src/components/HeaderBottom.tsx new file mode 100644 index 0000000..040182b --- /dev/null +++ b/pagina-institucional/src/components/HeaderBottom.tsx @@ -0,0 +1,26 @@ +import React from "react"; +import styles from "../style/HeaderBottom.module.scss"; + +const HeaderBottom = () => { + return ( +
+
+ + Cursos + +
+
+ + Saiba Mais + +
+
+ + Institucionais + +
+
+ ); +}; + +export { HeaderBottom }; diff --git a/pagina-institucional/src/pages/Home.tsx b/pagina-institucional/src/pages/Home.tsx index 73d5a3f..c68713b 100644 --- a/pagina-institucional/src/pages/Home.tsx +++ b/pagina-institucional/src/pages/Home.tsx @@ -2,9 +2,15 @@ import React from "react"; import { Route } from "react-router"; import { BrowserRouter } from "react-router-dom"; import { Header } from "../components/Header"; +import { HeaderBottom } from "../components/HeaderBottom"; const Home = () => { - return
; + return ( + <> +
+ + + ); }; export { Home }; diff --git a/pagina-institucional/src/style/HeaderBottom.module.scss b/pagina-institucional/src/style/HeaderBottom.module.scss new file mode 100644 index 0000000..9a2f870 --- /dev/null +++ b/pagina-institucional/src/style/HeaderBottom.module.scss @@ -0,0 +1,27 @@ +.header___wrapper { + display: flex; + background: #000; + gap: 55px; + height: 44px; + + .textlinks1 { + margin-left: 125px; + } + + .textlinks1, + .textlinks2, + .textlinks3 { + display: flex; + align-self: center; + text-transform: uppercase; + color: white; + text-align: center; + text-decoration: none; + } + + .textcontainer { + display: flex; + align-items: center; + justify-content: space-between; + } +}