diff --git a/README.md b/README.md index d322d72..8240b44 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Desafio REACT e Typescript -Para rodar o projeto, use o no terminal: +Para rodar o projeto, use no terminal: cd react-project npm start diff --git a/react-project/src/components/Header/Hamburguer.tsx b/react-project/src/components/Header/Hamburguer.tsx index 247d859..13a7b7e 100644 --- a/react-project/src/components/Header/Hamburguer.tsx +++ b/react-project/src/components/Header/Hamburguer.tsx @@ -2,6 +2,7 @@ import { useState } from "react"; import Modal from "react-modal"; import hamburguer from "./assets/modules/Hamburguer.module.scss"; +import { LinksMenu } from "./LinksMenu"; import hamb from "./assets/svgs/hamburguer.svg"; import close from "./assets/svgs/close.svg"; @@ -31,15 +32,9 @@ const Hamburguer = () => { diff --git a/react-project/src/components/Header/LinksMenu.tsx b/react-project/src/components/Header/LinksMenu.tsx new file mode 100644 index 0000000..9d33d89 --- /dev/null +++ b/react-project/src/components/Header/LinksMenu.tsx @@ -0,0 +1,15 @@ +interface ILinkMenu { + href: string; + text: string; +} + +const LinksMenu = (props: ILinkMenu) => { + const { href, text } = props; + return ( +
  • + {text} +
  • + ); +}; + +export { LinksMenu }; diff --git a/react-project/src/components/Header/Menu.tsx b/react-project/src/components/Header/Menu.tsx index 286435f..7903489 100644 --- a/react-project/src/components/Header/Menu.tsx +++ b/react-project/src/components/Header/Menu.tsx @@ -1,18 +1,13 @@ import menu from "./assets/modules/Menu.module.scss"; +import { LinksMenu } from "./LinksMenu"; const Menu = () => { return ( ); diff --git a/react-project/src/components/Header/assets/modules/Header.module.scss b/react-project/src/components/Header/assets/modules/Header.module.scss index 429c023..0b93306 100644 --- a/react-project/src/components/Header/assets/modules/Header.module.scss +++ b/react-project/src/components/Header/assets/modules/Header.module.scss @@ -32,6 +32,10 @@ line-height: 16px; text-decoration: none; + &:hover { + color: var(--gray-100); + } + @media screen and (min-width: 2500px) { font-size: 28px; line-height: 33px; diff --git a/react-project/src/components/Header/assets/modules/Menu.module.scss b/react-project/src/components/Header/assets/modules/Menu.module.scss index 3538177..eb2fb8b 100644 --- a/react-project/src/components/Header/assets/modules/Menu.module.scss +++ b/react-project/src/components/Header/assets/modules/Menu.module.scss @@ -17,6 +17,10 @@ color: var(--white); text-decoration: none; + &:hover { + color: var(--gray-100); + } + @media screen and (min-width: 2500px) { font-size: 28px; line-height: 33px; diff --git a/react-project/src/components/MainInstitucional/Main.tsx b/react-project/src/components/MainInstitucional/Main.tsx index c59ede7..f2ecb4d 100644 --- a/react-project/src/components/MainInstitucional/Main.tsx +++ b/react-project/src/components/MainInstitucional/Main.tsx @@ -14,7 +14,7 @@ import { Contato } from "./Contato"; const Main = () => { return ( -
    +
    @@ -33,7 +33,7 @@ const Main = () => {
    - + ); };