diff --git a/src/assets/img/fechar.png b/src/assets/img/fechar.png new file mode 100644 index 0000000..2d8e52b Binary files /dev/null and b/src/assets/img/fechar.png differ diff --git a/src/components/header/Menu.tsx b/src/components/header/Menu.tsx index 49c459a..f31061f 100644 --- a/src/components/header/Menu.tsx +++ b/src/components/header/Menu.tsx @@ -2,6 +2,7 @@ import React from "react"; import Modal from 'react-modal' import styles from '../../styles/Menu.module.scss' +import Fechar from '../../assets/img/fechar.png' interface MenuProps { isOpen: boolean; @@ -16,7 +17,13 @@ function Menu ({isOpen, onRequestClose}: MenuProps) { overlayClassName={styles['menu-hamb']} className={styles['menu']} > +

Entrar

+ x +
+

Cursos

+

Saiba Mais

+

Institucionais

) } diff --git a/src/styles/Footer.module.scss b/src/styles/Footer.module.scss index 77a4efb..8f40097 100644 --- a/src/styles/Footer.module.scss +++ b/src/styles/Footer.module.scss @@ -19,6 +19,8 @@ footer { width: 37.03%; padding: 16px 0px; + + label{ font-family: 'Roboto', sans-serif; font-size: 18px; @@ -120,8 +122,7 @@ footer { padding: 0px 100px; .footer__text-bottom{ - width: 18.28%; - height: 24px; + width: 20%; font-style: normal; font-size: 10px; line-height: 12px; @@ -130,7 +131,7 @@ footer { .footer__container-bandeiras{ display: flex; - width: 31.14%; + width: 40%; justify-content: space-between; .footer__line{ @@ -147,8 +148,6 @@ footer { align-items: center; justify-content: space-between; width: 17.70%; - height: 16px; - p { font-weight: 400; font-size: 10px; @@ -166,3 +165,47 @@ footer { } +@media (max-width: 1024px) { + footer { + .footer__newsletter{ + .footer__newsletter-form{ + width: 100%; + padding: 16px 16px; + + .footer__newsletter-input{ + flex-direction: column; + input{ + width: 96.5%; + } + } + } + } + + .footer__top{ + flex-direction: column; + padding: 24px 16px; + .footer__infos{ + flex-direction: column; + } + + .footer__info{ + display: none; + } + } + + .footer__bottom{ + padding: 0px 16px; + align-items: flex-start; + flex-direction: column; + + .footer__text-bottom{ + width: 30%; + } + + .footer__certificate { + width: 30%; + } + } + } +} +