From fe00fdd50683ac04b0dc061c465552914bc1aee5 Mon Sep 17 00:00:00 2001 From: Ramon Dias Ferreira Date: Wed, 18 Jan 2023 10:59:29 -0300 Subject: [PATCH 1/3] =?UTF-8?q?feat(main):=20classes=20e=20estiliza=C3=A7?= =?UTF-8?q?=C3=A3o?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/main/Main.tsx | 9 +++++---- src/styles/Main.module.scss | 26 ++++++++++++++++++++++++++ 2 files changed, 31 insertions(+), 4 deletions(-) create mode 100644 src/styles/Main.module.scss diff --git a/src/components/main/Main.tsx b/src/components/main/Main.tsx index 205429d..461d946 100644 --- a/src/components/main/Main.tsx +++ b/src/components/main/Main.tsx @@ -2,13 +2,14 @@ import React from 'react'; import Institucional from '../../pages/institucional/Institucional'; import Home from '../../assets/img/home.png' import Arrow from '../../assets/img/arrow-point-to-right.png' +import styles from '../../styles/Main.module.scss' const Main = () => { return( -
-
- home - arrow +
+
+ home + arrow

Institucional

diff --git a/src/styles/Main.module.scss b/src/styles/Main.module.scss new file mode 100644 index 0000000..d9d9aec --- /dev/null +++ b/src/styles/Main.module.scss @@ -0,0 +1,26 @@ +.main__route { + display: flex; + padding: 29px 100px; + width: 8%; + justify-content: space-around; + align-items: center; + + .main__home { + width: 15.69%; + height: 16px; + } + + .main__arrow { + width: 4.47%; + height: 8px; + } + + p { + font-family: 'Roboto', sans-serif; + font-style: normal; + font-weight: 400; + font-size: 12px; + line-height: 14px; + color: #C4C4C4; + } +} -- 2.34.1 From 15d6cabb70a7870065dd9044dd8a19f9ae43aa8c Mon Sep 17 00:00:00 2001 From: Ramon Dias Ferreira Date: Fri, 20 Jan 2023 01:05:31 -0300 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20mask=20input=20implementado,=20but?= =?UTF-8?q?=C3=A3o=20whatsapp=20adicionado,=20atualiza=C3=A7=C3=B5es=20no?= =?UTF-8?q?=20scss=20institucionais=20e=20suas=20respctivas=20rotas.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 410 ++++++++++++++++++++++ package.json | 6 + src/assets/img/Ellipse 2.png | Bin 0 -> 633 bytes src/assets/img/arrow-up.png | Bin 0 -> 198 bytes src/assets/img/whatsapp.png | Bin 0 -> 1042 bytes src/components/whats/Scroll.tsx | 22 ++ src/components/whats/Whats.tsx | 21 ++ src/index.tsx | 2 + src/pages/contato/Contato.tsx | 97 +++-- src/pages/institucional/Institucional.tsx | 12 +- src/schema/schema.tsx | 13 +- src/styles/Contato.module.scss | 32 +- src/styles/Devolucao.module.scss | 11 +- src/styles/Entrega.module.scss | 11 +- src/styles/Institucional.module.scss | 105 ++---- src/styles/Main.module.scss | 13 +- src/styles/Pagamento.module.scss | 12 +- src/styles/Scroll.module.scss | 16 + src/styles/Seguranca.module.scss | 11 +- src/styles/Sobre.module.scss | 11 +- src/styles/Whats.module.scss | 17 + src/utils/validates.tsx | 46 +++ 22 files changed, 746 insertions(+), 122 deletions(-) create mode 100644 src/assets/img/Ellipse 2.png create mode 100644 src/assets/img/arrow-up.png create mode 100644 src/assets/img/whatsapp.png create mode 100644 src/components/whats/Scroll.tsx create mode 100644 src/components/whats/Whats.tsx create mode 100644 src/styles/Scroll.module.scss create mode 100644 src/styles/Whats.module.scss create mode 100644 src/utils/validates.tsx diff --git a/package-lock.json b/package-lock.json index ddc2dca..6c1389e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "my-app", "version": "0.1.0", "dependencies": { + "@hookform/resolvers": "^2.9.10", "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", @@ -15,15 +16,20 @@ "@types/node": "^16.18.11", "@types/react": "^18.0.26", "@types/react-dom": "^18.0.10", + "@types/react-maskedinput": "^4.0.6", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-input-mask": "^3.0.0-alpha.2", "react-modal": "^3.16.1", "react-scripts": "5.0.1", + "regex": "^0.1.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4" }, "devDependencies": { + "@types/react-input-mask": "^3.0.2", "@types/react-modal": "^3.13.1", + "@types/react-text-mask": "^5.4.11", "formik": "^2.2.9", "node-sass": "^8.0.0", "react-text-mask": "^5.5.0", @@ -2219,6 +2225,14 @@ "integrity": "sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==", "devOptional": true }, + "node_modules/@hookform/resolvers": { + "version": "2.9.10", + "resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-2.9.10.tgz", + "integrity": "sha512-JIL1DgJIlH9yuxcNGtyhsWX/PgNltz+5Gr6+8SX9fhXc/hPbEIk6wPI82nhgvp3uUb6ZfAM5mqg/x7KR7NAb+A==", + "peerDependencies": { + "react-hook-form": "^7.0.0" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.11.8", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz", @@ -3932,6 +3946,23 @@ "@types/react": "*" } }, + "node_modules/@types/react-input-mask": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/react-input-mask/-/react-input-mask-3.0.2.tgz", + "integrity": "sha512-WTli3kUyvUqqaOLYG/so2pLqUvRb+n4qnx2He5klfqZDiQmRyD07jVIt/bco/1BrcErkPMtpOm+bHii4Oed6cQ==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, + "node_modules/@types/react-maskedinput": { + "version": "4.0.6", + "resolved": "https://registry.npmjs.org/@types/react-maskedinput/-/react-maskedinput-4.0.6.tgz", + "integrity": "sha512-rLm0t4CcCE0smsOVgZTzwT/amDDBh1sL46V+V22JIeyChibCM7Oe3TNSk66oJK0fHishDyzRg7pd+sH4sozGqg==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -3941,6 +3972,15 @@ "@types/react": "*" } }, + "node_modules/@types/react-text-mask": { + "version": "5.4.11", + "resolved": "https://registry.npmjs.org/@types/react-text-mask/-/react-text-mask-5.4.11.tgz", + "integrity": "sha512-DIJ3/dS4jd7NK3lEgsOwcgpp+ZlVrNJEiUDRayZRE/PNMbV/nLWmOKGdL0BUS29hnx0CDgITgPudKx0BgbF5fA==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -4852,6 +4892,12 @@ "node": ">= 4.0.0" } }, + "node_modules/augment": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/augment/-/augment-3.2.1.tgz", + "integrity": "sha512-g5E3vuN1RvCvCqNLKeNOyvTO4RbpOyasUjc/e8dnK9ecg9J9nrSv8N2PxDdnaBXYgmiTAErnen2harV2euPpEA==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info." + }, "node_modules/autoprefixer": { "version": "10.4.13", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.13.tgz", @@ -5791,6 +5837,14 @@ "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.19.tgz", "integrity": "sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==" }, + "node_modules/colors": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz", + "integrity": "sha512-XjsuUwpDeY98+yz959OlUK6m7mLBM+1MEG5oaenfuQnNnrQk1WvtcvFgN3FNDP3f2NmZ211t0mNEfSEN1h0eIg==", + "engines": { + "node": ">=0.1.90" + } + }, "node_modules/combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -6815,6 +6869,11 @@ "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==" }, + "node_modules/ebnf-parser": { + "version": "0.1.10", + "resolved": "https://registry.npmjs.org/ebnf-parser/-/ebnf-parser-0.1.10.tgz", + "integrity": "sha512-urvSxVQ6XJcoTpc+/x2pWhhuOX4aljCNQpwzw+ifZvV1andZkAmiJc3Rq1oGEAQmcjiLceyMXOy1l8ms8qs2fQ==" + }, "node_modules/ee-first": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", @@ -9311,6 +9370,14 @@ "node": ">= 0.4" } }, + "node_modules/invariant": { + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", + "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", + "dependencies": { + "loose-envify": "^1.0.0" + } + }, "node_modules/ip": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ip/-/ip-2.0.0.tgz", @@ -11769,6 +11836,80 @@ "url": "https://github.com/chalk/supports-color?sponsor=1" } }, + "node_modules/jison": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/jison/-/jison-0.4.4.tgz", + "integrity": "sha512-8KfKaIIngog2VR5UfEmPhcK1i/2XbBzL5KZbuG8M0qLsYWnodWqq7x28XLsee0RazE0Z2OQAaG9/VCk7gi4VOA==", + "dependencies": { + "ebnf-parser": "0.1.x", + "escodegen": "0.0.21", + "esprima": "1.0.x", + "jison-lex": "0.2.x", + "JSONSelect": "0.4.0", + "lex-parser": "0.1.x", + "nomnom": "1.5.2" + }, + "bin": { + "jison": "lib/cli.js" + }, + "engines": { + "node": ">=0.4" + } + }, + "node_modules/jison-lex": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/jison-lex/-/jison-lex-0.2.1.tgz", + "integrity": "sha512-WCNVPRxaTWdhwJAIrBsgkGT9n6H1yNR9Lfof5LUHaMul24ySrJ1SXbVPszZfs57jwXvASLWBpd0xpFEW2oIuVA==", + "dependencies": { + "lex-parser": "0.1.x", + "nomnom": "1.5.2" + }, + "bin": { + "jison-lex": "cli.js" + }, + "engines": { + "node": ">=0.4" + } + }, + "node_modules/jison/node_modules/escodegen": { + "version": "0.0.21", + "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-0.0.21.tgz", + "integrity": "sha512-BQL5g+BqyrM5HRAKt4Q4YuH9CqiEcIHWSJ8fg2PRNkGkXn/LgzeDCZzDDSX4UiljSAHgXaHgOZREQ2xOigbLzA==", + "dependencies": { + "esprima": "~1.0.2", + "estraverse": "~0.0.4" + }, + "bin": { + "escodegen": "bin/escodegen.js", + "esgenerate": "bin/esgenerate.js" + }, + "engines": { + "node": ">=0.4.0" + }, + "optionalDependencies": { + "source-map": ">= 0.1.2" + } + }, + "node_modules/jison/node_modules/esprima": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/esprima/-/esprima-1.0.4.tgz", + "integrity": "sha512-rp5dMKN8zEs9dfi9g0X1ClLmV//WRyk/R15mppFNICIFRG5P92VP7Z04p8pk++gABo9W2tY+kHyu6P1mEHgmTA==", + "bin": { + "esparse": "bin/esparse.js", + "esvalidate": "bin/esvalidate.js" + }, + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/jison/node_modules/estraverse": { + "version": "0.0.4", + "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-0.0.4.tgz", + "integrity": "sha512-21DfBCsFJGb3HZr0vEBH1Wk1tGSbbzA8I/xtSSoy/pRtupHv0OgBmObcNGXM3ec6/pOXTOOUYY9/5bfluzz0sw==", + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/js-base64": { "version": "2.6.4", "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz", @@ -11907,6 +12048,14 @@ "node": ">=0.10.0" } }, + "node_modules/JSONSelect": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/JSONSelect/-/JSONSelect-0.4.0.tgz", + "integrity": "sha512-VRLR3Su35MH+XV2lrvh9O7qWoug/TUyj9tLDjn9rtpUCNnILLrHjgd/tB0KrhugCxUpj3UqoLqfYb3fLJdIQQQ==", + "engines": { + "node": ">=0.4.7" + } + }, "node_modules/jsx-ast-utils": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.3.tgz", @@ -11976,6 +12125,17 @@ "node": ">= 0.8.0" } }, + "node_modules/lex": { + "version": "1.7.4", + "resolved": "https://registry.npmjs.org/lex/-/lex-1.7.4.tgz", + "integrity": "sha512-9B1SLZjx8ZjYJx8AmlbVjeqYDllU7PCWwE/VYgq4DJ5gePjbzgdms+MC7tsj1tdyRp7O6BfXTTDHJnPiiPV0Pw==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info." + }, + "node_modules/lex-parser": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/lex-parser/-/lex-parser-0.1.4.tgz", + "integrity": "sha512-DuAEISsr1H4LOpmFLkyMc8YStiRWZCO8hMsoXAXSbgyfvs2WQhSt0+/FBv3ZU/JBFZMGcE+FWzEBSzwUU7U27w==" + }, "node_modules/lilconfig": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.0.6.tgz", @@ -12961,6 +13121,19 @@ "node": ">=8" } }, + "node_modules/nomnom": { + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.5.2.tgz", + "integrity": "sha512-fiVbT7BqxiQqjlR9U3FDGOSERFCKoXVCdxV2FwZuNN7/cmJ42iQx35nUFOAFDcyvemu9Adp+IlsCGlKQYLmBKw==", + "deprecated": "Package no longer supported. Contact support@npmjs.com for more info.", + "dependencies": { + "colors": "0.5.x", + "underscore": "1.1.x" + }, + "engines": { + "node": "*" + } + }, "node_modules/nopt": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz", @@ -15220,6 +15393,36 @@ "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==", "dev": true }, + "node_modules/react-hook-form": { + "version": "7.42.1", + "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.42.1.tgz", + "integrity": "sha512-2UIGqwMZksd5HS55crTT1ATLTr0rAI4jS7yVuqTaoRVDhY2Qc4IyjskCmpnmdYqUNOYFy04vW253tb2JRVh+IQ==", + "peer": true, + "engines": { + "node": ">=12.22.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/react-hook-form" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17 || ^18" + } + }, + "node_modules/react-input-mask": { + "version": "3.0.0-alpha.2", + "resolved": "https://registry.npmjs.org/react-input-mask/-/react-input-mask-3.0.0-alpha.2.tgz", + "integrity": "sha512-9U7qL+mvDMOJcbOFPdt6Vj+zzmCMNnBjhhjGDrL8BGQmymgvMVKhu/oOVfAkl+5VWOsLr+G3EhZOmae5fBcAkA==", + "dependencies": { + "invariant": "^2.2.4", + "prop-types": "^15.7.2", + "warning": "^4.0.3" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -15553,6 +15756,18 @@ "@babel/runtime": "^7.8.4" } }, + "node_modules/regex": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/regex/-/regex-0.1.1.tgz", + "integrity": "sha512-aZ/uNt2gUw9aD0K18LFAHdOUKsHL2fSny9YLqcxDfLmZOTK8mZxueHsAikh3UjPGZlmr4J3sdCNMPTp1wPR5hA==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.", + "dependencies": { + "augment": "3.2.1", + "jison": "0.4.4", + "lex": "1.7.4", + "statemachines": "0.1.0" + } + }, "node_modules/regex-parser": { "version": "2.2.11", "resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.2.11.tgz", @@ -16401,6 +16616,12 @@ "node": ">= 10" } }, + "node_modules/sorted-array": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/sorted-array/-/sorted-array-1.1.0.tgz", + "integrity": "sha512-jZgZDuFkeb3MJ9dE88/vlK7IB4C1Fip5oyCgabmxk8885dQP+zfZAq88RWzD+4KUskhHETVmDkMtERzRclI6fg==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info." + }, "node_modules/source-list-map": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", @@ -16572,6 +16793,16 @@ "resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.3.4.tgz", "integrity": "sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw==" }, + "node_modules/statemachines": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/statemachines/-/statemachines-0.1.0.tgz", + "integrity": "sha512-RYZMSj20+WOobiIiBkCPUlZlJlnzPwzJ5DR6KA91RmxTBbe7EDB+ISNd2jU7QcI08BubqgL3bHFRhiL/KR3lYQ==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.", + "dependencies": { + "augment": "3.2.1", + "sorted-array": "1.1.0" + } + }, "node_modules/statuses": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz", @@ -17410,6 +17641,14 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/underscore": { + "version": "1.1.7", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.1.7.tgz", + "integrity": "sha512-w4QtCHoLBXw1mjofIDoMyexaEdWGMedWNDhlWTtT1V1lCRqi65Pnoygkh6+WRdr+Bm8ldkBNkNeCsXGMlQS9HQ==", + "engines": { + "node": "*" + } + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", @@ -20034,6 +20273,12 @@ "integrity": "sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==", "devOptional": true }, + "@hookform/resolvers": { + "version": "2.9.10", + "resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-2.9.10.tgz", + "integrity": "sha512-JIL1DgJIlH9yuxcNGtyhsWX/PgNltz+5Gr6+8SX9fhXc/hPbEIk6wPI82nhgvp3uUb6ZfAM5mqg/x7KR7NAb+A==", + "requires": {} + }, "@humanwhocodes/config-array": { "version": "0.11.8", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz", @@ -21307,6 +21552,23 @@ "@types/react": "*" } }, + "@types/react-input-mask": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@types/react-input-mask/-/react-input-mask-3.0.2.tgz", + "integrity": "sha512-WTli3kUyvUqqaOLYG/so2pLqUvRb+n4qnx2He5klfqZDiQmRyD07jVIt/bco/1BrcErkPMtpOm+bHii4Oed6cQ==", + "dev": true, + "requires": { + "@types/react": "*" + } + }, + "@types/react-maskedinput": { + "version": "4.0.6", + "resolved": "https://registry.npmjs.org/@types/react-maskedinput/-/react-maskedinput-4.0.6.tgz", + "integrity": "sha512-rLm0t4CcCE0smsOVgZTzwT/amDDBh1sL46V+V22JIeyChibCM7Oe3TNSk66oJK0fHishDyzRg7pd+sH4sozGqg==", + "requires": { + "@types/react": "*" + } + }, "@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -21316,6 +21578,15 @@ "@types/react": "*" } }, + "@types/react-text-mask": { + "version": "5.4.11", + "resolved": "https://registry.npmjs.org/@types/react-text-mask/-/react-text-mask-5.4.11.tgz", + "integrity": "sha512-DIJ3/dS4jd7NK3lEgsOwcgpp+ZlVrNJEiUDRayZRE/PNMbV/nLWmOKGdL0BUS29hnx0CDgITgPudKx0BgbF5fA==", + "dev": true, + "requires": { + "@types/react": "*" + } + }, "@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -22005,6 +22276,11 @@ "resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz", "integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==" }, + "augment": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/augment/-/augment-3.2.1.tgz", + "integrity": "sha512-g5E3vuN1RvCvCqNLKeNOyvTO4RbpOyasUjc/e8dnK9ecg9J9nrSv8N2PxDdnaBXYgmiTAErnen2harV2euPpEA==" + }, "autoprefixer": { "version": "10.4.13", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.13.tgz", @@ -22696,6 +22972,11 @@ "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.19.tgz", "integrity": "sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==" }, + "colors": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz", + "integrity": "sha512-XjsuUwpDeY98+yz959OlUK6m7mLBM+1MEG5oaenfuQnNnrQk1WvtcvFgN3FNDP3f2NmZ211t0mNEfSEN1h0eIg==" + }, "combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -23439,6 +23720,11 @@ "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==" }, + "ebnf-parser": { + "version": "0.1.10", + "resolved": "https://registry.npmjs.org/ebnf-parser/-/ebnf-parser-0.1.10.tgz", + "integrity": "sha512-urvSxVQ6XJcoTpc+/x2pWhhuOX4aljCNQpwzw+ifZvV1andZkAmiJc3Rq1oGEAQmcjiLceyMXOy1l8ms8qs2fQ==" + }, "ee-first": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", @@ -25285,6 +25571,14 @@ "side-channel": "^1.0.4" } }, + "invariant": { + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", + "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", + "requires": { + "loose-envify": "^1.0.0" + } + }, "ip": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ip/-/ip-2.0.0.tgz", @@ -27050,6 +27344,51 @@ } } }, + "jison": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/jison/-/jison-0.4.4.tgz", + "integrity": "sha512-8KfKaIIngog2VR5UfEmPhcK1i/2XbBzL5KZbuG8M0qLsYWnodWqq7x28XLsee0RazE0Z2OQAaG9/VCk7gi4VOA==", + "requires": { + "ebnf-parser": "0.1.x", + "escodegen": "0.0.21", + "esprima": "1.0.x", + "jison-lex": "0.2.x", + "JSONSelect": "0.4.0", + "lex-parser": "0.1.x", + "nomnom": "1.5.2" + }, + "dependencies": { + "escodegen": { + "version": "0.0.21", + "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-0.0.21.tgz", + "integrity": "sha512-BQL5g+BqyrM5HRAKt4Q4YuH9CqiEcIHWSJ8fg2PRNkGkXn/LgzeDCZzDDSX4UiljSAHgXaHgOZREQ2xOigbLzA==", + "requires": { + "esprima": "~1.0.2", + "estraverse": "~0.0.4", + "source-map": ">= 0.1.2" + } + }, + "esprima": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/esprima/-/esprima-1.0.4.tgz", + "integrity": "sha512-rp5dMKN8zEs9dfi9g0X1ClLmV//WRyk/R15mppFNICIFRG5P92VP7Z04p8pk++gABo9W2tY+kHyu6P1mEHgmTA==" + }, + "estraverse": { + "version": "0.0.4", + "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-0.0.4.tgz", + "integrity": "sha512-21DfBCsFJGb3HZr0vEBH1Wk1tGSbbzA8I/xtSSoy/pRtupHv0OgBmObcNGXM3ec6/pOXTOOUYY9/5bfluzz0sw==" + } + } + }, + "jison-lex": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/jison-lex/-/jison-lex-0.2.1.tgz", + "integrity": "sha512-WCNVPRxaTWdhwJAIrBsgkGT9n6H1yNR9Lfof5LUHaMul24ySrJ1SXbVPszZfs57jwXvASLWBpd0xpFEW2oIuVA==", + "requires": { + "lex-parser": "0.1.x", + "nomnom": "1.5.2" + } + }, "js-base64": { "version": "2.6.4", "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz", @@ -27153,6 +27492,11 @@ "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-5.0.1.tgz", "integrity": "sha512-p/nXbhSEcu3pZRdkW1OfJhpsVtW1gd4Wa1fnQc9YLiTfAjn0312eMKimbdIQzuZl9aa9xUGaRlP9T/CJE/ditQ==" }, + "JSONSelect": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/JSONSelect/-/JSONSelect-0.4.0.tgz", + "integrity": "sha512-VRLR3Su35MH+XV2lrvh9O7qWoug/TUyj9tLDjn9rtpUCNnILLrHjgd/tB0KrhugCxUpj3UqoLqfYb3fLJdIQQQ==" + }, "jsx-ast-utils": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.3.tgz", @@ -27204,6 +27548,16 @@ "type-check": "~0.4.0" } }, + "lex": { + "version": "1.7.4", + "resolved": "https://registry.npmjs.org/lex/-/lex-1.7.4.tgz", + "integrity": "sha512-9B1SLZjx8ZjYJx8AmlbVjeqYDllU7PCWwE/VYgq4DJ5gePjbzgdms+MC7tsj1tdyRp7O6BfXTTDHJnPiiPV0Pw==" + }, + "lex-parser": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/lex-parser/-/lex-parser-0.1.4.tgz", + "integrity": "sha512-DuAEISsr1H4LOpmFLkyMc8YStiRWZCO8hMsoXAXSbgyfvs2WQhSt0+/FBv3ZU/JBFZMGcE+FWzEBSzwUU7U27w==" + }, "lilconfig": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.0.6.tgz", @@ -27973,6 +28327,15 @@ } } }, + "nomnom": { + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.5.2.tgz", + "integrity": "sha512-fiVbT7BqxiQqjlR9U3FDGOSERFCKoXVCdxV2FwZuNN7/cmJ42iQx35nUFOAFDcyvemu9Adp+IlsCGlKQYLmBKw==", + "requires": { + "colors": "0.5.x", + "underscore": "1.1.x" + } + }, "nopt": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz", @@ -29414,6 +29777,23 @@ "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==", "dev": true }, + "react-hook-form": { + "version": "7.42.1", + "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.42.1.tgz", + "integrity": "sha512-2UIGqwMZksd5HS55crTT1ATLTr0rAI4jS7yVuqTaoRVDhY2Qc4IyjskCmpnmdYqUNOYFy04vW253tb2JRVh+IQ==", + "peer": true, + "requires": {} + }, + "react-input-mask": { + "version": "3.0.0-alpha.2", + "resolved": "https://registry.npmjs.org/react-input-mask/-/react-input-mask-3.0.0-alpha.2.tgz", + "integrity": "sha512-9U7qL+mvDMOJcbOFPdt6Vj+zzmCMNnBjhhjGDrL8BGQmymgvMVKhu/oOVfAkl+5VWOsLr+G3EhZOmae5fBcAkA==", + "requires": { + "invariant": "^2.2.4", + "prop-types": "^15.7.2", + "warning": "^4.0.3" + } + }, "react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -29673,6 +30053,17 @@ "@babel/runtime": "^7.8.4" } }, + "regex": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/regex/-/regex-0.1.1.tgz", + "integrity": "sha512-aZ/uNt2gUw9aD0K18LFAHdOUKsHL2fSny9YLqcxDfLmZOTK8mZxueHsAikh3UjPGZlmr4J3sdCNMPTp1wPR5hA==", + "requires": { + "augment": "3.2.1", + "jison": "0.4.4", + "lex": "1.7.4", + "statemachines": "0.1.0" + } + }, "regex-parser": { "version": "2.2.11", "resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.2.11.tgz", @@ -30286,6 +30677,11 @@ "socks": "^2.6.2" } }, + "sorted-array": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/sorted-array/-/sorted-array-1.1.0.tgz", + "integrity": "sha512-jZgZDuFkeb3MJ9dE88/vlK7IB4C1Fip5oyCgabmxk8885dQP+zfZAq88RWzD+4KUskhHETVmDkMtERzRclI6fg==" + }, "source-list-map": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", @@ -30428,6 +30824,15 @@ "resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.3.4.tgz", "integrity": "sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw==" }, + "statemachines": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/statemachines/-/statemachines-0.1.0.tgz", + "integrity": "sha512-RYZMSj20+WOobiIiBkCPUlZlJlnzPwzJ5DR6KA91RmxTBbe7EDB+ISNd2jU7QcI08BubqgL3bHFRhiL/KR3lYQ==", + "requires": { + "augment": "3.2.1", + "sorted-array": "1.1.0" + } + }, "statuses": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz", @@ -31068,6 +31473,11 @@ "which-boxed-primitive": "^1.0.2" } }, + "underscore": { + "version": "1.1.7", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.1.7.tgz", + "integrity": "sha512-w4QtCHoLBXw1mjofIDoMyexaEdWGMedWNDhlWTtT1V1lCRqi65Pnoygkh6+WRdr+Bm8ldkBNkNeCsXGMlQS9HQ==" + }, "unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", diff --git a/package.json b/package.json index eff619f..95eb046 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "0.1.0", "private": true, "dependencies": { + "@hookform/resolvers": "^2.9.10", "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", @@ -10,10 +11,13 @@ "@types/node": "^16.18.11", "@types/react": "^18.0.26", "@types/react-dom": "^18.0.10", + "@types/react-maskedinput": "^4.0.6", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-input-mask": "^3.0.0-alpha.2", "react-modal": "^3.16.1", "react-scripts": "5.0.1", + "regex": "^0.1.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4" }, @@ -42,7 +46,9 @@ ] }, "devDependencies": { + "@types/react-input-mask": "^3.0.2", "@types/react-modal": "^3.13.1", + "@types/react-text-mask": "^5.4.11", "formik": "^2.2.9", "node-sass": "^8.0.0", "react-text-mask": "^5.5.0", diff --git a/src/assets/img/Ellipse 2.png b/src/assets/img/Ellipse 2.png new file mode 100644 index 0000000000000000000000000000000000000000..846ba2d626fe07ce3012d5f675abd72b70ae3dfc GIT binary patch literal 633 zcmV-<0*3vGP)t1cpoE3v!r9<9C?+I5@``tC;FrT#7m9qjI;=H{FOA}Cx)S7nl&cFhxMhBr`wACojAh0ym_t{anuq**&okr#9$un>>*2GaBa#pwwh*Gdit)rPCJ*>rHdbtU-n@A4LPI`Vuh(5wwIlHbC(-K1 TFjg1200000NkvXXu0mjf6nhRp literal 0 HcmV?d00001 diff --git a/src/assets/img/arrow-up.png b/src/assets/img/arrow-up.png new file mode 100644 index 0000000000000000000000000000000000000000..a9142b169599bf8910db8c7eea79e6aad5dfb778 GIT binary patch literal 198 zcmeAS@N?(olHy`uVBq!ia0vp@K+Mj;1|%;R9G3!8oCO|{#S9GG!XV7ZFl&wkP>``W z$lZxy-8q?;Kn_c~qpu?a!^VE@KZ&eBezd2HV@L&K@A*c~0}4DW2jmY5-dVDGr{iwN z-Jb3REbc$qemQYy*|9wQ+QQI0LFZ5K24VIctg;zq?dL3c6jq-O&NwRExcl>mH&2%? pauZ0nx?B3!)2*Hn?`N~zX5aOE34hQhkzAlP44$rjF6*2UngHRHKzjfH literal 0 HcmV?d00001 diff --git a/src/assets/img/whatsapp.png b/src/assets/img/whatsapp.png new file mode 100644 index 0000000000000000000000000000000000000000..567e0bea8fe7c188df7b6e18505027ca90e21a94 GIT binary patch literal 1042 zcmV+t1nv8YP)&Y6K^kcMd9#7xkE32M;1oYjSp(=Dh}h*i*KwC>6Z^{TE)?XtghWj`02Y2Zyd z!3*g^1r3%^8&X6jI6=K=y7j(iJ7Z@%JKNDSA2^(y_j~t!&w2kh0XpFDI!dD=T(Kw` zqd=nwm}5XGuL(eyWFfkTL=iqQifNzI7s_{UAs?l7ufs;SKDuns2OoAYG=9nF&!wnI zge+j*0bcKcK>8sb6EL7F{ug375#L3L{~A4 zLor#Vt@g4-SbiVyBNvebi9Qqx0&Hqz6fwf?ATvJ20f5fA^U3KO%pk&n$uS|PV=77x zm7wx)1vVpFSlwQQK?oNCO>zJi$x~u}Gg1h-vk_5wAWrcyTwSSOmRGbL;=eC-by`~)%L?#vIPn=Z{+c%2hi6L@q zkTo1?Iwy}-XULdD2N5(7HXF4LaaW^YRi;@(MvJlT!4bg4uIbFCz*(Y(9~(g!34t3Z zxy77KVfOcz4A~z_-xrIoU?ikYE@%*$T$#*}Jzso@tt^(>E0}|*Ry$?i~($_1{Y0A$!TVJ!uA!{FRAh3sa-4Vq%B;!KV=>2KXhR;DTb-BQHnrk1G1)rY%3bwW z6_zV2E|b=o)aR8ciBvl1{Ko=M=F|n(p#$CI%^otnUfiS3y`<8)>HKPu<^c{?KXhOu z@RkC2Sodra+z6?OeG@d3$mu%(onSNf&OD_1WM2AQkJJjG5EG;+EjgjlOfrQ%PV5{v z)~Yj7v8zyNluSacEl{?2Xk5ImAks$Tz@aRoq8?OJAUBlPOWDL0V9RA`31NzjrisL; zm_9rQwVI&8aF08EL-Iqi#3#l@GY$s*sU#Fc$TTh-446bla-=pr8wv|96K*vUNg^t4 z3Dff+rIv#u8~cZ!12f$nsgQoxuv-%UZFuN#|JX(Ebc)WX{iD-^-IzPukgY|4_UljE zPZd(u@D%NjS6EGOiqju3Hj{|Xga!GM)1AN1FS9^v3!A{3eD;*_AMT`6H+$W~qyPW_ M07*qoM6N<$g4V0fwg3PC literal 0 HcmV?d00001 diff --git a/src/components/whats/Scroll.tsx b/src/components/whats/Scroll.tsx new file mode 100644 index 0000000..1a475ff --- /dev/null +++ b/src/components/whats/Scroll.tsx @@ -0,0 +1,22 @@ +import { useState } from "react" +import ArrowUp from '../../assets/img/arrow-up.png'; +import styles from '../../styles/Scroll.module.scss' + +export default function ScrollPage() { + + const [pageYPosition, setPageYPosition] = useState(0); + + function getPageYAfterScroll() { + setPageYPosition(window.scrollY); + } + + window.addEventListener('scroll', getPageYAfterScroll); + + return ( +
+ Abrir +
+ ) +} + + diff --git a/src/components/whats/Whats.tsx b/src/components/whats/Whats.tsx new file mode 100644 index 0000000..30390d9 --- /dev/null +++ b/src/components/whats/Whats.tsx @@ -0,0 +1,21 @@ +import styles from '../../styles/Whats.module.scss' +import Whatsapp from '../../assets/img/whatsapp.png' +import ScrollPage from './Scroll' + + + + + +const Whats = () => { + return ( +
+
+ WhatsApp +
+ +
+ ) +} + +export default Whats + diff --git a/src/index.tsx b/src/index.tsx index 608f505..b0717a0 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -6,6 +6,7 @@ import Header from './components/header/Header'; import Footer from './components/footer/Footer'; import Main from './components/main/Main'; import Menu from './components/header/Menu'; +import Whats from './components/whats/Whats'; const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement @@ -18,6 +19,7 @@ function App() {
setOpenModal(true)}/> setOpenModal(false)}/>
+
); diff --git a/src/pages/contato/Contato.tsx b/src/pages/contato/Contato.tsx index fc0f338..917a813 100644 --- a/src/pages/contato/Contato.tsx +++ b/src/pages/contato/Contato.tsx @@ -1,9 +1,11 @@ import React from "react"; -import {Formik, Form, Field, ErrorMessage, FormikHelpers} from "formik" -// import MaskedInput from 'react-text-mask' +import { Formik, Form, Field, ErrorMessage, FormikHelpers } from "formik"; +import MaskedInput from "react-text-mask"; + import Schema from "../../schema/schema"; +import { numberCpf, numberNascimento, numberPhone } from "../../utils/validates"; import styles from "../../styles/Contato.module.scss"; @@ -16,6 +18,8 @@ interface IFormikValues { instagram: string; } + + const initialValues = { name: "", email: "", @@ -32,55 +36,102 @@ const onSubmit = (values: IFormikValues, actions: FormikHelpers) } + function Contato() { + return ( -
+

