From 45567e7169cbc64ffdeef57a53e7c1dadd7d400b Mon Sep 17 00:00:00 2001 From: Apostolof Date: Wed, 4 Nov 2020 01:41:42 +0200 Subject: [PATCH] Add necessary particles --- packages/concordia-app/package.json | 1 + packages/concordia-app/src/Routes.jsx | 15 +++ .../src/assets/css/register-layout.css | 8 ++ .../concordia-app/src/assets/particles.js | 45 +++++++ .../MainLayout/MainLayoutMenu/index.jsx | 2 +- .../src/layouts/RegisterLayout/index.jsx | 4 + packages/concordia-contracts/package.json | 11 +- yarn.lock | 127 +++++++++--------- 8 files changed, 140 insertions(+), 73 deletions(-) create mode 100644 packages/concordia-app/src/assets/css/register-layout.css create mode 100644 packages/concordia-app/src/assets/particles.js diff --git a/packages/concordia-app/package.json b/packages/concordia-app/package.json index 14145df..b9208e0 100644 --- a/packages/concordia-app/package.json +++ b/packages/concordia-app/package.json @@ -37,6 +37,7 @@ "react": "~16.13.1", "react-dom": "~16.13.1", "react-i18next": "^11.7.3", + "react-particles-js": "^3.4.0", "react-redux": "~7.2.1", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", diff --git a/packages/concordia-app/src/Routes.jsx b/packages/concordia-app/src/Routes.jsx index abd8d60..cee10ce 100644 --- a/packages/concordia-app/src/Routes.jsx +++ b/packages/concordia-app/src/Routes.jsx @@ -2,6 +2,7 @@ import React, { Fragment, lazy, Suspense } from 'react'; import { Redirect, Route, Switch } from 'react-router-dom'; import MainLayout from './layouts/MainLayout'; import LoadingScreen from './components/LoadingScreen'; +import RegisterLayout from './layouts/RegisterLayout'; const routesConfig = [ { @@ -10,6 +11,20 @@ const routesConfig = [ layout: MainLayout, component: lazy(() => import('./components/NotFound')), }, + { + path: '/auth', + layout: RegisterLayout, + routes: [ + { + exact: true, + path: '/auth/register', + component: lazy(() => import('./views/Register')), + }, + { + component: () => , + }, + ], + }, { path: '*', layout: MainLayout, diff --git a/packages/concordia-app/src/assets/css/register-layout.css b/packages/concordia-app/src/assets/css/register-layout.css new file mode 100644 index 0000000..461d072 --- /dev/null +++ b/packages/concordia-app/src/assets/css/register-layout.css @@ -0,0 +1,8 @@ +.particles { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: -1; + background: rgba(0, 0, 0, 0) linear-gradient(45deg, rgb(45, 54, 76) 0%, rgb(37, 45, 63) 100%) repeat scroll 0 0; +} diff --git a/packages/concordia-app/src/assets/particles.js b/packages/concordia-app/src/assets/particles.js new file mode 100644 index 0000000..20cfa33 --- /dev/null +++ b/packages/concordia-app/src/assets/particles.js @@ -0,0 +1,45 @@ +const particlesOptions = { + particles: { + number: { + value: 60, + density: { + enable: true, + value_area: 1500, + }, + }, + line_linked: { + enable: true, + opacity: 0.02, + }, + move: { + direction: 'right', + speed: 0.05, + }, + size: { + value: 1, + }, + opacity: { + anim: { + enable: true, + speed: 1, + opacity_min: 0.05, + }, + }, + }, + interactivity: { + events: { + onclick: { + enable: true, + mode: 'push', + }, + }, + modes: { + push: { + particles_nb: 1, + }, + }, + }, + retina_detect: true, +}; + +export default particlesOptions; diff --git a/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx b/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx index 235bd03..69240e7 100644 --- a/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx +++ b/packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx @@ -26,7 +26,7 @@ const MainLayoutMenu = (props) => { link name="register" key="register" - onClick={() => { push('/register'); }} + onClick={() => { push('/auth/register'); }} position="right" > {t('topbar.button.signup')} diff --git a/packages/concordia-app/src/layouts/RegisterLayout/index.jsx b/packages/concordia-app/src/layouts/RegisterLayout/index.jsx index 3b4632c..2f7199f 100644 --- a/packages/concordia-app/src/layouts/RegisterLayout/index.jsx +++ b/packages/concordia-app/src/layouts/RegisterLayout/index.jsx @@ -1,11 +1,15 @@ import React from 'react'; import PropTypes from 'prop-types'; +import Particles from 'react-particles-js'; +import particlesOptions from '../../assets/particles'; +import '../../assets/css/register-layout.css'; const RegisterLayout = (props) => { const { children } = props; return (
+ {children}
); diff --git a/packages/concordia-contracts/package.json b/packages/concordia-contracts/package.json index 8ef2107..dac6ef5 100644 --- a/packages/concordia-contracts/package.json +++ b/packages/concordia-contracts/package.json @@ -17,11 +17,12 @@ "truffle": "~5.1.45" }, "devDependencies": { - "eslint": "6.8.0", - "eslint-config-airbnb": "18.1.0", - "eslint-plugin-import": "2.20.2", - "eslint-plugin-jsx-a11y": "6.2.3", - "eslint-plugin-react": "7.19.0", + "eslint": "^6.8.0", + "eslint-config-airbnb": "^18.1.0", + "eslint-plugin-import": "^2.20.2", + "eslint-plugin-jsx-a11y": "^6.2.3", + "eslint-plugin-react": "^7.19.0", + "eslint-plugin-react-hooks": "^4.2.0", "solhint": "~3.2.0" } } diff --git a/yarn.lock b/yarn.lock index 1c2bd2f..f943a45 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5893,7 +5893,7 @@ escodegen@^1.11.0, escodegen@^1.9.1: optionalDependencies: source-map "~0.6.1" -eslint-config-airbnb-base@^14.1.0, eslint-config-airbnb-base@^14.2.0: +eslint-config-airbnb-base@^14.2.0: version "14.2.0" resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-14.2.0.tgz#fe89c24b3f9dc8008c9c0d0d88c28f95ed65e9c4" integrity sha512-Snswd5oC6nJaevs3nZoLSTvGJBvzTfnBqOIArkf3cbyTyq9UD79wOk8s+RiL6bhca0p/eRO6veczhf6A/7Jy8Q== @@ -5902,15 +5902,6 @@ eslint-config-airbnb-base@^14.1.0, eslint-config-airbnb-base@^14.2.0: object.assign "^4.1.0" object.entries "^1.1.2" -eslint-config-airbnb@18.1.0: - version "18.1.0" - resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.1.0.tgz#724d7e93dadd2169492ff5363c5aaa779e01257d" - integrity sha512-kZFuQC/MPnH7KJp6v95xsLBf63G/w7YqdPfQ0MUanxQ7zcKUNG8j+sSY860g3NwCBOa62apw16J6pRN+AOgXzw== - dependencies: - eslint-config-airbnb-base "^14.1.0" - object.assign "^4.1.0" - object.entries "^1.1.1" - eslint-config-airbnb@^18.1.0: version "18.2.0" resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.2.0.tgz#8a82168713effce8fc08e10896a63f1235499dcd" @@ -5979,24 +5970,6 @@ eslint-plugin-import@2.20.1: read-pkg-up "^2.0.0" resolve "^1.12.0" -eslint-plugin-import@2.20.2: - version "2.20.2" - resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.20.2.tgz#91fc3807ce08be4837141272c8b99073906e588d" - integrity sha512-FObidqpXrR8OnCh4iNsxy+WACztJLXAHBO5hK79T1Hc77PgQZkyDGA5Ag9xAvRpglvLNxhH/zSmZ70/pZ31dHg== - dependencies: - array-includes "^3.0.3" - array.prototype.flat "^1.2.1" - contains-path "^0.1.0" - debug "^2.6.9" - doctrine "1.5.0" - eslint-import-resolver-node "^0.3.2" - eslint-module-utils "^2.4.1" - has "^1.0.3" - minimatch "^3.0.4" - object.values "^1.1.0" - read-pkg-up "^2.0.0" - resolve "^1.12.0" - eslint-plugin-import@^2.20.2: version "2.22.1" resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.22.1.tgz#0896c7e6a0cf44109a2d97b95903c2bb689d7702" @@ -6128,90 +6101,90 @@ eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e" integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ== -eslint@6.8.0, eslint@^6.6.0, eslint@^6.8.0: - version "6.8.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb" - integrity sha512-K+Iayyo2LtyYhDSYwz5D5QdWw0hCacNzyq1Y821Xna2xSJj7cijoLLYmLxTQgcgZ9mC61nryMy9S7GRbYpI5Ig== +eslint@^5.6.0: + version "5.16.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.16.0.tgz#a1e3ac1aae4a3fbd8296fcf8f7ab7314cbb6abea" + integrity sha512-S3Rz11i7c8AA5JPv7xAH+dOyq/Cu/VXHiHXBPOU1k/JAM5dXqQPt3qcrhpHSorXmrpu2g0gkIBVXAqCpzfoZIg== dependencies: "@babel/code-frame" "^7.0.0" - ajv "^6.10.0" + ajv "^6.9.1" chalk "^2.1.0" cross-spawn "^6.0.5" debug "^4.0.1" doctrine "^3.0.0" - eslint-scope "^5.0.0" - eslint-utils "^1.4.3" - eslint-visitor-keys "^1.1.0" - espree "^6.1.2" + eslint-scope "^4.0.3" + eslint-utils "^1.3.1" + eslint-visitor-keys "^1.0.0" + espree "^5.0.1" esquery "^1.0.1" esutils "^2.0.2" file-entry-cache "^5.0.1" functional-red-black-tree "^1.0.1" - glob-parent "^5.0.0" - globals "^12.1.0" + glob "^7.1.2" + globals "^11.7.0" ignore "^4.0.6" import-fresh "^3.0.0" imurmurhash "^0.1.4" - inquirer "^7.0.0" - is-glob "^4.0.0" - js-yaml "^3.13.1" + inquirer "^6.2.2" + js-yaml "^3.13.0" json-stable-stringify-without-jsonify "^1.0.1" levn "^0.3.0" - lodash "^4.17.14" + lodash "^4.17.11" minimatch "^3.0.4" mkdirp "^0.5.1" natural-compare "^1.4.0" - optionator "^0.8.3" + optionator "^0.8.2" + path-is-inside "^1.0.2" progress "^2.0.0" regexpp "^2.0.1" - semver "^6.1.2" - strip-ansi "^5.2.0" - strip-json-comments "^3.0.1" + semver "^5.5.1" + strip-ansi "^4.0.0" + strip-json-comments "^2.0.1" table "^5.2.3" text-table "^0.2.0" - v8-compile-cache "^2.0.3" -eslint@^5.6.0: - version "5.16.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.16.0.tgz#a1e3ac1aae4a3fbd8296fcf8f7ab7314cbb6abea" - integrity sha512-S3Rz11i7c8AA5JPv7xAH+dOyq/Cu/VXHiHXBPOU1k/JAM5dXqQPt3qcrhpHSorXmrpu2g0gkIBVXAqCpzfoZIg== +eslint@^6.6.0, eslint@^6.8.0: + version "6.8.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb" + integrity sha512-K+Iayyo2LtyYhDSYwz5D5QdWw0hCacNzyq1Y821Xna2xSJj7cijoLLYmLxTQgcgZ9mC61nryMy9S7GRbYpI5Ig== dependencies: "@babel/code-frame" "^7.0.0" - ajv "^6.9.1" + ajv "^6.10.0" chalk "^2.1.0" cross-spawn "^6.0.5" debug "^4.0.1" doctrine "^3.0.0" - eslint-scope "^4.0.3" - eslint-utils "^1.3.1" - eslint-visitor-keys "^1.0.0" - espree "^5.0.1" + eslint-scope "^5.0.0" + eslint-utils "^1.4.3" + eslint-visitor-keys "^1.1.0" + espree "^6.1.2" esquery "^1.0.1" esutils "^2.0.2" file-entry-cache "^5.0.1" functional-red-black-tree "^1.0.1" - glob "^7.1.2" - globals "^11.7.0" + glob-parent "^5.0.0" + globals "^12.1.0" ignore "^4.0.6" import-fresh "^3.0.0" imurmurhash "^0.1.4" - inquirer "^6.2.2" - js-yaml "^3.13.0" + inquirer "^7.0.0" + is-glob "^4.0.0" + js-yaml "^3.13.1" json-stable-stringify-without-jsonify "^1.0.1" levn "^0.3.0" - lodash "^4.17.11" + lodash "^4.17.14" minimatch "^3.0.4" mkdirp "^0.5.1" natural-compare "^1.4.0" - optionator "^0.8.2" - path-is-inside "^1.0.2" + optionator "^0.8.3" progress "^2.0.0" regexpp "^2.0.1" - semver "^5.5.1" - strip-ansi "^4.0.0" - strip-json-comments "^2.0.1" + semver "^6.1.2" + strip-ansi "^5.2.0" + strip-json-comments "^3.0.1" table "^5.2.3" text-table "^0.2.0" + v8-compile-cache "^2.0.3" espree@^5.0.1: version "5.0.1" @@ -13027,6 +13000,11 @@ path-type@^4.0.0: resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b" integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw== +pathseg@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/pathseg/-/pathseg-1.2.0.tgz#22af051e28037671e7799e296fe96c5dcbe53acd" + integrity sha512-+pQS7lTaoVIXhaCW7R3Wd/165APzZHWzYVqe7dxzdupxQwebgpBaCmf0/XZwmoA/rkDq3qvzO0qv4d5oFVrBRw== + pathval@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.0.tgz#b942e6d4bde653005ef6b71361def8727d0645e0" @@ -14358,6 +14336,14 @@ react-is@^16.13.1, react-is@^16.6.0, react-is@^16.6.3, react-is@^16.7.0, react-i resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== +react-particles-js@^3.4.0: + version "3.4.0" + resolved "https://registry.yarnpkg.com/react-particles-js/-/react-particles-js-3.4.0.tgz#20383bbf2a8b8ca9060fc8482d028b95cbbf273c" + integrity sha512-ybsHCm090TljGOr0kk+ONftYQBqeaxZ65tkmEDzMP/6LW6tZVXj9b027LQ3T8nGU9tfSb8wF5bNfH57nEoABWA== + dependencies: + lodash "^4.17.11" + tsparticles "^1.18.5" + react-popper@^1.3.7: version "1.3.7" resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.7.tgz#f6a3471362ef1f0d10a4963673789de1baca2324" @@ -16506,6 +16492,13 @@ tslib@^1.10.0, tslib@^1.8.1, tslib@^1.9.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== +tsparticles@^1.18.5: + version "1.18.10" + resolved "https://registry.yarnpkg.com/tsparticles/-/tsparticles-1.18.10.tgz#d2e80af398ba90e2fdeb29dff9afdf65a7fb6be4" + integrity sha512-0OIGYwbXVJjd48GUdcTkv7Cn/BIoTOxUleeMhKqbFL5tV1CJevyhfXkMtGrY4FwRYxcNorxeaOE4dH1MO9AONQ== + optionalDependencies: + pathseg "^1.2.0" + tsutils@^3.17.1: version "3.17.1" resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.17.1.tgz#ed719917f11ca0dee586272b2ac49e015a2dd759"