From f9d2ce3925d50616472e0cfde844a3658b9d6935 Mon Sep 17 00:00:00 2001 From: ThiagoDuutra Date: Fri, 30 Dec 2022 11:13:06 -0300 Subject: [PATCH] feat: Criado Header --- react-academy/package-lock.json | 65 +++++++++++- react-academy/package.json | 3 +- react-academy/public/favicon.ico | Bin 3870 -> 0 bytes react-academy/public/logo192.png | Bin 5347 -> 0 bytes react-academy/public/logo512.png | Bin 9664 -> 0 bytes react-academy/public/manifest.json | 25 ----- react-academy/public/robots.txt | 3 - .../Components/Header/HeaderDesktop/index.tsx | 44 ++++++++ .../Components/Header/HeaderDesktop/style.css | 0 .../Components/Header/HeaderTablets/index.tsx | 96 +++++++++++++++++ .../Components/Header/HeaderTablets/style.css | 98 +++++++++++++++++ .../Header/ImagesHeader/Logo-M3-Desktop.png | Bin 0 -> 2985 bytes .../Header/ImagesHeader/Logo-M3.png | Bin 0 -> 6366 bytes .../Components/Header/ImagesHeader/cart.png | Bin 0 -> 732 bytes .../Header/ImagesHeader/close-menu.png | Bin 0 -> 268 bytes .../Components/Header/ImagesHeader/menu.png | Bin 0 -> 217 bytes .../Components/Header/ImagesHeader/search.png | Bin 0 -> 943 bytes react-academy/src/Components/Header/index.tsx | 22 ++++ react-academy/src/Components/Header/style.css | 99 ++++++++++++++++++ react-academy/src/Pages/Home.tsx | 11 -- react-academy/src/global.css | 16 ++- react-academy/src/index.tsx | 8 +- react-academy/src/router.tsx | 14 +++ 23 files changed, 457 insertions(+), 47 deletions(-) delete mode 100644 react-academy/public/favicon.ico delete mode 100644 react-academy/public/logo192.png delete mode 100644 react-academy/public/logo512.png delete mode 100644 react-academy/public/manifest.json delete mode 100644 react-academy/public/robots.txt create mode 100644 react-academy/src/Components/Header/HeaderDesktop/index.tsx create mode 100644 react-academy/src/Components/Header/HeaderDesktop/style.css create mode 100644 react-academy/src/Components/Header/HeaderTablets/index.tsx create mode 100644 react-academy/src/Components/Header/HeaderTablets/style.css create mode 100644 react-academy/src/Components/Header/ImagesHeader/Logo-M3-Desktop.png create mode 100644 react-academy/src/Components/Header/ImagesHeader/Logo-M3.png create mode 100644 react-academy/src/Components/Header/ImagesHeader/cart.png create mode 100644 react-academy/src/Components/Header/ImagesHeader/close-menu.png create mode 100644 react-academy/src/Components/Header/ImagesHeader/menu.png create mode 100644 react-academy/src/Components/Header/ImagesHeader/search.png create mode 100644 react-academy/src/Components/Header/index.tsx create mode 100644 react-academy/src/Components/Header/style.css delete mode 100644 react-academy/src/Pages/Home.tsx create mode 100644 react-academy/src/router.tsx diff --git a/react-academy/package-lock.json b/react-academy/package-lock.json index 29db58c..36ea42a 100644 --- a/react-academy/package-lock.json +++ b/react-academy/package-lock.json @@ -1,12 +1,12 @@ { "name": "react-academy", - "version": "0.1.0", + "version": "0.0.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "react-academy", - "version": "0.1.0", + "version": "0.0.0", "dependencies": { "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", @@ -17,6 +17,7 @@ "@types/react-dom": "^18.0.10", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-router-dom": "^6.6.1", "react-scripts": "5.0.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4" @@ -3074,6 +3075,14 @@ } } }, + "node_modules/@remix-run/router": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.2.1.tgz", + "integrity": "sha512-XiY0IsyHR+DXYS5vBxpoBe/8veTeoRpMHP+vDosLZxL5bnpetzI0igkxkLZS235ldLzyfkxF+2divEwWHP3vMQ==", + "engines": { + "node": ">=14" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -13941,6 +13950,36 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "6.6.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.6.1.tgz", + "integrity": "sha512-YkvlYRusnI/IN0kDtosUCgxqHeulN5je+ew8W+iA1VvFhf86kA+JEI/X/8NqYcr11hCDDp906S+SGMpBheNeYQ==", + "dependencies": { + "@remix-run/router": "1.2.1" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.6.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.6.1.tgz", + "integrity": "sha512-u+8BKUtelStKbZD5UcY0NY90WOzktrkJJhyhNg7L0APn9t1qJNLowzrM9CHdpB6+rcPt6qQrlkIXsTvhuXP68g==", + "dependencies": { + "@remix-run/router": "1.2.1", + "react-router": "6.6.1" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/react-scripts": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz", @@ -18833,6 +18872,11 @@ "source-map": "^0.7.3" } }, + "@remix-run/router": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.2.1.tgz", + "integrity": "sha512-XiY0IsyHR+DXYS5vBxpoBe/8veTeoRpMHP+vDosLZxL5bnpetzI0igkxkLZS235ldLzyfkxF+2divEwWHP3vMQ==" + }, "@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -26573,6 +26617,23 @@ "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==" }, + "react-router": { + "version": "6.6.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.6.1.tgz", + "integrity": "sha512-YkvlYRusnI/IN0kDtosUCgxqHeulN5je+ew8W+iA1VvFhf86kA+JEI/X/8NqYcr11hCDDp906S+SGMpBheNeYQ==", + "requires": { + "@remix-run/router": "1.2.1" + } + }, + "react-router-dom": { + "version": "6.6.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.6.1.tgz", + "integrity": "sha512-u+8BKUtelStKbZD5UcY0NY90WOzktrkJJhyhNg7L0APn9t1qJNLowzrM9CHdpB6+rcPt6qQrlkIXsTvhuXP68g==", + "requires": { + "@remix-run/router": "1.2.1", + "react-router": "6.6.1" + } + }, "react-scripts": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz", diff --git a/react-academy/package.json b/react-academy/package.json index 7d14672..36e7ed2 100644 --- a/react-academy/package.json +++ b/react-academy/package.json @@ -1,6 +1,6 @@ { "name": "react-academy", - "version": "0.1.0", + "version": "0.0.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^5.16.5", @@ -12,6 +12,7 @@ "@types/react-dom": "^18.0.10", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-router-dom": "^6.6.1", "react-scripts": "5.0.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4" diff --git a/react-academy/public/favicon.ico b/react-academy/public/favicon.ico deleted file mode 100644 index a11777cc471a4344702741ab1c8a588998b1311a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3870 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 baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@ diff --git a/react-academy/public/logo192.png b/react-academy/public/logo192.png deleted file mode 100644 index fc44b0a3796c0e0a64c3d858ca038bd4570465d9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 5347 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 b{|{}U^kRn2wo}j7|0ATu<;8xA7zX}7|B6mN diff --git a/react-academy/public/manifest.json b/react-academy/public/manifest.json deleted file mode 100644 index 080d6c7..0000000 --- a/react-academy/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/react-academy/public/robots.txt b/react-academy/public/robots.txt deleted file mode 100644 index e9e57dc..0000000 --- a/react-academy/public/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/react-academy/src/Components/Header/HeaderDesktop/index.tsx b/react-academy/src/Components/Header/HeaderDesktop/index.tsx new file mode 100644 index 0000000..0a9ea66 --- /dev/null +++ b/react-academy/src/Components/Header/HeaderDesktop/index.tsx @@ -0,0 +1,44 @@ +import React from "react"; +import "./style.css"; +import logoM3Desktop from "../ImagesHeader/Logo-M3-Desktop.png" +import search from "../ImagesHeader/search.png" +import cart from "../ImagesHeader/cart.png" +import { NavLink } from "react-router-dom"; + +const HeaderDesktop = () =>{ + return ( + + ) +} +export default HeaderDesktop; \ No newline at end of file diff --git a/react-academy/src/Components/Header/HeaderDesktop/style.css b/react-academy/src/Components/Header/HeaderDesktop/style.css new file mode 100644 index 0000000..e69de29 diff --git a/react-academy/src/Components/Header/HeaderTablets/index.tsx b/react-academy/src/Components/Header/HeaderTablets/index.tsx new file mode 100644 index 0000000..dd47aec --- /dev/null +++ b/react-academy/src/Components/Header/HeaderTablets/index.tsx @@ -0,0 +1,96 @@ +import React, { useEffect, useState } from "react"; +import { Link } from "react-router-dom"; +import logoM3Desktop from "../ImagesHeader/Logo-M3-Desktop.png"; +import search from "../ImagesHeader/search.png"; +import cart from "../ImagesHeader/cart.png"; +import "./style.css"; +import menu from "../ImagesHeader/menu.png"; +import closeMenu from "../ImagesHeader/close-menu.png"; + +const HeaderTablets = () => { + const [Open, setOpen] = useState(false); + + useEffect(() => { + const body = document.querySelector("body") as HTMLElement; + body.classList.toggle("menu"); + }, [Open]); + + return ( +
+
+
+
+ + +
+
+
+ + ENTRAR + +
+ + CURSOS + + + SAIBA MAIS + + + INSITUCIONAIS + + + +
+
+ + Logo M3 Academy + + +
+ +
+
+ +
+ + +
+
+
+
+ ); +}; + +export default HeaderTablets; diff --git a/react-academy/src/Components/Header/HeaderTablets/style.css b/react-academy/src/Components/Header/HeaderTablets/style.css new file mode 100644 index 0000000..6a169f4 --- /dev/null +++ b/react-academy/src/Components/Header/HeaderTablets/style.css @@ -0,0 +1,98 @@ +@media screen and (max-width: 1024px) { + header .page-header { + flex-direction: initial; + justify-content: center; + } + + header .page-header__container { + flex-direction: column; + justify-content: initial; + padding: 0 16px; + width: 100%; + } + + header .page-header__menu { + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + } + + header .page-header__btnMenu { + border: none; + cursor: pointer; + background-color: transparent; + } + + header .page-header__iconCart { + border: none; + cursor: pointer; + background-color: transparent; + } + + header .page-header__input { + width: 100%; + margin-bottom: 25px; + } + + header .page-belowHeader__links { + display: flex; + line-height: 1; + display: flex; + flex-direction: column; + padding: 0; + } + + header .page-header-join { + padding-left: 16px; + } + + header .menu-tablet { + position: fixed; + background-color: var(--color-white); + transition: opacity 0.3s ease-in-out; + top: 0; + left: 0; + bottom: 0; + right: 0; + z-index: 2; + } + + header .actived { + opacity: 1; + pointer-events: all; + } + + header .disabled { + opacity: 0; + pointer-events: none; + } + + header .page-header__links { + background-color: var(--color-black); + margin: 0; + height: 78px; + position: relative; + } + + header .page-belowHeader-nav { + padding: 0 0 12px 16px; + color: var(--color-gray-200); + } + + header .nav-cursos { + margin-top: 31px; + } + + header .page-belowHeader__btnClose { + display: flex; + position: absolute; + align-self: self-end; + border: none; + cursor: pointer; + background-color: transparent; + color: var(--color-white); + top: 30px; + margin-right: 16px; + } +} diff --git a/react-academy/src/Components/Header/ImagesHeader/Logo-M3-Desktop.png b/react-academy/src/Components/Header/ImagesHeader/Logo-M3-Desktop.png new file mode 100644 index 0000000000000000000000000000000000000000..8bf574bbaaa8004814a3b5105f6c763986b1ea7e GIT binary patch literal 2985 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 O0000``W z$lZxy-8q?;Kn_c~qpu?a!^VE@KZ&eB{z6X|$B+ufxsw_N9SnFFjGF|lngnwWahR>( zz0ttilfa@ZaggKUE+wUxTmR`j_praTg@Ms!O^pM~bp4nqe-4mCk zHOb14TwSA|T@fsNn!7cK(Q{998mm>0a`%!0AG~>rR-RCEy|elMnvOrUQ;tMMSS+mZ zu@&X5lZ==rzU@}St`^<5CNIyI7hY_#JJWW;_=(WA2kSpseq~-A@q6bP0l+XkKJ=|fL literal 0 HcmV?d00001 diff --git a/react-academy/src/Components/Header/ImagesHeader/menu.png b/react-academy/src/Components/Header/ImagesHeader/menu.png new file mode 100644 index 0000000000000000000000000000000000000000..2b91465017ad0283f5b7ed3dbaa75926bc3fcc45 GIT binary patch literal 217 zcmeAS@N?(olHy`uVBq!ia0vp^GC(ZO!3HEHPU(jODb50q$YKTtZeb8+WSBKa0w~B> z9OUlAuz9ExGkCiC KxvXoH6D$oEk6gfI( zfEiI?h5_={5sYSiKAmijlQ$#lwCBBhxA*RD&mjwxN~O?s-Q~NxyD~oc3E1v9P7IsE zd-wMCHflDTpOsQE^#F%5h@i8#D28Oy7zpB32f2;I!$U<~KuahH0>4-+ezGN^fkNb} zAhkm|;YkCc5)2Oyf2Y4w(=B{NYh`wJ);~Qx{hG(okz~-&H%c@jfl)`O-$U^?$`|}U zd@oT-S8W|Q&i4NP{yOC)WFmvkw{LE4YDY&$yPX<>|5~EAKtrkuQX7$UMnIhH-FkP(kNy(ZJw7*!a82pCuU{ z(R#N_7k*W|B4IA`Hj?G*vUW%;Z`MrS$Vl*jl6~m`iN?%?@T_Uz% zD_qS=@Trf;+ny^Ug6}2j6L?FJQ-r+g7iAD?qz!yZQ~wZ3!}ay`vB`lo6bYMev!mKT za{?&S0o@{0C=}`%9c^W8U|C4c$1rW<^d-yBJ2^RNPEJl1K_cz!kB*KO@+Ma)GMvh6 zaXX@F_3Z4-xQbiL9#PtqQNl@ISzKJqJbOBj(dAV&n-idw!g7=*CMK@X&~s5APESvl zr>3TUW{r$7KR>_XdEOTkABn2?^73*uj^k!l8xJ}4`T6+|bUu#aQ}Le?h*oB1W&%v@ z1&FD1C2MVNZtf*~-(g9=fvKSBr!X=y(u4#Wl!3Nehc0u}K&3g6C2UgJwp#}xP{$NG zLgW&D>gm)uPqBnkP{~Bv%XlUq4GcY45uTzVx6+AT%J5J7{ zfDA~k)$dW{)b}F`I2o9ehm`Ruod$~++e4Y}Vd!`~Riz;2U1-B}MXKu3SDmJ;3H1tF zQXUNmw$nE-Lbjw_8Zh|Irn^Yq>vEtGx`!rGJGk+_`e%gFq)==iY8Col@duM2eRF^( Rhgbjr002ovPDHLkV1nCMpB4ZB literal 0 HcmV?d00001 diff --git a/react-academy/src/Components/Header/index.tsx b/react-academy/src/Components/Header/index.tsx new file mode 100644 index 0000000..3bd9068 --- /dev/null +++ b/react-academy/src/Components/Header/index.tsx @@ -0,0 +1,22 @@ +import React, {useEffect, useState} from "react" +import HeaderDesktop from "./HeaderDesktop"; +import HeaderTablets from "./HeaderTablets"; +import "./style.css" + +const Header = ()=>{ + const [width, setWidth] = useState(window.innerWidth); + + const handleWindow = ()=>{ + setWidth(window.innerWidth); + } + + useEffect(() => { + window.addEventListener("resize", handleWindow); + return () => { + window.removeEventListener("resize", handleWindow); + }; + }, []); + + return
{width <= 1024 ? : }
+} +export default Header; \ No newline at end of file diff --git a/react-academy/src/Components/Header/style.css b/react-academy/src/Components/Header/style.css new file mode 100644 index 0000000..05b3bd4 --- /dev/null +++ b/react-academy/src/Components/Header/style.css @@ -0,0 +1,99 @@ +.page-header { + display: flex; + flex-direction: column; + background-color: var(--color-black); +} + +.page-header__container { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 100px; + border-bottom: 1px solid var(--color-gray-200); +} + +.page-header__logo, +.page-header__imgLogo { + display: block; +} + +.page-header__input { + position: relative; + display: flex; + width: 264px; +} + +.page-header__inputSearch { + height: 16px; + width: 100%; + outline: 0; + background-color: var(--color-white); + border: 2px solid var(--color-white-100); + border-radius: 5px; + padding: 8px 10px 8px 16px; +} + +.page-header__iconSearch { + position: absolute; + border: none; + outline: 0; + background-color: transparent; + top: 50%; + transform: translateY(-50%); + right: 10px; + cursor: pointer; +} + +.page-header__imgSearch { + max-width: 18px; + max-height: 18px; +} + +.page-header__links { + display: flex; + margin: 22px 0; + align-items: center; +} + +.page-header-join { + font-family: "Roboto", sans-serif; + font-weight: 400; + font-size: 14px; + line-height: 16px; + color: var(--color-white); + text-decoration: none; + margin-right: 55px; +} + +.page-header-iconCart { + background-color: transparent; + border: none; + cursor: pointer; +} + +.page-header__cart { + width: 28px; + height: 28px; +} + +.page-belowHeader { + padding: 0 100px; +} + +.page-belowHeader__links { + padding: 14px 0; +} + +.page-belowHeader-nav { + font-family: "Roboto", sans-serif; + font-weight: 500px; + font-size: 14px; + line-height: 16px; + margin-right: 55px; + text-decoration: none; + color: var(--color-white); +} + +.page-belowHeader-nav:last-child { + margin-right: 0px; +} diff --git a/react-academy/src/Pages/Home.tsx b/react-academy/src/Pages/Home.tsx deleted file mode 100644 index 4c53153..0000000 --- a/react-academy/src/Pages/Home.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react'; - -function App() { - return ( -
- -
- ); -} - -export default App; diff --git a/react-academy/src/global.css b/react-academy/src/global.css index ec2585e..295cb10 100644 --- a/react-academy/src/global.css +++ b/react-academy/src/global.css @@ -1,13 +1,23 @@ body { margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", + "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', + font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace; } + +/*COLORS*/ +:root { + --color-black: #000; + + --color-white: #fff; + --color-white-100: #f0f0f0; + + --color-gray-200: #c4c4c4; +} diff --git a/react-academy/src/index.tsx b/react-academy/src/index.tsx index 90d44ea..0c472d5 100644 --- a/react-academy/src/index.tsx +++ b/react-academy/src/index.tsx @@ -1,14 +1,18 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; +import { BrowserRouter } from "react-router-dom"; import './global.css'; -import App from './Pages/Home'; + +import Router from "./router"; const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement ); root.render( - + + + ); diff --git a/react-academy/src/router.tsx b/react-academy/src/router.tsx new file mode 100644 index 0000000..f45edc5 --- /dev/null +++ b/react-academy/src/router.tsx @@ -0,0 +1,14 @@ +import ReactDOM from "react-dom/client"; +import { Routes, Route, Navigate } from "react-router-dom"; +import Header from "./Components/Header"; + +export default function Router(){ + return ( + <> +
+ + + + + ) +} \ No newline at end of file
+
+ +
+ + Logo M3 academy + +
+ + +
+
+ ENTRAR + +
+
+ +
+
+
+ CURSOS + SAIBA MAIS + INSTITUCIONAIS +
+
+
+
+