PREENCHA O FORMULÁRIO

- {({ errors, touched}) => ( + {({ errors, touched, handleChange, handleBlur }) => (
- + + name="name" + className={styles["form__invalid"]} />
- + + name="email" + className={styles["form__invalid"]} />
- + ( + + )} + /> + name="cpf" + className={styles["form__invalid"]} />
+
- + ( + + )} + /> + name="data" + className={styles["form__invalid"]} />
- + + ( + + )} + /> + name="tel" + className={styles["form__invalid"]} />
- + + name="insta" + className={styles["form__invalid"]} />
@@ -91,8 +142,8 @@ function Contato() { - )} + )}
diff --git a/src/pages/institucional/Institucional.tsx b/src/pages/institucional/Institucional.tsx index 5b924e2..25d999d 100644 --- a/src/pages/institucional/Institucional.tsx +++ b/src/pages/institucional/Institucional.tsx @@ -9,6 +9,7 @@ import Devolucao from "../devolução/Devolucao"; import Seguranca from "../segurança/Seguranca"; import Contato from "../contato/Contato"; + function Institucional() { const [step, setStep] = useState(""); @@ -32,8 +33,9 @@ function Institucional() { } return ( -
-

institucional

+
+

institucional

+
  • setStep("sobre")}>Sobre
  • setStep("pagamento")}>Forma de Pagamento
    • @@ -42,13 +44,13 @@ function Institucional() {
  • setStep("seguranca")}>Segurança e Privacidade
  • setStep("contato")}>Contato
