From 23079e230ad33f6dfbc25d503463781b7f5cc40c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Leonardo=20Mur=C3=A7a?= Date: Tue, 31 May 2022 21:43:42 -0300 Subject: [PATCH] Add Login screen UI --- package-lock.json | 751 +++++++++++++++++++++++++++++ package.json | 3 + public/index.html | 4 + src/UnauthenticatedApp.js | 14 +- src/assets/if-salas-logo.png | Bin 0 -> 8249 bytes src/assets/if-salas-logo.svg | 39 ++ src/components/LoadingIndicator.js | 21 + src/index.css | 4 +- src/index.js | 28 +- src/screens/Login.js | 100 ++++ 10 files changed, 949 insertions(+), 15 deletions(-) create mode 100644 src/assets/if-salas-logo.png create mode 100644 src/assets/if-salas-logo.svg create mode 100644 src/components/LoadingIndicator.js create mode 100644 src/screens/Login.js diff --git a/package-lock.json b/package-lock.json index 9c20216..ae3fae1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,9 @@ "name": "if-salas-web", "version": "0.1.0", "dependencies": { + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/material": "^5.8.2", "@testing-library/jest-dom": "^5.16.4", "@testing-library/react": "^13.2.0", "@testing-library/user-event": "^13.5.0", @@ -2156,6 +2159,174 @@ "postcss-selector-parser": "^6.0.10" } }, + "node_modules/@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "dependencies": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "peerDependencies": { + "@babel/core": "^7.0.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/babel-plugin-macros": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz", + "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==", + "dependencies": { + "@babel/runtime": "^7.7.2", + "cosmiconfig": "^6.0.0", + "resolve": "^1.12.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/cosmiconfig": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz", + "integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==", + "dependencies": { + "@types/parse-json": "^4.0.0", + "import-fresh": "^3.1.0", + "parse-json": "^5.0.0", + "path-type": "^4.0.0", + "yaml": "^1.7.2" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "dependencies": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, + "node_modules/@emotion/hash": { + "version": "0.8.0", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", + "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" + }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dependencies": { + "@emotion/memoize": "^0.7.4" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "node_modules/@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "dependencies": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "node_modules/@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "@emotion/react": "^11.0.0-rc.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "node_modules/@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "node_modules/@eslint/eslintrc": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.3.0.tgz", @@ -2587,6 +2758,212 @@ "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==" }, + "node_modules/@mui/base": { + "version": "5.0.0-alpha.83", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.83.tgz", + "integrity": "sha512-/bFcjiI36R2Epf2Y3BkZOIdxrz5uMLqOU4cRai4igJ8DHTRMZDeKbOff0SdvwJNwg8r6oPUyoeOpsWkaOOX9/g==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.8.1", + "react-is": "^17.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material": { + "version": "5.8.2", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.2.tgz", + "integrity": "sha512-w/A1KG9Czf42uTyJOiRU5U1VullOz1R3xcsBvv3BtKCCWdVP+D6v/Yb8v0tJpIixMEbjeWzWGjotQBU0nd+yNA==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.83", + "@mui/system": "^5.8.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.1.0", + "hoist-non-react-statics": "^3.3.2", + "prop-types": "^15.8.1", + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/private-theming": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.8.0.tgz", + "integrity": "sha512-MjRAneTmCKLR9u2S4jtjLUe6gpHxlbb4g2bqpDJ2PdwlvwsWIUzbc/gVB4dvccljXeWxr5G2M/Co2blXisvFIw==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.8.0", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/styled-engine": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.8.0.tgz", + "integrity": "sha512-Q3spibB8/EgeMYHc+/o3RRTnAYkSl7ROCLhXJ830W8HZ2/iDiyYp16UcxKPurkXvLhUaILyofPVrP3Su2uKsAw==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + } + } + }, + "node_modules/@mui/system": { + "version": "5.8.2", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.2.tgz", + "integrity": "sha512-N74gDNKM+MnWvKTMmCPvCVLH4f0ZzakP1bcMDaPctrHwcyxNcEmtTGNpIiVk0Iu7vtThZAFL3DjHpINPGF7+cg==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.8.0", + "@mui/styled-engine": "^5.8.0", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "clsx": "^1.1.1", + "csstype": "^3.1.0", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", + "peerDependencies": { + "@types/react": "*" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/utils": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.8.0.tgz", + "integrity": "sha512-7LgUtCvz78676iC0wpTH7HizMdCrTphhBmRWimIMFrp5Ph6JbDFVuKS1CwYnWWxRyYKL0QzXrDL0lptAU90EXg==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.5", + "@types/react-is": "^16.7.1 || ^17.0.0", + "prop-types": "^15.8.1", + "react-is": "^17.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "react": "^17.0.0 || ^18.0.0" + } + }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -2676,6 +3053,15 @@ "node": ">= 8" } }, + "node_modules/@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -3332,6 +3718,22 @@ "@types/react": "*" } }, + "node_modules/@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "dependencies": { + "@types/react": "*" + } + }, + "node_modules/@types/react-transition-group": { + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.4.tgz", + "integrity": "sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -4826,6 +5228,14 @@ "wrap-ansi": "^7.0.0" } }, + "node_modules/clsx": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz", + "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==", + "engines": { + "node": ">=6" + } + }, "node_modules/co": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz", @@ -5811,6 +6221,15 @@ "utila": "~0.4" } }, + "node_modules/dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "dependencies": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "node_modules/dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -7066,6 +7485,11 @@ "url": "https://github.com/avajs/find-cache-dir?sponsor=1" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -7592,6 +8016,19 @@ "he": "bin/he" } }, + "node_modules/hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "dependencies": { + "react-is": "^16.7.0" + } + }, + "node_modules/hoist-non-react-statics/node_modules/react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + }, "node_modules/hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -11885,6 +12322,21 @@ } } }, + "node_modules/react-transition-group": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz", + "integrity": "sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "peerDependencies": { + "react": ">=16.6.0", + "react-dom": ">=16.6.0" + } + }, "node_modules/readable-stream": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", @@ -12953,6 +13405,11 @@ "postcss": "^8.2.15" } }, + "node_modules/stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -16013,6 +16470,142 @@ "integrity": "sha512-RkYG5KiGNX0fJ5YoI0f4Wfq2Yo74D25Hru4fxTOioYdQvHBxcrrtTTyT5Ozzh2ejcNrhFy7IEts2WyEY7yi5yw==", "requires": {} }, + "@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "requires": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "dependencies": { + "babel-plugin-macros": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz", + "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==", + "requires": { + "@babel/runtime": "^7.7.2", + "cosmiconfig": "^6.0.0", + "resolve": "^1.12.0" + } + }, + "cosmiconfig": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz", + "integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==", + "requires": { + "@types/parse-json": "^4.0.0", + "import-fresh": "^3.1.0", + "parse-json": "^5.0.0", + "path-type": "^4.0.0", + "yaml": "^1.7.2" + } + }, + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=" + } + } + }, + "@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "requires": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, + "@emotion/hash": { + "version": "0.8.0", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", + "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" + }, + "@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "requires": { + "@emotion/memoize": "^0.7.4" + } + }, + "@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + } + }, + "@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "requires": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + } + }, + "@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + } + }, + "@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "@eslint/eslintrc": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.3.0.tgz", @@ -16349,6 +16942,93 @@ "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==" }, + "@mui/base": { + "version": "5.0.0-alpha.83", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.83.tgz", + "integrity": "sha512-/bFcjiI36R2Epf2Y3BkZOIdxrz5uMLqOU4cRai4igJ8DHTRMZDeKbOff0SdvwJNwg8r6oPUyoeOpsWkaOOX9/g==", + "requires": { + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.8.1", + "react-is": "^17.0.2" + } + }, + "@mui/material": { + "version": "5.8.2", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.2.tgz", + "integrity": "sha512-w/A1KG9Czf42uTyJOiRU5U1VullOz1R3xcsBvv3BtKCCWdVP+D6v/Yb8v0tJpIixMEbjeWzWGjotQBU0nd+yNA==", + "requires": { + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.83", + "@mui/system": "^5.8.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.1.0", + "hoist-non-react-statics": "^3.3.2", + "prop-types": "^15.8.1", + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + } + }, + "@mui/private-theming": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.8.0.tgz", + "integrity": "sha512-MjRAneTmCKLR9u2S4jtjLUe6gpHxlbb4g2bqpDJ2PdwlvwsWIUzbc/gVB4dvccljXeWxr5G2M/Co2blXisvFIw==", + "requires": { + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.8.0", + "prop-types": "^15.8.1" + } + }, + "@mui/styled-engine": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.8.0.tgz", + "integrity": "sha512-Q3spibB8/EgeMYHc+/o3RRTnAYkSl7ROCLhXJ830W8HZ2/iDiyYp16UcxKPurkXvLhUaILyofPVrP3Su2uKsAw==", + "requires": { + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.8.1" + } + }, + "@mui/system": { + "version": "5.8.2", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.2.tgz", + "integrity": "sha512-N74gDNKM+MnWvKTMmCPvCVLH4f0ZzakP1bcMDaPctrHwcyxNcEmtTGNpIiVk0Iu7vtThZAFL3DjHpINPGF7+cg==", + "requires": { + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.8.0", + "@mui/styled-engine": "^5.8.0", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.8.0", + "clsx": "^1.1.1", + "csstype": "^3.1.0", + "prop-types": "^15.8.1" + } + }, + "@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", + "requires": {} + }, + "@mui/utils": { + "version": "5.8.0", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.8.0.tgz", + "integrity": "sha512-7LgUtCvz78676iC0wpTH7HizMdCrTphhBmRWimIMFrp5Ph6JbDFVuKS1CwYnWWxRyYKL0QzXrDL0lptAU90EXg==", + "requires": { + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.5", + "@types/react-is": "^16.7.1 || ^17.0.0", + "prop-types": "^15.8.1", + "react-is": "^17.0.2" + } + }, "@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -16395,6 +17075,11 @@ } } }, + "@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==" + }, "@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -16898,6 +17583,22 @@ "@types/react": "*" } }, + "@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "requires": { + "@types/react": "*" + } + }, + "@types/react-transition-group": { + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.4.tgz", + "integrity": "sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==", + "requires": { + "@types/react": "*" + } + }, "@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -17999,6 +18700,11 @@ "wrap-ansi": "^7.0.0" } }, + "clsx": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz", + "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==" + }, "co": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz", @@ -18710,6 +19416,15 @@ "utila": "~0.4" } }, + "dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "requires": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -19650,6 +20365,11 @@ "pkg-dir": "^4.1.0" } }, + "find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -20001,6 +20721,21 @@ "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==" }, + "hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "requires": { + "react-is": "^16.7.0" + }, + "dependencies": { + "react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + } + } + }, "hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -22986,6 +23721,17 @@ "workbox-webpack-plugin": "^6.4.1" } }, + "react-transition-group": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz", + "integrity": "sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + } + }, "readable-stream": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", @@ -23775,6 +24521,11 @@ "postcss-selector-parser": "^6.0.4" } }, + "stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", diff --git a/package.json b/package.json index b950856..842711e 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,9 @@ "version": "0.1.0", "private": true, "dependencies": { + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/material": "^5.8.2", "@testing-library/jest-dom": "^5.16.4", "@testing-library/react": "^13.2.0", "@testing-library/user-event": "^13.5.0", diff --git a/public/index.html b/public/index.html index cd1f74b..99bb4a1 100644 --- a/public/index.html +++ b/public/index.html @@ -3,6 +3,10 @@ + + + + diff --git a/src/UnauthenticatedApp.js b/src/UnauthenticatedApp.js index 2bfab1c..557499c 100644 --- a/src/UnauthenticatedApp.js +++ b/src/UnauthenticatedApp.js @@ -1,14 +1,12 @@ -import { useAuthState } from './context/auth'; +import { Fragment } from 'react'; + +import Login from './screens/Login'; function UnauthenticatedApp() { - const { login, isPending } = useAuthState(); - return ( -
-

Please, log in!

- - {isPending &&

Loading...

} -
+ + + ); } diff --git a/src/assets/if-salas-logo.png b/src/assets/if-salas-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..3f811af5f01130b807347202b60b8f045302ad06 GIT binary patch literal 8249 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 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/LoadingIndicator.js b/src/components/LoadingIndicator.js new file mode 100644 index 0000000..33053a3 --- /dev/null +++ b/src/components/LoadingIndicator.js @@ -0,0 +1,21 @@ +import { Box, LinearProgress } from '@mui/material'; + +function LoadingIndicator() { + return ( + + + + ); +} + +const box = { + width: '100%', + position: 'absolute', + top: 0, +}; + +const linearProgress = { + height: '7px', +}; + +export default LoadingIndicator; diff --git a/src/index.css b/src/index.css index ec2585e..20c8d70 100644 --- a/src/index.css +++ b/src/index.css @@ -1,8 +1,6 @@ body { margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', - sans-serif; + font-family: 'Fira Code', monospace; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } diff --git a/src/index.js b/src/index.js index fa6639d..742d56d 100644 --- a/src/index.js +++ b/src/index.js @@ -1,16 +1,36 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; -import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import AppProviders from './context'; +import { createTheme } from '@mui/material'; +import { ThemeProvider } from '@mui/system'; +import './index.css'; + +const theme = createTheme({ + palette: { + primary: { + main: '#32A041', + black: '#1C1C1C', + lightGray: '#8C8C8C', + }, + secondary: { + main: '#00420C', + }, + }, + typography: { + fontFamily: ['Fira Code'].join(','), + }, +}); const root = ReactDOM.createRoot(document.getElementById('root')); root.render( - - - + + + + + ); diff --git a/src/screens/Login.js b/src/screens/Login.js new file mode 100644 index 0000000..a09e4b8 --- /dev/null +++ b/src/screens/Login.js @@ -0,0 +1,100 @@ +import { Fragment } from 'react'; +import { + Box, + Button, + Container, + Link, + Paper, + Stack, + TextField, +} from '@mui/material'; +import { useAuthState } from '../context/auth'; +import LoadingIndicator from '../components/LoadingIndicator'; +import logoImage from '../assets/if-salas-logo.svg'; + +function Login() { + const { login, isPending } = useAuthState(); + + return ( + + + + + Logotipo +

A plataforma de ensino de código aberto.

+ + + +

Login

+

Bem-vindo de volta. Faça o login digitando os dados abaixo.

+ + + + + Esqueci minha senha + Cadastre-se + + + + {isPending && } + + ); +} + +const paper = { + width: '900px', + height: '500px', + display: 'flex', + justifyContent: 'center', + margin: '0 auto', + marginTop: '20vh', + color: 'white', + textAlign: 'center', +}; + +const baseBox = { + width: '100%', + height: '100%', + display: 'flex', + justifyContent: 'center', + flexDirection: 'column', +}; + +const boxLogo = { + ...baseBox, + backgroundColor: 'secondary.main', +}; + +const boxForm = { + ...baseBox, + '> h1, p ': { + paddingLeft: '70px', + paddingRight: '70px', + textAlign: 'initial', + }, + '> h1': { + color: 'primary.black', + margin: 0, + }, + '> p': { + color: 'primary.lightGray', + }, +}; + +const stack = { + padding: '0 70px', +}; + +export default Login;