Add necessary particles

4 years ago · 45567e7169
8 changed files with 140 additions and 73 deletions
--- 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",
--- 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: () => <Redirect to="/404" />,
+      },
+    ],
+  },
  {
    path: '*',
    layout: MainLayout,
--- a/packages/concordia-app/src/assets/css/register-layout.css
+++ 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;
+}
--- a/packages/concordia-app/src/assets/particles.js
+++ 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;
--- 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')}
--- 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 (
      <div id="register-layout">
+          <Particles className="particles" params={particlesOptions} />
          {children}
      </div>
  );
--- 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"
  }
 }
--- 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"