-
-

institucional

-
{render()}
+
+ {render()}
+
); } diff --git a/src/schema/schema.tsx b/src/schema/schema.tsx index 10ced79..05831a1 100644 --- a/src/schema/schema.tsx +++ b/src/schema/schema.tsx @@ -1,10 +1,17 @@ import * as Yup from "yup"; + export default Yup.object().shape({ name: Yup.string().min(3).required("Campo obrigatório"), + email: Yup.string().required("Campo obrigatório").email("Email inválido"), - cpf: Yup.string().required("Campo obrigatório"), - data: Yup.string().required("Campo obrigatório"), - tel: Yup.string().required("Campo obrigatório"), + + cpf: Yup.string().matches(/^\d{3}\.\d{3}\.\d{3}\-\d{2}$/, "CPF inválido").required("Campo obrigatório"), + + data: Yup.string().matches(/\d{2,}\/\d{2,}\/\d{4,}/, "Data de nascimento inválida").required("Campo obrigatório"), + + tel: Yup.string().matches(/\(\d{2}\)\d{5}\-\d{4}/, "Número de telefone inválido").required("Campo obrigatório"), + insta: Yup.string(), + }); diff --git a/src/styles/Contato.module.scss b/src/styles/Contato.module.scss index f723f09..1cd7bba 100644 --- a/src/styles/Contato.module.scss +++ b/src/styles/Contato.module.scss @@ -1,3 +1,11 @@ +.contato__container { + padding: 0px 30px; +} + +.contato__container form { + width: 100%; +} + .contato__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -9,8 +17,10 @@ } -form { - max-width: 391px; +.form__formik { + display: flex; + flex-direction: column; + width: 58.44%; margin-top: 33px; } @@ -24,7 +34,7 @@ input::placeholder { } .form__container { - position: relative; + width: 100%; } @@ -41,20 +51,17 @@ input::placeholder { } .form__container input { + width: 96%; font-family: 'Roboto', sans-serif; - font-weight: 400; - font-size: 14px; - line-height: 23px; color: #B9B7B7; background: #FFFFFF; border: 1px solid #100D0E; border-radius: 25px; - padding: 11px 227px 10px 28px; + padding: 15px 2px 15px 20px; } .form__check { display: flex; - align-items: center; justify-content: center; gap: 8px; padding: 21px 0 21px; @@ -67,8 +74,8 @@ input::placeholder { } .form__button { - width: 391.49px; - height: 52.47px; + width: 100%; + height: 52.44px; left: 500px; top: 979px; background: #000000; @@ -105,3 +112,8 @@ button:active { } +@media (max-width: 1024px) { + .contato__title { + text-align: center; + } +} diff --git a/src/styles/Devolucao.module.scss b/src/styles/Devolucao.module.scss index 4e76957..12f2806 100644 --- a/src/styles/Devolucao.module.scss +++ b/src/styles/Devolucao.module.scss @@ -1,3 +1,7 @@ +.devolucao__container { + padding: 0px 30px; +} + .devolucao__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -16,7 +20,12 @@ line-height: 15px; color: #7D7D7D; text-align: left; - max-width: 715px; padding-bottom: 171px; } +@media (max-width: 1024px) { + .devolucao__title { + text-align: center; + } +} + diff --git a/src/styles/Entrega.module.scss b/src/styles/Entrega.module.scss index a1b9020..bb47e09 100644 --- a/src/styles/Entrega.module.scss +++ b/src/styles/Entrega.module.scss @@ -1,3 +1,7 @@ +.entrega__container { + padding: 0px 30px; +} + .entrega__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -16,7 +20,12 @@ line-height: 15px; color: #7D7D7D; text-align: left; - max-width: 715px; padding-bottom: 171px; } +@media (max-width: 1024px) { + .entrega__title { + text-align: center; + } +} + diff --git a/src/styles/Institucional.module.scss b/src/styles/Institucional.module.scss index 22bcf9e..5537569 100644 --- a/src/styles/Institucional.module.scss +++ b/src/styles/Institucional.module.scss @@ -2,34 +2,31 @@ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap'); -.main__container { +.inst__container { display: flex; - justify-content: center; - max-width: 80%; + padding-left: 100px; } -.main__container ul { - border-right: 1px solid #E5E5E5; - margin: 150px 32px 78px 118px; +.inst__container ul { + padding: 0; + border-right: 1px solid #000000; + width: 23.59%; + height: 285px; list-style: none; - max-height: 270px; - max-width: 270px; } -.main__container li { +.inst__container li { + padding: 10px; font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 16px; line-height: 19px; color: #7D7D7D; text-align: left; - margin-bottom: 24px; - margin-right: 78px; - height: 39px; - + } -.main__container li:hover { +.inst__container li:hover { background-color: #000000; cursor: pointer; font-family: 'Roboto', sans-serif; @@ -40,7 +37,8 @@ padding: 10px 16px; } -.title__desktop { +.title { + display: flex; font-weight: 300; font-size: 24px; line-height: 29px; @@ -48,67 +46,32 @@ text-transform: uppercase; color: #292929; margin-bottom: 51px; - margin-top: 80px; + justify-content: center; } -@media screen and (max-width: 1080px) { - .main__container { - max-width: 80%; - } +.rend__container { + width: 55.44%; } -@media screen and (max-width: 768px) { - .main__container { - flex-direction: column; - align-items: center; - max-width: 343px; - margin: 0 auto; +@media (max-width: 1024px) { + .inst__container { + align-items: center; + padding-left: 16px; + flex-direction: column; } - .main__container ul { - margin: 33px 25px 22px 7px; - display: flex; - flex-direction: column; - align-items: flex-end; - } + .rend__container { + width: 100%; + } + .inst__container ul { + width: 100%; + margin: 33px 25px 22px 7px; + display: flex; + flex-direction: column; + border-right: none; + } - .main__contato-subtitle { - margin-top: 22px; - } - - .title__desktop { - display: none; - } - - .title__mobile { - - font-style: normal; - font-weight: 300; - font-size: 24px; - line-height: 29px; - letter-spacing: 0.1em; - text-transform: uppercase; - color: #292929; - margin: 75px 92px 33px 83px; - - } -} - -@media screen and (min-width: 769px) { - .title__mobile { - display: none - } -} - -@media screen and (max-width: 475px) { - .main__container ul { - align-items: center; - } -} - -@media screen and (max-width: 375px) { - .main__container ul { - max-width: 70%; - margin: 0 auto; - } + .inst__contato-subtitle { + margin-top: 22px; + } } diff --git a/src/styles/Main.module.scss b/src/styles/Main.module.scss index d9d9aec..40668ea 100644 --- a/src/styles/Main.module.scss +++ b/src/styles/Main.module.scss @@ -1,7 +1,7 @@ .main__route { display: flex; padding: 29px 100px; - width: 8%; + width: 10%; justify-content: space-around; align-items: center; @@ -10,10 +10,6 @@ height: 16px; } - .main__arrow { - width: 4.47%; - height: 8px; - } p { font-family: 'Roboto', sans-serif; @@ -24,3 +20,10 @@ color: #C4C4C4; } } + +@media (max-width: 1024px) { + + .main__route{ + padding: 29px 16px; + } +} diff --git a/src/styles/Pagamento.module.scss b/src/styles/Pagamento.module.scss index c070043..7d3a394 100644 --- a/src/styles/Pagamento.module.scss +++ b/src/styles/Pagamento.module.scss @@ -1,3 +1,8 @@ +.pagamento__container { + + padding: 0px 30px; +} + .pagamento__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -16,7 +21,12 @@ line-height: 15px; color: #7D7D7D; text-align: left; - max-width: 715px; padding-bottom: 171px; } +@media (max-width: 1024px) { + .pagamento__title { + text-align: center; + } +} + diff --git a/src/styles/Scroll.module.scss b/src/styles/Scroll.module.scss new file mode 100644 index 0000000..597d38e --- /dev/null +++ b/src/styles/Scroll.module.scss @@ -0,0 +1,16 @@ + +.arrow__up{ + background-color: #C4C4C4; + border-radius: 100%; + width: 34px; + height: 34px; + display: flex; + align-items: center; + justify-content: center; +} + +.arrow__up img{ + width: 7px; + display: flex; +} + diff --git a/src/styles/Seguranca.module.scss b/src/styles/Seguranca.module.scss index c81cf1b..dc6c563 100644 --- a/src/styles/Seguranca.module.scss +++ b/src/styles/Seguranca.module.scss @@ -1,3 +1,8 @@ +.seguranca__container { + + padding: 0px 30px; +} + .seguranca__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -16,8 +21,12 @@ line-height: 15px; color: #7D7D7D; text-align: left; - max-width: 715px; padding-bottom: 171px; } +@media (max-width: 1024px) { + .seguranca__title { + text-align: center; + } +} diff --git a/src/styles/Sobre.module.scss b/src/styles/Sobre.module.scss index aa461e1..bccc815 100644 --- a/src/styles/Sobre.module.scss +++ b/src/styles/Sobre.module.scss @@ -1,3 +1,8 @@ +.sobre__container { + + padding: 0px 30px; +} + .sobre__title { font-family: 'Roboto', sans-serif; font-style: normal; @@ -16,8 +21,12 @@ line-height: 15px; color: #7D7D7D; text-align: left; - max-width: 715px; padding-bottom: 171px; } +@media (max-width: 1024px) { + .sobre__title { + text-align: center; + } +} diff --git a/src/styles/Whats.module.scss b/src/styles/Whats.module.scss new file mode 100644 index 0000000..523b848 --- /dev/null +++ b/src/styles/Whats.module.scss @@ -0,0 +1,17 @@ +.container__icon { + display: flex; + flex-direction: column; + align-items: center; + position: fixed; + right: 0; + bottom:0; + padding: 16px; + z-index: 1; +} + + + +.icon__whats img { + width: 34px; +} + diff --git a/src/utils/validates.tsx b/src/utils/validates.tsx new file mode 100644 index 0000000..b746cde --- /dev/null +++ b/src/utils/validates.tsx @@ -0,0 +1,46 @@ +export const numberPhone = [ + "(", + /\d/, + /\d/, + ")", + /\d/, + /\d/, + /\d/, + /\d/, + /\d/, + "-", + /\d/, + /\d/, + /\d/, + /\d/ + ]; + +export const numberCpf = [ + /\d/, + /\d/, + /\d/, + ".", + /\d/, + /\d/, + /\d/, + ".", + /\d/, + /\d/, + /\d/, + "-", + /\d/, + /\d/, + ]; + +export const numberNascimento = [ + /\d/, + /\d/, + "/", + /\d/, + /\d/, + "/", + /\d/, + /\d/, + /\d/, + /\d/ + ]; -- 2.34.1 From 2ae2dd2697ce307e34e9af12f8e624d9c6cf4091 Mon Sep 17 00:00:00 2001 From: Ramon Dias Ferreira Date: Fri, 20 Jan 2023 01:43:26 -0300 Subject: [PATCH 3/3] fix: ajustes de padding --- src/styles/Contato.module.scss | 4 ++++ src/styles/Institucional.module.scss | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/styles/Contato.module.scss b/src/styles/Contato.module.scss index 1cd7bba..e232dda 100644 --- a/src/styles/Contato.module.scss +++ b/src/styles/Contato.module.scss @@ -116,4 +116,8 @@ button:active { .contato__title { text-align: center; } + + .contato__container{ + padding: 0; + } } diff --git a/src/styles/Institucional.module.scss b/src/styles/Institucional.module.scss index 5537569..8094622 100644 --- a/src/styles/Institucional.module.scss +++ b/src/styles/Institucional.module.scss @@ -56,7 +56,7 @@ @media (max-width: 1024px) { .inst__container { align-items: center; - padding-left: 16px; + padding: 16px; flex-direction: column; } -- 2.34.1