feat: add particles to main layout

packages/concordia-app/src/assets/particles.js

@@ -1,7 +1,7 @@
 const particlesOptions = {
   particles: {
     number: {
-      value: 90,
+      value: 120,
       density: {
         enable: true,
         value_area: 1500,
@@ -9,14 +9,14 @@ const particlesOptions = {
     },
     line_linked: {
       enable: true,
-      opacity: 0.04,
+      opacity: 0.06,
     },
     move: {
       direction: 'none',
       speed: 0.12,
     },
     size: {
-      value: 1.5,
+      value: 1.6,
     },
     opacity: {
       anim: {

packages/concordia-app/src/components/InitializationScreen/CustomLoader/style.css

@@ -1,5 +1,5 @@
 #loading-screen {
-    padding-top: 12em;
+    padding-top: 14em;
     text-align: center;
     font-size: large;
     height: 100%;

packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/styles.css

@@ -7,4 +7,7 @@
     border-radius: 0;
     margin-top: 0;
     margin-bottom: 4rem;
+    z-index: 1;
+    position: relative;
+    border-bottom: solid rgba(255, 255, 255,0.2) 1px;
 }

packages/concordia-app/src/layouts/MainLayout/index.jsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Grid } from 'semantic-ui-react';
+import Particles from 'react-particles-js';
+import particlesOptions from '../../assets/particles';
 import MainLayoutMenu from './MainLayoutMenu';
 import MainLayoutEthereumStatus from './MainLayoutEthereumStatus';
 import MainLayoutIPFSStatus from './MainLayoutIPFSStatus';
@@ -11,6 +13,7 @@ const MainLayout = (props) => {
 
   return (
       <div id="main-layout">
+          <Particles className="particles" params={particlesOptions} />
           <MainLayoutMenu />
           <Grid id="main-layout-grid">
               <Grid.Column width={4} />

packages/concordia-app/src/layouts/RegisterLayout/styles.css

@@ -3,6 +3,5 @@
     right: 0;
     bottom: 0;
     left: 0;
-    z-index: -1;
-    background: rgba(0, 0, 0, 0) linear-gradient(45deg, rgb(37, 45, 63) 0%, rgb(11,37,64) 100%) repeat scroll 0 0;
+    background: var(--secondary-color);
 }