-
-
-
-
- );
+ );
}
diff --git a/src/components/Footer/FooterTop/footerTop.module.scss b/src/components/Footer/FooterTop/footerTop.module.scss
index e24fdbc..71c2bb8 100644
--- a/src/components/Footer/FooterTop/footerTop.module.scss
+++ b/src/components/Footer/FooterTop/footerTop.module.scss
@@ -1,186 +1,186 @@
.containerFooterTop {
- display: flex;
- justify-content: space-between;
+ display: flex;
+ justify-content: space-between;
- padding: 50px 100px;
+ padding: 50px 100px;
- .wrapperFooterTop {
- width: 14.3518%;
- }
-
- div h4 {
- font-weight: 500;
- font-size: 14px;
- line-height: 16px;
-
- text-transform: uppercase;
-
- color: var(--black-100);
- }
-
- div ul li {
- list-style: none;
-
- font-weight: 400;
- font-size: 12px;
- line-height: 14px;
- margin-top: 12px;
-
- color: var(--black-100);
-
- &:last-child {
- text-decoration: underline;
- }
- }
-
- .containerSupportClient {
- width: 14.3518%;
-
- .listLinksFooterTop {
- display: flex;
- flex-direction: column;
- gap: 12px;
-
- .supportClient {
- text-decoration: none;
- margin: 0;
-
- &:first-child {
- margin-top: 12px;
- }
-
- .titleSuportClient {
- font-weight: 500;
- }
-
- .numberDecoration {
- text-decoration: underline;
- }
- }
- }
- }
-
- .containerSocialIcons {
- width: 19.9074%;
-
- .wrapperSocialIcons {
- display: flex;
- gap: 10px;
- margin-bottom: 8px;
-
- a {
- width: 16.279%;
- display: flex;
-
- svg {
- width: 100%;
- }
- }
+ .wrapperFooterTop {
+ width: 14.3518%;
}
- .linkSocial {
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: var(--black-100);
- }
- }
-
- .linkRevendedor {
- text-decoration: underline;
- }
-}
-
-@media screen and (min-width: 2500px) {
- .containerFooterTop {
div h4 {
- font-size: 28px;
- line-height: 33px;
+ font-weight: 500;
+ font-size: 14px;
+ line-height: 16px;
+
+ text-transform: uppercase;
+
+ color: var(--black-100);
}
div ul li {
- font-size: 24px;
- line-height: 28px;
+ list-style: none;
+
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ margin-top: 12px;
+
+ color: var(--black-100);
+
+ &:last-child {
+ text-decoration: underline;
+ }
+ }
+
+ .containerSupportClient {
+ width: 14.3518%;
+
+ .listLinksFooterTop {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+
+ .supportClient {
+ text-decoration: none;
+ margin: 0;
+
+ &:first-child {
+ margin-top: 12px;
+ }
+
+ .titleSuportClient {
+ font-weight: 500;
+ }
+
+ .numberDecoration {
+ text-decoration: underline;
+ }
+ }
+ }
}
.containerSocialIcons {
- width: 16.9565%;
- .wrapperSocialIcons {
- a {
- width: 17.9487%;
- }
- }
+ width: 19.9074%;
- .linkSocial {
- font-size: 28px;
- line-height: 33px;
- }
+ .wrapperSocialIcons {
+ display: flex;
+ gap: 10px;
+ margin-bottom: 8px;
+
+ a {
+ width: 16.279%;
+ display: flex;
+
+ svg {
+ width: 100%;
+ }
+ }
+ }
+
+ .linkSocial {
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+
+ color: var(--black-100);
+ }
+ }
+
+ .linkRevendedor {
+ text-decoration: underline;
+ }
+}
+
+@media screen and (min-width: 2500px) {
+ .containerFooterTop {
+ div h4 {
+ font-size: 28px;
+ line-height: 33px;
+ }
+
+ div ul li {
+ font-size: 24px;
+ line-height: 28px;
+ }
+
+ .containerSocialIcons {
+ width: 16.9565%;
+ .wrapperSocialIcons {
+ a {
+ width: 17.9487%;
+ }
+ }
+
+ .linkSocial {
+ font-size: 28px;
+ line-height: 33px;
+ }
+ }
}
- }
}
@media screen and (max-width: 1024px) {
- .containerFooterTop {
- padding: 24px 16px;
- flex-direction: column;
- gap: 12px;
+ .containerFooterTop {
+ padding: 24px 16px;
+ flex-direction: column;
+ gap: 12px;
- .wrapperFooterTop,
- .containerSupportClient {
- width: 100%;
- }
-
- .containerSupportClient {
- width: 100%;
-
- .listLinksFooterTop {
- display: none;
- }
-
- .active {
- display: flex;
- }
- }
-
- div h4 {
- display: flex;
- align-items: center;
- justify-content: space-between;
-
- text-transform: none;
- &::after {
- content: "+";
- display: inline-block;
- line-height: 8.28px;
- }
-
- &.titleActive::after {
- content: "-";
- }
- }
-
- .listLinksFooterTop {
- display: none;
- }
-
- .active {
- display: block;
- }
-
- .containerSocialIcons {
- width: max-content;
-
- .wrapperSocialIcons {
- margin-bottom: 12px;
- a {
- width: 100%;
-
- svg {
- width: 35px;
- }
+ .wrapperFooterTop,
+ .containerSupportClient {
+ width: 100%;
+ }
+
+ .containerSupportClient {
+ width: 100%;
+
+ .listLinksFooterTop {
+ display: none;
+ }
+
+ .active {
+ display: flex;
+ }
+ }
+
+ div h4 {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ text-transform: none;
+ &::after {
+ content: "+";
+ display: inline-block;
+ line-height: 8.28px;
+ }
+
+ &.titleActive::after {
+ content: "-";
+ }
+ }
+
+ .listLinksFooterTop {
+ display: none;
+ }
+
+ .active {
+ display: block;
+ }
+
+ .containerSocialIcons {
+ width: max-content;
+
+ .wrapperSocialIcons {
+ margin-bottom: 12px;
+ a {
+ width: 100%;
+
+ svg {
+ width: 35px;
+ }
+ }
+ }
}
- }
}
- }
}
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 64b8772..db948a8 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -8,78 +8,70 @@ import { useEffect, useState } from "react";
import styles from "./header.module.scss";
export default function Header() {
- const [showMenuToggle, setShowMenuToggle] = useState(false);
- const [showMenuDesktop, setShowMenuDesktop] = useState(false);
+ const [showMenuToggle, setShowMenuToggle] = useState(false);
+ const [showMenuDesktop, setShowMenuDesktop] = useState(false);
- const openMenuToggle = () => {
- setShowMenuToggle((prev) => !prev);
- };
+ const openMenuToggle = () => {
+ setShowMenuToggle((prev) => !prev);
+ };
- // MONITORAR A TELA PARA MOSTRAR OU NÃO O MENU DESKTOP
- const menuDesktopControl = () => {
- if (window.innerWidth > 1024) {
- return setShowMenuDesktop(true);
- } else {
- return setShowMenuDesktop(false);
- }
- };
+ // MONITORAR A TELA PARA MOSTRAR OU NÃO O MENU DESKTOP
+ const menuDesktopControl = () => {
+ if (window.innerWidth > 1024) {
+ return setShowMenuDesktop(true);
+ } else {
+ return setShowMenuDesktop(false);
+ }
+ };
- useEffect(() => {
- if (window.innerWidth > 1024) {
- setShowMenuDesktop(true);
- } else {
- setShowMenuDesktop(false);
- }
- }, [showMenuDesktop]);
+ useEffect(() => {
+ if (window.innerWidth > 1024) {
+ setShowMenuDesktop(true);
+ } else {
+ setShowMenuDesktop(false);
+ }
+ }, [showMenuDesktop]);
- window.addEventListener("resize", menuDesktopControl);
+ window.addEventListener("resize", menuDesktopControl);
- return (
- <>
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
+ return (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
}
diff --git a/src/components/Header/header.module.scss b/src/components/Header/header.module.scss
index 0a18ad9..47d0b62 100644
--- a/src/components/Header/header.module.scss
+++ b/src/components/Header/header.module.scss
@@ -1,207 +1,207 @@
.containerHeader {
- background: var(--black);
-
- display: flex;
- align-items: center;
- justify-content: space-between;
- padding: 0 100px;
-
- .menuToggle {
- display: none;
- background: transparent;
- }
-
- .logo {
- width: 12.5925%;
-
- padding: 25px 0;
- }
-
- .formSearch {
- width: 24.44%;
- height: 32px;
-
- background: var(--white);
-
- border: 2px solid #f2f2f2;
- border-radius: 5px;
+ background: var(--black);
display: flex;
align-items: center;
justify-content: space-between;
+ padding: 0 100px;
- input {
- background: transparent;
- padding: 0 10px 0 16px;
- width: 100%;
-
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: var(--gray-400);
-
- &::placeholder {
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: var(--gray-400);
- }
+ .menuToggle {
+ display: none;
+ background: transparent;
}
- .searchButton {
- background: transparent;
- height: 18px;
- padding-right: 16px;
+ .logo {
+ width: 12.5925%;
- svg {
- height: 18px;
- cursor: pointer;
- }
- }
- }
-
- .entrarContainer {
- width: 12.5925%;
-
- display: flex;
- justify-content: space-between;
- align-items: center;
-
- a {
- display: flex;
- color: var(--white);
-
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
- text-transform: uppercase;
+ padding: 25px 0;
}
- .cartIcon {
- width: 20.5882%;
+ .formSearch {
+ width: 24.44%;
+ height: 32px;
+
+ background: var(--white);
+
+ border: 2px solid #f2f2f2;
+ border-radius: 5px;
+
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ input {
+ background: transparent;
+ padding: 0 10px 0 16px;
+ width: 100%;
+
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+
+ color: var(--gray-400);
+
+ &::placeholder {
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+
+ color: var(--gray-400);
+ }
+ }
+
+ .searchButton {
+ background: transparent;
+ height: 18px;
+ padding-right: 16px;
+
+ svg {
+ height: 18px;
+ cursor: pointer;
+ }
+ }
+ }
+
+ .entrarContainer {
+ width: 12.5925%;
+
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+
+ a {
+ display: flex;
+ color: var(--white);
+
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+ text-transform: uppercase;
+ }
+
+ .cartIcon {
+ width: 20.5882%;
+ }
}
- }
}
@media screen and (min-width: 2500px) {
- .containerHeader {
- .logo {
- width: 11.5486%;
- }
-
- .formSearch {
- width: 22.3913%;
- height: 57px;
-
- border: 2px solid #f0f0f0;
-
- input {
- padding: 0 16px;
-
- font-size: 28px;
- line-height: 33px;
-
- &::placeholder {
- font-size: 28px;
- line-height: 33px;
+ .containerHeader {
+ .logo {
+ width: 11.5486%;
}
- }
- .searchButton {
- background: transparent;
- height: 35.5px;
- padding-right: 11px;
+ .formSearch {
+ width: 22.3913%;
+ height: 57px;
- svg {
- height: 35.5px;
+ border: 2px solid #f0f0f0;
+
+ input {
+ padding: 0 16px;
+
+ font-size: 28px;
+ line-height: 33px;
+
+ &::placeholder {
+ font-size: 28px;
+ line-height: 33px;
+ }
+ }
+
+ .searchButton {
+ background: transparent;
+ height: 35.5px;
+ padding-right: 11px;
+
+ svg {
+ height: 35.5px;
+ }
+ }
+ }
+
+ .entrarContainer {
+ width: 9.3339%;
+
+ a {
+ font-size: 28px;
+ line-height: 33px;
+ }
+
+ .cartIcon {
+ width: 25.4704%;
+ }
}
- }
}
-
- .entrarContainer {
- width: 9.3339%;
-
- a {
- font-size: 28px;
- line-height: 33px;
- }
-
- .cartIcon {
- width: 25.4704%;
- }
- }
- }
}
@media screen and (max-width: 1024px) {
- .containerHeader {
- padding: 0 16px;
- padding-top: 25px;
- display: grid;
- grid-template-areas:
- "menuToggle logo cart"
- "search search search";
- grid-template-columns: 28px 136px 28px;
+ .containerHeader {
+ padding: 0 16px;
+ padding-top: 25px;
+ display: grid;
+ grid-template-areas:
+ "menuToggle logo cart"
+ "search search search";
+ grid-template-columns: 28px 136px 28px;
- .menuToggle {
- grid-area: menuToggle;
- display: block;
- width: 28px;
+ .menuToggle {
+ grid-area: menuToggle;
+ display: block;
+ width: 28px;
- cursor: pointer;
+ cursor: pointer;
- .toggleOne,
- .toggleTwo,
- .toggleThree {
- background: var(--white);
- height: 3.5px;
- width: 100%;
- margin-top: 6px;
- border-radius: 5px;
+ .toggleOne,
+ .toggleTwo,
+ .toggleThree {
+ background: var(--white);
+ height: 3.5px;
+ width: 100%;
+ margin-top: 6px;
+ border-radius: 5px;
- &:first-child {
- margin-top: 0;
+ &:first-child {
+ margin-top: 0;
+ }
+ }
+ }
+
+ .logo {
+ grid-area: logo;
+ width: 100%;
+ padding: 0;
+ }
+
+ .formSearch {
+ grid-area: search;
+ width: 100%;
+ height: 36px;
+
+ margin: 25px 0;
+
+ input {
+ padding-right: 0;
+ }
+
+ .searchButton {
+ padding-right: 9px;
+ }
+ }
+
+ .entrarContainer {
+ grid-area: cart;
+ width: 100%;
+ max-height: 28px;
+
+ a {
+ display: none;
+ }
+
+ .cartIcon {
+ display: flex;
+ width: 100%;
+ }
}
- }
}
-
- .logo {
- grid-area: logo;
- width: 100%;
- padding: 0;
- }
-
- .formSearch {
- grid-area: search;
- width: 100%;
- height: 36px;
-
- margin: 25px 0;
-
- input {
- padding-right: 0;
- }
-
- .searchButton {
- padding-right: 9px;
- }
- }
-
- .entrarContainer {
- grid-area: cart;
- width: 100%;
- max-height: 28px;
-
- a {
- display: none;
- }
-
- .cartIcon {
- display: flex;
- width: 100%;
- }
- }
- }
}
diff --git a/src/components/Institucional/Contato/Contato.tsx b/src/components/Institucional/Contato/Contato.tsx
index de3f787..8cf6a64 100644
--- a/src/components/Institucional/Contato/Contato.tsx
+++ b/src/components/Institucional/Contato/Contato.tsx
@@ -5,192 +5,166 @@ import { useState } from "react";
import styles from "./contato.module.scss";
interface IFormikValues {
- name: string;
- email: string;
- cpf: string;
- dataNasc: string;
- phone: string;
- instagram: string;
+ name: string;
+ email: string;
+ cpf: string;
+ dataNasc: string;
+ phone: string;
+ instagram: string;
}
const initialValues = {
- name: "",
- email: "",
- cpf: "",
- dataNasc: "",
- phone: "",
- instagram: "",
+ name: "",
+ email: "",
+ cpf: "",
+ dataNasc: "",
+ phone: "",
+ instagram: "",
};
export default function Contato() {
- const [validSubmit, setValidSubmit] = useState(false);
- const handleFormikSubmit = (values: IFormikValues) => {
- setValidSubmit(true);
- };
+ const [validSubmit, setValidSubmit] = useState(false);
+ const handleFormikSubmit = (values: IFormikValues) => {
+ setValidSubmit(true);
+ };
- return (
-
{
- handleFormikSubmit(values);
- resetForm();
- }}
- initialValues={initialValues}
- validationSchema={FormSchema}
- >
-
-
- );
+
+ CPF
+ {
+ return (
+
+
+
+ Data de Nascimento
+ {
+ return (
+
+
+
+ Telefone
+ {
+ return (
+
+
+
+ Instagram
+
+
+
+ *
+ Declaro que li e aceito
+
+
+
Cadastre-se
+ {validSubmit && (
+
*Formulário enviado com sucesso!
+ )}
+
+
+ );
}
diff --git a/src/components/Institucional/Contato/contato.module.scss b/src/components/Institucional/Contato/contato.module.scss
index 684fa53..71d5f17 100644
--- a/src/components/Institucional/Contato/contato.module.scss
+++ b/src/components/Institucional/Contato/contato.module.scss
@@ -1,161 +1,161 @@
.formContato {
- width: 100%;
- h3 {
- font-weight: 700;
- font-size: 24px;
- line-height: 28px;
- color: var(--black);
-
- margin: 10px 0 12px;
- }
-
- .wrapperInput {
- position: relative;
- }
-
- input,
- label {
width: 100%;
- }
+ h3 {
+ font-weight: 700;
+ font-size: 24px;
+ line-height: 28px;
+ color: var(--black);
- label {
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: #100d0e;
- margin-left: 15px;
- }
-
- input {
- margin: 12px 0;
- height: 46px;
-
- border: 1px solid #100d0e;
- border-radius: 25px;
-
- padding: 15px 20px;
-
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: #b9b7b7;
-
- &::placeholder {
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
-
- color: #b9b7b7;
+ margin: 10px 0 12px;
}
- }
- .containerTermos {
- display: flex;
- width: max-content;
- white-space: nowrap;
- align-items: flex-end;
- margin: 2px auto 12px auto;
+ .wrapperInput {
+ position: relative;
+ }
+
+ input,
+ label {
+ width: 100%;
+ }
label {
- margin: 0;
- margin-right: 4px;
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+
+ color: #100d0e;
+ margin-left: 15px;
}
input {
- margin: 0;
- min-width: 18px;
- height: 18px;
- }
- }
+ margin: 12px 0;
+ height: 46px;
- .required {
- color: #ff0000;
- }
+ border: 1px solid #100d0e;
+ border-radius: 25px;
- .termosAcept {
- text-decoration: underline;
- }
+ padding: 15px 20px;
- button {
- width: 100%;
- background: var(--black);
- border-radius: 25px;
- color: var(--white);
- padding: 17px 0;
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
- font-weight: 400;
- font-size: 16px;
- line-height: 19px;
- letter-spacing: 0.05em;
- text-transform: uppercase;
- cursor: pointer;
+ color: #b9b7b7;
- margin-bottom: 12px;
- }
+ &::placeholder {
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
- .errorForm {
- font-weight: 400;
- font-size: 12px;
- line-height: 14px;
- color: #ff0000;
-
- position: absolute;
- display: flex;
- right: 20px;
- }
-
- .sucessSubmit {
- font-weight: 400;
- font-size: 12px;
- line-height: 14px;
- color: #008000;
- }
-}
-
-@media screen and (min-width: 2500px) {
- .formContato {
- h3 {
- font-size: 48px;
- line-height: 56px;
- }
-
- label,
- input {
- font-size: 28px;
- line-height: 33px;
- }
-
- input {
- height: 63px;
- &::placeholder {
- font-size: 28px;
- line-height: 33px;
- }
+ color: #b9b7b7;
+ }
}
.containerTermos {
- input {
- min-width: 36.4px;
- height: 35.15px;
- }
+ display: flex;
+ width: max-content;
+ white-space: nowrap;
+ align-items: flex-end;
+ margin: 2px auto 12px auto;
+
+ label {
+ margin: 0;
+ margin-right: 4px;
+ }
+
+ input {
+ margin: 0;
+ min-width: 18px;
+ height: 18px;
+ }
+ }
+
+ .required {
+ color: #ff0000;
+ }
+
+ .termosAcept {
+ text-decoration: underline;
}
button {
- font-size: 32px;
- line-height: 38px;
+ width: 100%;
+ background: var(--black);
+ border-radius: 25px;
+ color: var(--white);
+ padding: 17px 0;
+
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 19px;
+ letter-spacing: 0.05em;
+ text-transform: uppercase;
+ cursor: pointer;
+
+ margin-bottom: 12px;
}
.errorForm {
- font-size: 24px;
- line-height: 28px;
- top: 17px;
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ color: #ff0000;
+
+ position: absolute;
+ display: flex;
+ right: 20px;
}
.sucessSubmit {
- font-size: 24px;
- line-height: 28px;
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ color: #008000;
+ }
+}
+
+@media screen and (min-width: 2500px) {
+ .formContato {
+ h3 {
+ font-size: 48px;
+ line-height: 56px;
+ }
+
+ label,
+ input {
+ font-size: 28px;
+ line-height: 33px;
+ }
+
+ input {
+ height: 63px;
+ &::placeholder {
+ font-size: 28px;
+ line-height: 33px;
+ }
+ }
+
+ .containerTermos {
+ input {
+ min-width: 36.4px;
+ height: 35.15px;
+ }
+ }
+
+ button {
+ font-size: 32px;
+ line-height: 38px;
+ }
+
+ .errorForm {
+ font-size: 24px;
+ line-height: 28px;
+ top: 17px;
+ }
+
+ .sucessSubmit {
+ font-size: 24px;
+ line-height: 28px;
+ }
}
- }
}
diff --git a/src/components/Institucional/Institucional.tsx b/src/components/Institucional/Institucional.tsx
index a1daf67..b314bc5 100644
--- a/src/components/Institucional/Institucional.tsx
+++ b/src/components/Institucional/Institucional.tsx
@@ -8,99 +8,99 @@ import { HashRouter, Route, Routes, Link } from "react-router-dom";
import { useState } from "react";
export default function Institucional() {
- const hash = window.location.hash.replace("#", "");
- const [active, setActive] = useState(hash);
+ const hash = window.location.hash.replace("#", "");
+ const [active, setActive] = useState(hash);
- const listNavLinks = [
- {
- link: "/sobre",
- name: "Sobre",
- },
- {
- link: "/forma-de-entrega",
- name: "Forma de Entrega",
- },
- {
- link: "/entrega",
- name: "Entrega",
- },
- {
- link: "/troca-e-devolucao",
- name: "Troca e Devolução",
- },
- {
- link: "/seguranca-e-privacidade",
- name: "Segurança e Privacidade",
- },
- {
- link: "/contato",
- name: "Contato",
- },
- ];
+ const listNavLinks = [
+ {
+ link: "/sobre",
+ name: "Sobre",
+ },
+ {
+ link: "/forma-de-entrega",
+ name: "Forma de Entrega",
+ },
+ {
+ link: "/entrega",
+ name: "Entrega",
+ },
+ {
+ link: "/troca-e-devolucao",
+ name: "Troca e Devolução",
+ },
+ {
+ link: "/seguranca-e-privacidade",
+ name: "Segurança e Privacidade",
+ },
+ {
+ link: "/contato",
+ name: "Contato",
+ },
+ ];
- return (
-
-
-
-
-
-
Institucional
+ return (
+
+
+
+
+
+
Institucional
-
-
-
- {listNavLinks.map((item) => {
- return (
-
-
- );
- })}
-
-
+
+
+
+ {listNavLinks.map((item) => {
+ return (
+
+
+ );
+ })}
+
+
-
-
-
-
-
- );
+
+
+
+ );
}
diff --git a/src/components/Institucional/Sobre/Sobre.tsx b/src/components/Institucional/Sobre/Sobre.tsx
index 0ffd55f..2a9cd09 100644
--- a/src/components/Institucional/Sobre/Sobre.tsx
+++ b/src/components/Institucional/Sobre/Sobre.tsx
@@ -1,42 +1,39 @@
import styles from "./sobre.module.scss";
interface Props {
- title: string;
+ title: string;
}
export default function Sobre({ title }: Props) {
- return (
-
- {title}
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
- veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
- commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
- velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
- occaecat cupidatat non proident, sunt in culpa qui officia deserunt
- mollit anim id est laborum.
-
-
- Sed ut perspiciatis unde omnis iste natus error sit voluptatem
- accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab
- illo inventore veritatis et quasi architecto beatae vitae dicta sunt
- explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut
- odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
- voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum
- quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam
- eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat
- voluptatem.
-
-
- Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis
- suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis
- autem vel eum iure reprehenderit qui in ea voluptate velit esse quam
- nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
- voluptas nulla pariatur?
-
-
- );
+ return (
+
+ {title}
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+ incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
+ exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
+ irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
+ pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
+ deserunt mollit anim id est laborum.
+
+
+ Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
+ doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
+ veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
+ voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur
+ magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est,
+ qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non
+ numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat
+ voluptatem.
+
+
+ Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit
+ laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure
+ reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel
+ illum qui dolorem eum fugiat quo voluptas nulla pariatur?
+
+
+ );
}
diff --git a/src/components/Institucional/Sobre/sobre.module.scss b/src/components/Institucional/Sobre/sobre.module.scss
index 87ebf6a..8b91ed6 100644
--- a/src/components/Institucional/Sobre/sobre.module.scss
+++ b/src/components/Institucional/Sobre/sobre.module.scss
@@ -1,49 +1,49 @@
.contentInfo {
- padding-bottom: 27px;
- h3 {
- font-weight: 700;
- font-size: 24px;
- line-height: 28px;
+ padding-bottom: 27px;
+ h3 {
+ font-weight: 700;
+ font-size: 24px;
+ line-height: 28px;
- color: var(--black-50);
+ color: var(--black-50);
- margin: 10px 0 12px;
- }
+ margin: 10px 0 12px;
+ }
- p {
- font-weight: 400;
- font-size: 13px;
- line-height: 15px;
+ p {
+ font-weight: 400;
+ font-size: 13px;
+ line-height: 15px;
- color: var(--gray-500);
- }
+ color: var(--gray-500);
+ }
}
@media screen and (min-width: 2500px) {
- .contentInfo {
- h3 {
- font-size: 48px;
- line-height: 56px;
- }
+ .contentInfo {
+ h3 {
+ font-size: 48px;
+ line-height: 56px;
+ }
- p {
- font-size: 26px;
- line-height: 30px;
+ p {
+ font-size: 26px;
+ line-height: 30px;
+ }
}
- }
}
@media screen and (max-width: 1024px) {
- .contentInfo {
- padding: 0;
- h3 {
- text-align: center;
- }
+ .contentInfo {
+ padding: 0;
+ h3 {
+ text-align: center;
+ }
- p {
- text-align: justify;
- font-size: 12px;
- line-height: 18px;
+ p {
+ text-align: justify;
+ font-size: 12px;
+ line-height: 18px;
+ }
}
- }
}
diff --git a/src/components/Institucional/institucional.module.scss b/src/components/Institucional/institucional.module.scss
index 9be0b64..2c52909 100644
--- a/src/components/Institucional/institucional.module.scss
+++ b/src/components/Institucional/institucional.module.scss
@@ -1,143 +1,143 @@
.containerInstitucional {
- padding: 0 100px;
- .containerBreadcrumb {
- padding: 29px 0 0 0;
- display: flex;
- align-items: center;
- list-style: none;
+ padding: 0 100px;
+ .containerBreadcrumb {
+ padding: 29px 0 0 0;
+ display: flex;
+ align-items: center;
+ list-style: none;
- .homeIcon,
- .arrowIcon {
- margin-right: 10px;
- display: flex;
- }
-
- .homeIcon {
- width: 16px;
- }
-
- .arrowIcon {
- width: 4.6px;
- height: 8px;
- }
-
- a {
- font-weight: 400;
- font-size: 12px;
- line-height: 14px;
- text-transform: uppercase;
- color: var(--gray-400);
- }
- }
-
- .titleInstitucional {
- margin: 80px 0;
- text-align: center;
-
- font-weight: 400;
- font-size: 24px;
- line-height: 28px;
- letter-spacing: 0.1em;
- text-transform: uppercase;
- color: var(--black-50);
- }
-
- .containerInfo {
- display: flex;
- margin-bottom: 60px;
- nav {
- min-width: 27.9629%;
- height: 285px;
- margin-right: 30px;
-
- border-right: 1px solid var(--black);
-
- ul {
- li {
- list-style: none;
- padding: 10px 0;
-
- font-weight: 400;
- font-size: 16px;
- line-height: 19px;
- color: var(--gray-500);
-
- a {
- padding: 0 16px;
- }
+ .homeIcon,
+ .arrowIcon {
+ margin-right: 10px;
+ display: flex;
}
- .active {
- background: var(--black);
- color: var(--white);
- font-weight: 700;
+ .homeIcon {
+ width: 16px;
+ }
+
+ .arrowIcon {
+ width: 4.6px;
+ height: 8px;
+ }
+
+ a {
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ text-transform: uppercase;
+ color: var(--gray-400);
+ }
+ }
+
+ .titleInstitucional {
+ margin: 80px 0;
+ text-align: center;
+
+ font-weight: 400;
+ font-size: 24px;
+ line-height: 28px;
+ letter-spacing: 0.1em;
+ text-transform: uppercase;
+ color: var(--black-50);
+ }
+
+ .containerInfo {
+ display: flex;
+ margin-bottom: 60px;
+ nav {
+ min-width: 27.9629%;
+ height: 285px;
+ margin-right: 30px;
+
+ border-right: 1px solid var(--black);
+
+ ul {
+ li {
+ list-style: none;
+ padding: 10px 0;
+
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 19px;
+ color: var(--gray-500);
+
+ a {
+ padding: 0 16px;
+ }
+ }
+
+ .active {
+ background: var(--black);
+ color: var(--white);
+ font-weight: 700;
+ }
+ }
}
- }
}
- }
}
@media screen and (min-width: 2500px) {
- .containerInstitucional {
- .containerBreadcrumb {
- .homeIcon,
- .arrowIcon {
- margin-right: 12px;
- }
+ .containerInstitucional {
+ .containerBreadcrumb {
+ .homeIcon,
+ .arrowIcon {
+ margin-right: 12px;
+ }
- .homeIcon {
- width: 31px;
- }
+ .homeIcon {
+ width: 31px;
+ }
- .arrowIcon {
- width: 8.9px;
- height: 15.62px;
- }
+ .arrowIcon {
+ width: 8.9px;
+ height: 15.62px;
+ }
- a {
- font-size: 24px;
- line-height: 28px;
- }
- }
-
- .titleInstitucional {
- font-size: 48px;
- line-height: 56px;
- }
-
- .containerInfo {
- nav {
- min-width: 25.6521%;
- height: 465px;
-
- ul {
- li {
- font-size: 32px;
- line-height: 38px;
- }
+ a {
+ font-size: 24px;
+ line-height: 28px;
+ }
+ }
+
+ .titleInstitucional {
+ font-size: 48px;
+ line-height: 56px;
+ }
+
+ .containerInfo {
+ nav {
+ min-width: 25.6521%;
+ height: 465px;
+
+ ul {
+ li {
+ font-size: 32px;
+ line-height: 38px;
+ }
+ }
+ }
}
- }
}
- }
}
@media screen and (max-width: 1024px) {
- .containerInstitucional {
- padding: 0 16px;
+ .containerInstitucional {
+ padding: 0 16px;
- .titleInstitucional {
- margin-bottom: 40px;
- }
+ .titleInstitucional {
+ margin-bottom: 40px;
+ }
- .containerInfo {
- flex-direction: column;
- margin-bottom: 80px;
- nav {
- min-width: 100%;
- border: 0;
- height: auto;
- margin-bottom: 30px;
- }
+ .containerInfo {
+ flex-direction: column;
+ margin-bottom: 80px;
+ nav {
+ min-width: 100%;
+ border: 0;
+ height: auto;
+ margin-bottom: 30px;
+ }
+ }
}
- }
}
diff --git a/src/components/MenuNav/MenuNav.tsx b/src/components/MenuNav/MenuNav.tsx
index e8a2e12..3bdc9b1 100644
--- a/src/components/MenuNav/MenuNav.tsx
+++ b/src/components/MenuNav/MenuNav.tsx
@@ -1,19 +1,19 @@
import styles from "./menuNav.module.scss";
export default function MenuNav() {
- return (
-
-
-
- );
+ return (
+
+
+
+ );
}
diff --git a/src/components/MenuNav/menuNav.module.scss b/src/components/MenuNav/menuNav.module.scss
index 2a528cc..5ac2f5f 100644
--- a/src/components/MenuNav/menuNav.module.scss
+++ b/src/components/MenuNav/menuNav.module.scss
@@ -1,50 +1,50 @@
.menuNav {
- border-top: 1px solid var(--gray-400);
+ border-top: 1px solid var(--gray-400);
- display: flex;
- background: var(--black);
- gap: 55px;
- padding: 0 100px;
- max-height: 44px;
+ display: flex;
+ background: var(--black);
+ gap: 55px;
+ padding: 0 100px;
+ max-height: 44px;
- li {
- color: var(--white);
- list-style: none;
- text-transform: uppercase;
+ li {
+ color: var(--white);
+ list-style: none;
+ text-transform: uppercase;
- font-weight: 500;
- font-size: 14px;
- line-height: 16px;
+ font-weight: 500;
+ font-size: 14px;
+ line-height: 16px;
- padding: 14px 0;
- }
+ padding: 14px 0;
+ }
}
@media screen and (min-width: 2500px) {
- .menuNav {
- max-height: 61px;
- li {
- font-size: 28px;
- line-height: 33px;
+ .menuNav {
+ max-height: 61px;
+ li {
+ font-size: 28px;
+ line-height: 33px;
+ }
}
- }
}
@media screen and (max-width: 1024px) {
- .menuNav {
- border: 0;
- padding: 0 16px;
+ .menuNav {
+ border: 0;
+ padding: 0 16px;
- background: transparent;
- flex-direction: column;
- gap: 12px;
+ background: transparent;
+ flex-direction: column;
+ gap: 12px;
- margin-top: 31px;
- max-height: max-content;
+ margin-top: 31px;
+ max-height: max-content;
- li {
- color: var(--gray-400);
- padding: 0;
+ li {
+ color: var(--gray-400);
+ padding: 0;
+ }
}
- }
}
diff --git a/src/components/MenuToggle/MenuToggle.tsx b/src/components/MenuToggle/MenuToggle.tsx
index 45a82a9..087f6ee 100644
--- a/src/components/MenuToggle/MenuToggle.tsx
+++ b/src/components/MenuToggle/MenuToggle.tsx
@@ -5,36 +5,33 @@ import { ReactComponent as CloseMenuIcon } from "./assets/closeMenu.svg";
import styles from "./menuToggle.module.scss";
interface PropsMenuTogle {
- showMenuToggle: boolean;
- setShowMenuToggle: React.Dispatch
>;
+ showMenuToggle: boolean;
+ setShowMenuToggle: React.Dispatch>;
}
-export const MenuToggle = ({
- showMenuToggle,
- setShowMenuToggle,
-}: PropsMenuTogle) => {
- return (
- <>
- {showMenuToggle ? (
-
-
-
-
Entrar
-
- setShowMenuToggle((prev) => !prev)}
- className={styles.closeMenuIcon}
- />
-
-
-
-
-
setShowMenuToggle((prev) => !prev)}
- className={styles.closeMenu}
- >
-
+
+
+
Entrar
+
+ setShowMenuToggle((prev) => !prev)}
+ className={styles.closeMenuIcon}
+ />
+
+
+
+
+
setShowMenuToggle((prev) => !prev)}
+ className={styles.closeMenu}
+ >
+
{
- handleFormikSubmit(value);
- resetForm();
- }}
- initialValues={initialValue}
- >
-
-
- );
+ return (
+ {
+ handleFormikSubmit(value);
+ resetForm();
+ }}
+ initialValues={initialValue}
+ >
+
+
+ );
}
diff --git a/src/components/Newsletter/newsletter.module.scss b/src/components/Newsletter/newsletter.module.scss
index 4f4a650..25d7ad2 100644
--- a/src/components/Newsletter/newsletter.module.scss
+++ b/src/components/Newsletter/newsletter.module.scss
@@ -1,140 +1,140 @@
.formNewsletter {
- padding: 16px 0;
- border-top: 1px solid var(--black);
- border-bottom: 1px solid var(--black);
+ padding: 16px 0;
+ border-top: 1px solid var(--black);
+ border-bottom: 1px solid var(--black);
- height: 104px;
+ height: 104px;
- .containerForm {
- width: 37.0312%;
- display: flex;
- flex-direction: column;
- margin: 0 auto;
+ .containerForm {
+ width: 37.0312%;
+ display: flex;
+ flex-direction: column;
+ margin: 0 auto;
- h3 {
- font-weight: 500;
- font-size: 18px;
- line-height: 21px;
- letter-spacing: 0.05em;
- font-variant: small-caps;
- text-transform: uppercase;
+ h3 {
+ font-weight: 500;
+ font-size: 18px;
+ line-height: 21px;
+ letter-spacing: 0.05em;
+ font-variant: small-caps;
+ text-transform: uppercase;
- color: var(--black-100);
- margin-bottom: 8px;
- }
-
- .containerInputNewsletter {
- display: flex;
- height: 42px;
-
- input {
- flex: 1;
- background: transparent;
- border: 1px solid #e5e5e5;
- border-radius: 4px;
- padding: 13px 16px;
-
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
- color: var(--gray-400);
-
- &::placeholder {
- font-weight: 400;
- font-size: 14px;
- line-height: 16px;
- color: var(--gray-400);
+ color: var(--black-100);
+ margin-bottom: 8px;
}
- }
- button {
- width: 26.5822%;
- background: #000000;
- box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
- border-radius: 4px;
- margin-left: 8px;
+ .containerInputNewsletter {
+ display: flex;
+ height: 42px;
- font-weight: 700;
- font-size: 12px;
- line-height: 14px;
- letter-spacing: 0.05em;
- text-transform: uppercase;
+ input {
+ flex: 1;
+ background: transparent;
+ border: 1px solid #e5e5e5;
+ border-radius: 4px;
+ padding: 13px 16px;
- color: var(--white);
- cursor: pointer;
- }
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+ color: var(--gray-400);
+
+ &::placeholder {
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+ color: var(--gray-400);
+ }
+ }
+
+ button {
+ width: 26.5822%;
+ background: #000000;
+ box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+ border-radius: 4px;
+ margin-left: 8px;
+
+ font-weight: 700;
+ font-size: 12px;
+ line-height: 14px;
+ letter-spacing: 0.05em;
+ text-transform: uppercase;
+
+ color: var(--white);
+ cursor: pointer;
+ }
+ }
}
- }
}
@media screen and (min-width: 2500px) {
- .formNewsletter {
- height: 141px;
- .containerForm {
- width: 37.3581%;
+ .formNewsletter {
+ height: 141px;
+ .containerForm {
+ width: 37.3581%;
- h3 {
- font-size: 36px;
- line-height: 42px;
- }
+ h3 {
+ font-size: 36px;
+ line-height: 42px;
+ }
- .containerInputNewsletter {
- height: 59px;
- input {
- font-size: 28px;
- line-height: 33px;
+ .containerInputNewsletter {
+ height: 59px;
+ input {
+ font-size: 28px;
+ line-height: 33px;
- &::placeholder {
- font-size: 28px;
- line-height: 33px;
- }
+ &::placeholder {
+ font-size: 28px;
+ line-height: 33px;
+ }
+ }
+
+ button {
+ font-size: 24px;
+ line-height: 28px;
+ }
+ }
}
-
- button {
- font-size: 24px;
- line-height: 28px;
- }
- }
}
- }
}
@media screen and (max-width: 1024px) {
- .formNewsletter {
- padding: 16px;
- height: auto;
-
- .containerForm {
- width: 100%;
-
- h3 {
- font-size: 14px;
- line-height: 16px;
- margin-bottom: 16px;
- }
-
- .containerInputNewsletter {
- flex-direction: column;
+ .formNewsletter {
+ padding: 16px;
height: auto;
- input {
- padding: 17px 16px;
- max-height: 50px;
+ .containerForm {
+ width: 100%;
+
+ h3 {
+ font-size: 14px;
+ line-height: 16px;
+ margin-bottom: 16px;
+ }
+
+ .containerInputNewsletter {
+ flex-direction: column;
+ height: auto;
+
+ input {
+ padding: 17px 16px;
+ max-height: 50px;
+ }
+
+ button {
+ width: 100%;
+ margin: 0;
+ margin-top: 16px;
+ padding: 17px 0;
+
+ box-shadow: none;
+ border-radius: 0;
+
+ font-size: 14px;
+ line-height: 16px;
+ }
+ }
}
-
- button {
- width: 100%;
- margin: 0;
- margin-top: 16px;
- padding: 17px 0;
-
- box-shadow: none;
- border-radius: 0;
-
- font-size: 14px;
- line-height: 16px;
- }
- }
}
- }
}
diff --git a/src/index.tsx b/src/index.tsx
index ce8d748..a0f3cf6 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -3,11 +3,9 @@ import ReactDOM from "react-dom/client";
import "./styles/global.scss";
import Home from "./pages/Home";
-const root = ReactDOM.createRoot(
- document.getElementById("root") as HTMLElement
-);
+const root = ReactDOM.createRoot(document.getElementById("root") as HTMLElement);
root.render(
-
-
+
+
);
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index c312451..01884be 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -6,14 +6,14 @@ import Institucional from "../components/Institucional/Institucional";
import ElementFloat from "../components/ElementFloat/ElementFloat";
function Home() {
- return (
-
-
-
- );
+ return (
+
+
+
+ );
}
export default Home;
diff --git a/src/pages/home.module.scss b/src/pages/home.module.scss
index 84aaf31..63b8db5 100644
--- a/src/pages/home.module.scss
+++ b/src/pages/home.module.scss
@@ -1,10 +1,10 @@
.containerHome {
- position: relative;
- display: grid;
- height: 100vh;
- grid-template-rows: max-content max-content 1fr;
+ position: relative;
+ display: grid;
+ height: 100vh;
+ grid-template-rows: max-content max-content 1fr;
- footer {
- align-self: end;
- }
+ footer {
+ align-self: end;
+ }
}
diff --git a/src/schema/FormSchema.ts b/src/schema/FormSchema.ts
index d11a417..f10df9a 100644
--- a/src/schema/FormSchema.ts
+++ b/src/schema/FormSchema.ts
@@ -4,50 +4,48 @@ import { parse, isValid, isFuture } from "date-fns";
import enGb from "date-fns/locale/en-GB";
const convertDate = (value: string) => {
- if (value === null || value === undefined) {
- return false;
- } else {
- const dataFormated = value.replaceAll(".", "/");
- const parsedDate = parse(dataFormated, "P", new Date(), { locale: enGb });
+ if (value === null || value === undefined) {
+ return false;
+ } else {
+ const dataFormated = value.replaceAll(".", "/");
+ const parsedDate = parse(dataFormated, "P", new Date(), { locale: enGb });
- if (isFuture(parsedDate)) {
- return false;
- } else if (isValid(parsedDate)) {
- return true;
+ if (isFuture(parsedDate)) {
+ return false;
+ } else if (isValid(parsedDate)) {
+ return true;
+ }
+
+ return false;
}
-
- return false;
- }
};
const convertPhone = (value: string) => {
- if (value === null || value === undefined) {
- return false;
- } else {
- const phoneNumbers = value.replace(/\D/g, "");
- if (phoneNumbers.length < 11) {
- return false;
+ if (value === null || value === undefined) {
+ return false;
} else {
- return true;
+ const phoneNumbers = value.replace(/\D/g, "");
+ if (phoneNumbers.length < 11) {
+ return false;
+ } else {
+ return true;
+ }
}
- }
};
export default Yup.object().shape({
- name: Yup.string()
- .required("*Campo obrigatório")
- .min(3, "*Nome muito pequeno"),
- email: Yup.string().required("*Campo obrigatório").email("*Email inválido"),
- cpf: Yup.string()
- .required("*Campo obrigatório")
- .test("cpf", "*CPF Inválido", (value) => cpfValid.isValid(value!)),
- dataNasc: Yup.string()
- .required("*Campo obrigatório")
- .test("dataNasc", "*Data Inválida", (data) => convertDate(data!)),
- phone: Yup.string()
- .required("*Campo obrigatório")
- .test("phone", "*Telefone Inválido", (phone) => convertPhone(phone!)),
- instagram: Yup.string()
- .matches(/^@/, "*@ no início é obrigatório")
- .min(4, "*Nome de usuario muito curto"),
+ name: Yup.string().required("*Campo obrigatório").min(3, "*Nome muito pequeno"),
+ email: Yup.string().required("*Campo obrigatório").email("*Email inválido"),
+ cpf: Yup.string()
+ .required("*Campo obrigatório")
+ .test("cpf", "*CPF Inválido", (value) => cpfValid.isValid(value!)),
+ dataNasc: Yup.string()
+ .required("*Campo obrigatório")
+ .test("dataNasc", "*Data Inválida", (data) => convertDate(data!)),
+ phone: Yup.string()
+ .required("*Campo obrigatório")
+ .test("phone", "*Telefone Inválido", (phone) => convertPhone(phone!)),
+ instagram: Yup.string()
+ .matches(/^@/, "*@ no início é obrigatório")
+ .min(4, "*Nome de usuario muito curto"),
});
diff --git a/src/styles/global.scss b/src/styles/global.scss
index f677956..31313a3 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -1,32 +1,31 @@
:root {
- --black: #000000;
- --black-100: #303030;
- --black-50: #292929;
+ --black: #000000;
+ --black-100: #303030;
+ --black-50: #292929;
- --white: #ffffff;
+ --white: #ffffff;
- --gray-500: #7d7d7d;
- --gray-400: #c4c4c4;
+ --gray-500: #7d7d7d;
+ --gray-400: #c4c4c4;
}
* {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
- border: none;
- text-decoration: none;
- outline: none;
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ border: none;
+ text-decoration: none;
+ outline: none;
}
body {
- font-family: "Roboto", sans-serif;
+ font-family: "Roboto", sans-serif;
}
code {
- font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
- monospace;
+ font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
}
a {
- color: inherit;
+ color: inherit;
}
- 
- 
- 
- 
- 
- 
- 
- 
-
-