(chore) Refactored file and folder's structure - (Add) base SCSS - (Add) Updated favicons
This commit is contained in:
Gabriel Rodríguez Alsina
parent
84aa1c5a52
commit
47e8a1dacf
|
|
@ -43,8 +43,8 @@
|
|||
"scripts": {
|
||||
"predeploy": "npm run build",
|
||||
"deploy": "gh-pages -d build -o origin",
|
||||
"build-css": "node-sass-chokidar src/index/index.scss -o src/index",
|
||||
"watch-css": "npm run build-css && node-sass-chokidar src/index/index.scss -o src/index --watch --recursive",
|
||||
"build-css": "node-sass-chokidar src/assets/stylesheets/index.scss -o src/assets/stylesheets",
|
||||
"watch-css": "npm run build-css && node-sass-chokidar src/assets/stylesheets/index.scss -o src/assets/stylesheets --watch --recursive",
|
||||
"start-js": "react-scripts start",
|
||||
"start": "npm-run-all -p watch-css start-js",
|
||||
"build-js": "react-scripts build",
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 4.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 3.0 KiB |
|
|
@ -3,7 +3,7 @@
|
|||
<msapplication>
|
||||
<tile>
|
||||
<square150x150logo src="/mstile-150x150.png"/>
|
||||
<TileColor>#da532c</TileColor>
|
||||
<TileColor>#5c3698</TileColor>
|
||||
</tile>
|
||||
</msapplication>
|
||||
</browserconfig>
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 456 B |
Binary file not shown.
|
Before Width: | Height: | Size: 4.6 KiB After Width: | Height: | Size: 574 B |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 7.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 3.2 KiB |
|
|
@ -5,30 +5,14 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="theme-color" content="#000000">
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is added to the
|
||||
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/favicons/manifest.json">
|
||||
<link rel="shortcut icon" href="%PUBLIC_URL%/favicons/favicon.ico">
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>POA Network Ceremony DApp</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<noscript>
|
||||
You need to enable JavaScript to run this app.
|
||||
</noscript>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
28
src/App.css
28
src/App.css
|
|
@ -1,28 +0,0 @@
|
|||
.App {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.App-logo {
|
||||
animation: App-logo-spin infinite 20s linear;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #222;
|
||||
height: 150px;
|
||||
padding: 20px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.App-title {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.App-intro {
|
||||
font-size: large;
|
||||
}
|
||||
|
||||
@keyframes App-logo-spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
26
src/App.js
26
src/App.js
|
|
@ -1,17 +1,17 @@
|
|||
import React, { Component } from 'react'
|
||||
import getWeb3 from './getWeb3'
|
||||
import KeysManager from './keysManager'
|
||||
import Keys from './Keys'
|
||||
import swal from 'sweetalert'
|
||||
import './index/index.css'
|
||||
import addressGenerator from './addressGenerator'
|
||||
import JSzip from 'jszip'
|
||||
import './assets/stylesheets/index.css'
|
||||
import FileSaver from 'file-saver'
|
||||
import { constants } from './constants'
|
||||
import networkAddresses from './addresses'
|
||||
import Header from './Header'
|
||||
import Footer from './Footer'
|
||||
import Loading from './Loading'
|
||||
import Footer from './components/Footer'
|
||||
import Header from './components/Header'
|
||||
import JSzip from 'jszip'
|
||||
import Keys from './components/Keys'
|
||||
import KeysManager from './utils/keysManager'
|
||||
import Loading from './components/Loading'
|
||||
import React, { Component } from 'react'
|
||||
import addressGenerator from './utils/addressGenerator'
|
||||
import getWeb3 from './utils/getWeb3'
|
||||
import networkAddresses from './utils/addresses'
|
||||
import swal from 'sweetalert'
|
||||
import { constants } from './utils/constants'
|
||||
|
||||
function generateElement(msg) {
|
||||
let errorNode = document.createElement('div')
|
||||
|
|
|
|||
|
|
@ -0,0 +1,43 @@
|
|||
#ECSS (Enduring CSS) will be used
|
||||
|
||||
http://ecss.io/
|
||||
|
||||
##ECSS naming convention
|
||||
|
||||
.namespace-ModuleOrComponent_ChildNode-variant {}
|
||||
|
||||
- namespace: This is a required part of every selector. The micro-namespace should be all lowercase/train-case. It is typically an abbreviation to denote context or originating logic.
|
||||
|
||||
- ModuleOrComponent: This is a upper camel case/pascal case. It should always be preceded by a hyphen character (-).
|
||||
|
||||
- ChildNode: This is an optional section of the selector. It should be upper camel case/pascal case and preceded by an underscore (_).
|
||||
|
||||
- variant: This is a further optional section of the selector. It should be written all lowercase/train-case.
|
||||
|
||||
For example:
|
||||
|
||||
.hm-Item_Header {}
|
||||
.hm-Item_Header-bg1 {} /* Image background 1 */
|
||||
|
||||
##ECSS component states
|
||||
|
||||
.is-Suspended {}
|
||||
.is-Live {}
|
||||
.is-Selected {}
|
||||
.is-Busy {}
|
||||
|
||||
etc.
|
||||
|
||||
#CSS Overrides
|
||||
|
||||
Should be self contained.
|
||||
|
||||
For example:
|
||||
|
||||
.ip-Carousel {
|
||||
font-size: $text13;
|
||||
/* The override is here for when this key-selector sits within a ip-HomeCallouts element */
|
||||
.ip-HomeCallouts & {
|
||||
font-size: $text15;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
Holds what we might call the boilerplate stuff for the project: reset (or Normalize.css, or whatever), typography, etc.
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.display-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.display-inline {
|
||||
display: inline;
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.background-blur {
|
||||
animation-duration: 0.25s;
|
||||
animation-fill-mode: forwards;
|
||||
animation-iteration-count: 1;
|
||||
animation-name: sw-ModalAnimation_in;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
|
||||
@keyframes sw-ModalAnimation_in {
|
||||
0% {
|
||||
filter: blur(0);
|
||||
}
|
||||
100% {
|
||||
filter: blur(2px);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
@import 'reset';
|
||||
@import 'normalize';
|
||||
|
||||
@import 'display';
|
||||
@import 'effects';
|
||||
@import 'typography';
|
||||
|
|
@ -0,0 +1,341 @@
|
|||
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||
|
||||
/* Document
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Correct the line height in all browsers.
|
||||
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin in all browsers.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; /* 1 */
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Chrome 57-
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Change the font styles in all browsers.
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE 10+.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10.
|
||||
* 2. Remove the padding in IE 10.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||
*/
|
||||
|
||||
details {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Misc
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10+.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
@import url('https://fonts.googleapis.com/css?family=Nunito:300,400,600,700');
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
color: $base-text-color;
|
||||
font-family: Nunito, sans-serif;
|
||||
font-size: $base-font-size;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
All kinds of specific modules like a slider, a loader, a widget, etc.
|
||||
|
|
@ -0,0 +1 @@
|
|||
All Sass tools and helpers we’ll use across the project: variables, mixins, functions, placeholders, etc.
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'typography';
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
// avoid text selection
|
||||
@mixin not-selectable-text() {
|
||||
/* Firefox all */
|
||||
-moz-user-select: none;
|
||||
/* IE 10+ */
|
||||
-ms-user-select: none;
|
||||
/* Chrome all / Safari all */
|
||||
-webkit-user-select: none;
|
||||
/* Likely future */
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
// use for retina background images @1x / @2x / @3x
|
||||
@mixin image-retina($filename, $extension) {
|
||||
|
||||
background-image: url($filename + '.' + $extension);
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 2),
|
||||
(-moz-min-device-pixel-ratio: 2),
|
||||
(min-resolution: 192dpi),
|
||||
(min-resolution: 2dppx) {
|
||||
& {
|
||||
background-image: url($filename + '@2x.' + $extension);
|
||||
}
|
||||
}
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 3),
|
||||
(-moz-min-device-pixel-ratio: 3),
|
||||
(min-resolution: 288dpi),
|
||||
(min-resolution: 3dppx) {
|
||||
& {
|
||||
background-image: url($filename + '@3x.' + $extension);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// placeholder color
|
||||
@mixin placeholder-color($color) {
|
||||
&::-webkit-input-placeholder {
|
||||
/* WebKit browsers */
|
||||
color: $color !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
/* Mozilla Firefox 4 to 18 */
|
||||
color: $color !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
/* Mozilla Firefox 19+ */
|
||||
color: $color !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
/* Internet Explorer 10+ */
|
||||
color: $color !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
// placeholder font size
|
||||
@mixin placeholder-font-size($font-size) {
|
||||
&::-webkit-input-placeholder {
|
||||
/* WebKit browsers */
|
||||
font-size: $font-size !important;
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
/* Mozilla Firefox 4 to 18 */
|
||||
font-size: $font-size !important;
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
/* Mozilla Firefox 19+ */
|
||||
font-size: $font-size !important;
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
/* Internet Explorer 10+ */
|
||||
font-size: $font-size !important;
|
||||
}
|
||||
}
|
||||
|
||||
// placeholder font style
|
||||
@mixin placeholder-font-style($font-style) {
|
||||
&::-webkit-input-placeholder {
|
||||
/* WebKit browsers */
|
||||
font-style: $font-style !important;
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
/* Mozilla Firefox 4 to 18 */
|
||||
font-style: $font-style !important;
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
/* Mozilla Firefox 19+ */
|
||||
font-style: $font-style !important;
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
/* Internet Explorer 10+ */
|
||||
font-style: $font-style !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
.text-light {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.text-normal {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.text-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.text-semibold {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.text-italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
// colors
|
||||
$brand-primary: #5a2da5;
|
||||
$brand-secondary: #8ce1d7;
|
||||
$base-border-color: #e9e9e9;
|
||||
$base-text-color: #4a4a4a;
|
||||
$base-text-color-light: #9b9b9b;
|
||||
$fullscreen-backdrop-color: rgba(78, 44, 137, 0.9);
|
||||
|
||||
// modal
|
||||
$sw-ModalWindow-horizontal-padding-xs: 8px;
|
||||
|
||||
// typography
|
||||
$base-font-size: 16px;
|
||||
|
||||
// paths
|
||||
$base-images-path: '../../assets/images';
|
||||
|
||||
// responsive breakpoints
|
||||
$breakpoint-xs: 320px;
|
||||
$breakpoint-sm: 480px;
|
||||
$breakpoint-md: 768px;
|
||||
$breakpoint-lg: 992px;
|
||||
$breakpoint-xl: 1024px;
|
||||
$breakpoint-xxl: 1280px;
|
||||
$breakpoint-xxxl: 1366px;
|
||||
|
||||
// z-index
|
||||
$z-index-max: 12345678;
|
||||
|
||||
// grid gaps
|
||||
$grid-column-gap-md: 15px;
|
||||
$grid-column-gap-xl: 39px;
|
||||
$grid-column-gap-xxl: 74px;
|
||||
$grid-column-gap-xxl: 90px;
|
||||
|
||||
$grid-row-gap-md: 22px;
|
||||
$grid-row-gap-lg: 31px;
|
||||
|
||||
// home
|
||||
$hm-Home_Btn-width: 230px;
|
||||
|
|
@ -0,0 +1,354 @@
|
|||
@import url("https://fonts.googleapis.com/css?family=Nunito:300,400,600,700");
|
||||
.text-light {
|
||||
font-weight: 300; }
|
||||
|
||||
.text-normal {
|
||||
font-weight: 400; }
|
||||
|
||||
.text-bold {
|
||||
font-weight: 700; }
|
||||
|
||||
.text-semibold {
|
||||
font-weight: 600; }
|
||||
|
||||
.text-italic {
|
||||
font-style: italic; }
|
||||
|
||||
.text-left {
|
||||
text-align: left; }
|
||||
|
||||
.text-right {
|
||||
text-align: right; }
|
||||
|
||||
.text-center {
|
||||
text-align: center; }
|
||||
|
||||
* {
|
||||
box-sizing: border-box; }
|
||||
|
||||
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||
/* Document
|
||||
========================================================================== */
|
||||
/**
|
||||
* 1. Correct the line height in all browsers.
|
||||
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
*/
|
||||
html {
|
||||
line-height: 1.15;
|
||||
/* 1 */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
/* 2 */ }
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
/**
|
||||
* Remove the margin in all browsers.
|
||||
*/
|
||||
body {
|
||||
margin: 0; }
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0; }
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
/* 1 */
|
||||
height: 0;
|
||||
/* 1 */
|
||||
overflow: visible;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
pre {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
a {
|
||||
background-color: transparent; }
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Chrome 57-
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
/* 1 */
|
||||
text-decoration: underline;
|
||||
/* 2 */
|
||||
text-decoration: underline dotted;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder; }
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
small {
|
||||
font-size: 80%; }
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline; }
|
||||
|
||||
sub {
|
||||
bottom: -0.25em; }
|
||||
|
||||
sup {
|
||||
top: -0.5em; }
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10.
|
||||
*/
|
||||
img {
|
||||
border-style: none; }
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
/**
|
||||
* 1. Change the font styles in all browsers.
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
/* 1 */
|
||||
font-size: 100%;
|
||||
/* 1 */
|
||||
line-height: 1.15;
|
||||
/* 1 */
|
||||
margin: 0;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
button,
|
||||
input {
|
||||
/* 1 */
|
||||
overflow: visible; }
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
button,
|
||||
select {
|
||||
/* 1 */
|
||||
text-transform: none; }
|
||||
|
||||
/**
|
||||
* Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; }
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0; }
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText; }
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em; }
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
legend {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
color: inherit;
|
||||
/* 2 */
|
||||
display: table;
|
||||
/* 1 */
|
||||
max-width: 100%;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 3 */
|
||||
white-space: normal;
|
||||
/* 1 */ }
|
||||
|
||||
/**
|
||||
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
progress {
|
||||
vertical-align: baseline; }
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE 10+.
|
||||
*/
|
||||
textarea {
|
||||
overflow: auto; }
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10.
|
||||
* 2. Remove the padding in IE 10.
|
||||
*/
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto; }
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
/* 1 */
|
||||
outline-offset: -2px;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none; }
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
/* 1 */
|
||||
font: inherit;
|
||||
/* 2 */ }
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
/*
|
||||
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||
*/
|
||||
details {
|
||||
display: block; }
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
summary {
|
||||
display: list-item; }
|
||||
|
||||
/* Misc
|
||||
========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 10+.
|
||||
*/
|
||||
template {
|
||||
display: none; }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10.
|
||||
*/
|
||||
[hidden] {
|
||||
display: none; }
|
||||
|
||||
.hidden {
|
||||
display: none; }
|
||||
|
||||
.display-block {
|
||||
display: block; }
|
||||
|
||||
.display-inline {
|
||||
display: inline; }
|
||||
|
||||
.background-blur {
|
||||
animation-duration: 0.25s;
|
||||
animation-fill-mode: forwards;
|
||||
animation-iteration-count: 1;
|
||||
animation-name: sw-ModalAnimation_in;
|
||||
animation-timing-function: linear; }
|
||||
|
||||
@keyframes sw-ModalAnimation_in {
|
||||
0% {
|
||||
filter: blur(0); }
|
||||
100% {
|
||||
filter: blur(2px); } }
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
color: #4a4a4a;
|
||||
font-family: Nunito, sans-serif;
|
||||
font-size: 16px; }
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
@import 'helpers/index';
|
||||
@import 'vendors/index';
|
||||
@import 'base/index';
|
||||
@import 'layout/index';
|
||||
@import 'pages/index';
|
||||
@import 'components/index';
|
||||
|
|
@ -0,0 +1 @@
|
|||
Some styles for the main sections of the layout (header, footer, and so on). It can also contain the _grid file for the grid system used to build the layout.
|
||||
|
|
@ -0,0 +1 @@
|
|||
@import "base";
|
||||
|
|
@ -0,0 +1 @@
|
|||
Page-specific styles, For example: for the home page you can have a _home.scss.
|
||||
|
|
@ -0,0 +1 @@
|
|||
Contains all the CSS files from external libraries and frameworks: Bootstrap, jQuery, etc.
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react'
|
||||
import moment from 'moment'
|
||||
import { constants } from './constants'
|
||||
import { constants } from '../../utils/constants'
|
||||
|
||||
const Footer = ({ netId }) => {
|
||||
const footerClassName = netId in constants.NETWORKS && constants.NETWORKS[netId].TESTNET ? 'sokol' : ''
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react'
|
||||
import { constants } from './constants'
|
||||
import { constants } from '../../utils/constants'
|
||||
|
||||
let Header = ({ netId }) => {
|
||||
const thisIsTestnet = netId in constants.NETWORKS && constants.NETWORKS[netId].TESTNET
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
import React, { Component } from 'react'
|
||||
import Tooltip from 'rc-tooltip'
|
||||
// TODO: Check if this is worth it, or move it to vendors' folder
|
||||
import 'rc-tooltip/assets/bootstrap.css'
|
||||
|
||||
const encodeJson = json => {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react'
|
||||
import { constants } from './constants'
|
||||
import { constants } from '../../utils/constants'
|
||||
|
||||
const styles = netId => {
|
||||
const core = {
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 105 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 126 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 100 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 987 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="20"><path fill="#FBFBFB" fill-rule="evenodd" d="M21.377 14.326L14.152 1.82a3.645 3.645 0 0 0-6.312 0L.488 14.54a3.636 3.636 0 0 0 0 3.64A3.645 3.645 0 0 0 3.644 20h14.712A3.643 3.643 0 0 0 22 16.36c0-.753-.23-1.455-.623-2.034zm-8.821 1.217c0 .861-.663 1.519-1.556 1.519s-1.556-.658-1.556-1.519v-.035c0-.857.663-1.519 1.556-1.519s1.556.658 1.556 1.519v.035zm.036-10.238l-.77 6.717c-.052.484-.373.785-.822.785-.449 0-.77-.305-.822-.785l-.77-6.721c-.051-.519.23-.912.715-.912h1.75c.485.004.771.397.719.916z"/></svg>
|
||||
|
Before Width: | Height: | Size: 571 B |
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import App from './App'
|
||||
import registerServiceWorker from './registerServiceWorker'
|
||||
import registerServiceWorker from './utils/registerServiceWorker'
|
||||
window.addEventListener('beforeunload', function(event) {
|
||||
event.returnValue = 'Are you sure?'
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,24 +0,0 @@
|
|||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Open Sans'), local('OpenSans'), url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3ZBw1xU1rKptJj_0jans920.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzBampu5_7CjHW5spxoeN3Vs.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
color: #333;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
@mixin image-2x($image, $width: 100%, $height: 100%) {
|
||||
@media (min--moz-device-pixel-ratio: 1.3),
|
||||
(-o-min-device-pixel-ratio: 2.6/2),
|
||||
(-webkit-min-device-pixel-ratio: 1.3),
|
||||
(min-device-pixel-ratio: 1.3),
|
||||
(min-resolution: 1.3dppx) {
|
||||
background-image: url($image);
|
||||
background-size: $width $height;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
%full-width {
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
%stretch-width {
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
%title {
|
||||
color: #333;
|
||||
text-transform: uppercase;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
%description {
|
||||
color: #8197a2;
|
||||
line-height: 24px;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
%btn {
|
||||
transition: 0.3s background-color;
|
||||
border-radius: 3px;
|
||||
padding: 0 15px 0 32px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 12px 12px;
|
||||
background-position: left 15px center;
|
||||
color: #fff;
|
||||
line-height: 36px;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
%item {
|
||||
margin-bottom: 30px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #eee;
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
}
|
||||
|
|
@ -1,58 +0,0 @@
|
|||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
p, h1, h2, h3, h4 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
background: #fdfdfd;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
}
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
display: table;
|
||||
width: 100%;
|
||||
min-width: 960px;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 80px 0 60px;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.content {
|
||||
vertical-align: middle;
|
||||
padding: 30px 10px 0px 10px;
|
||||
background-color: #fdfdfd;
|
||||
margin-left: 140px;
|
||||
margin-right: 140px;
|
||||
}
|
||||
|
||||
.copy {
|
||||
@include image-2x('../images/copy@2x.png', 14px, 14px);
|
||||
background-image: url('../images/copy.png');
|
||||
background-size: 14px 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
display: inline-block;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
$container-width: 960px;
|
||||
$tablet-width: 768px;
|
||||
$mobile-width: 414px;
|
||||
$footer-height: 60px;
|
||||
|
||||
$desktop-indent: 30px;
|
||||
$tablet-indent: 20px;
|
||||
$mobile-indent: 15px;
|
||||
|
||||
$input-height: 40px;
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
.hidden {
|
||||
display:none;
|
||||
}
|
||||
|
||||
input[type=file]{
|
||||
position:absolute;
|
||||
top:-100px;
|
||||
width: 100px !important;
|
||||
}
|
||||
button:focus {outline:0;}
|
||||
|
||||
#createKeys {
|
||||
position: absolute;
|
||||
top: -webkit-calc(50% - 20px);
|
||||
left: -webkit-calc(50% - 50px);
|
||||
}
|
||||
|
||||
.loader {
|
||||
border: 16px solid grey;
|
||||
border-radius: 50%;
|
||||
border-top: 16px solid white;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
-webkit-animation: spin 2s linear infinite;
|
||||
animation: spin 2s linear infinite;
|
||||
position: absolute;
|
||||
top: -webkit-calc(50% - 76px);
|
||||
left: -webkit-calc(50% - 76px);
|
||||
}
|
||||
|
||||
@-webkit-keyframes spin {
|
||||
0% { -webkit-transform: rotate(0deg); }
|
||||
100% { -webkit-transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.password-label {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
|
@ -1,103 +0,0 @@
|
|||
.create-keys-button-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center
|
||||
}
|
||||
.create-keys {
|
||||
@extend %item;
|
||||
padding: 30px 20px;
|
||||
|
||||
h1 {
|
||||
@extend %title;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@extend %description;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
&-button {
|
||||
@extend %btn;
|
||||
margin-top: 20px;
|
||||
display: inline-block;
|
||||
background-color: #08b3f2;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAFVBMVEX///////////////////////////9nSIHRAAAABnRSTlMASUrk5udXTd49AAAAOUlEQVR42tXQsQEAIAgDQcAn+4+snRZxAK79KokrIcNBwgYdc0Migwxk8Qsd1TJWDf/KQWobqt+9G4coA99W7as5AAAAAElFTkSuQmCC);
|
||||
|
||||
&:hover {
|
||||
background-color: #079dd4;
|
||||
}
|
||||
}
|
||||
|
||||
&-inputs {
|
||||
overflow: hidden;
|
||||
display: table;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.left {
|
||||
padding-right: 10px;
|
||||
}
|
||||
.right {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.left,
|
||||
.right {
|
||||
display: table-cell;
|
||||
width: 48%;
|
||||
}
|
||||
|
||||
label {
|
||||
&:not(.radio) {
|
||||
display: block;
|
||||
margin-bottom: 15px;
|
||||
margin-top: 20px;
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
textarea {
|
||||
outline: none;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
transition: 0.3s border-color;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #eee;
|
||||
|
||||
&:focus {
|
||||
border-color: #08b3f2;
|
||||
}
|
||||
}
|
||||
|
||||
textarea {
|
||||
padding: 15px;
|
||||
height: 110px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 0 15px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
input[type="radio"] {
|
||||
display: none;
|
||||
|
||||
&:checked + .radio:after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.rc-tooltip-inner {
|
||||
min-height: 0;
|
||||
}
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
.footer {
|
||||
@extend %full-width;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: $footer-height;
|
||||
background-color: #6d2eae;
|
||||
|
||||
@media screen and (max-width: $mobile-width) {
|
||||
height: auto;
|
||||
padding: 20px 10px 0;
|
||||
}
|
||||
|
||||
&.sokol {
|
||||
background-color: #6ac9b9;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
|
||||
@media screen and (max-width: $mobile-width) {
|
||||
padding-top: $footer-height - 20;
|
||||
}
|
||||
}
|
||||
|
||||
&-logo,
|
||||
.socials {
|
||||
transform: translateY(-50%);
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 50%;
|
||||
|
||||
@media screen and (max-width: $mobile-width) {
|
||||
transform: translateY(0);
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-logo {
|
||||
@include image-2x('../images/logo_ceremony_dapp_footer@2x.png', 120px, 24px);
|
||||
z-index: 2;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 120px;
|
||||
height: 24px;
|
||||
background-image: url('../images/logo_ceremony_dapp_footer.png');
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
&-rights {
|
||||
color: #fff;
|
||||
line-height: $footer-height;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
|
||||
@media screen and (max-width: $mobile-width) {
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
.header {
|
||||
@extend %stretch-width;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
padding: 18px 10px;
|
||||
background-image: url(../images/bg_header.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
&.sokol {
|
||||
background-image: none;
|
||||
background-color: #6ac9b9;
|
||||
}
|
||||
|
||||
&-logo {
|
||||
@include image-2x('../images/logo_ceremony_dapp@2x.png', 182px, 35px);
|
||||
float: left;
|
||||
width: 182px;
|
||||
height: 35px;
|
||||
background-image: url(../images/logo_ceremony_dapp.png);
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
&-logo-sokol {
|
||||
@include image-2x('../images/logo_sokol@2x.png', 146px, 35px);
|
||||
display: block;
|
||||
width: 146px;
|
||||
height: 35px;
|
||||
background-image: url('../images/logo_sokol.png');
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,507 +0,0 @@
|
|||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local("Open Sans"), local("OpenSans"), url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3ZBw1xU1rKptJj_0jans920.woff2) format("woff2");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local("Open Sans Bold"), local("OpenSans-Bold"), url(https://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzBampu5_7CjHW5spxoeN3Vs.woff2) format("woff2");
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; }
|
||||
|
||||
html,
|
||||
body {
|
||||
color: #333;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
-webkit-font-smoothing: antialiased; }
|
||||
|
||||
.footer {
|
||||
left: 0;
|
||||
right: 0; }
|
||||
|
||||
.header {
|
||||
left: 0;
|
||||
right: 0; }
|
||||
|
||||
.create-keys h1, .keys-title {
|
||||
color: #333;
|
||||
text-transform: uppercase;
|
||||
font-size: 16px;
|
||||
font-weight: bold; }
|
||||
|
||||
.create-keys h2, .keys-description {
|
||||
color: #8197a2;
|
||||
line-height: 24px;
|
||||
font-size: 14px;
|
||||
font-weight: normal; }
|
||||
|
||||
.create-keys-button, .keys-download {
|
||||
transition: 0.3s background-color;
|
||||
border-radius: 3px;
|
||||
padding: 0 15px 0 32px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 12px 12px;
|
||||
background-position: left 15px center;
|
||||
color: #fff;
|
||||
line-height: 36px;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold; }
|
||||
|
||||
.create-keys {
|
||||
margin-bottom: 30px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #eee;
|
||||
background-color: #fff;
|
||||
color: #333; }
|
||||
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
p, h1, h2, h3, h4 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Open Sans', sans-serif; }
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
background: #fdfdfd;
|
||||
margin-left: 5px; }
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
background-position: center center; }
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
display: table;
|
||||
width: 100%;
|
||||
min-width: 960px;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 80px 0 60px; }
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin: 0 auto; }
|
||||
|
||||
.content {
|
||||
vertical-align: middle;
|
||||
padding: 30px 10px 0px 10px;
|
||||
background-color: #fdfdfd;
|
||||
margin-left: 140px;
|
||||
margin-right: 140px; }
|
||||
|
||||
.copy {
|
||||
background-image: url("../images/copy.png");
|
||||
background-size: 14px 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
display: inline-block;
|
||||
margin-left: 5px; }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.copy {
|
||||
background-image: url("../images/copy@2x.png");
|
||||
background-size: 14px 14px; } }
|
||||
|
||||
.hidden {
|
||||
display: none; }
|
||||
|
||||
input[type=file] {
|
||||
position: absolute;
|
||||
top: -100px;
|
||||
width: 100px !important; }
|
||||
|
||||
button:focus {
|
||||
outline: 0; }
|
||||
|
||||
#createKeys {
|
||||
position: absolute;
|
||||
top: -webkit-calc(50% - 20px);
|
||||
left: -webkit-calc(50% - 50px); }
|
||||
|
||||
.loader {
|
||||
border: 16px solid grey;
|
||||
border-radius: 50%;
|
||||
border-top: 16px solid white;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
-webkit-animation: spin 2s linear infinite;
|
||||
animation: spin 2s linear infinite;
|
||||
position: absolute;
|
||||
top: -webkit-calc(50% - 76px);
|
||||
left: -webkit-calc(50% - 76px); }
|
||||
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg); } }
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
transform: rotate(360deg); } }
|
||||
|
||||
.password-label {
|
||||
color: #333; }
|
||||
|
||||
button:focus {
|
||||
outline: none; }
|
||||
|
||||
.create-keys-button-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center; }
|
||||
|
||||
.create-keys {
|
||||
padding: 30px 20px; }
|
||||
.create-keys h1 {
|
||||
margin-bottom: 20px; }
|
||||
.create-keys h2 {
|
||||
margin-bottom: 20px; }
|
||||
.create-keys-button {
|
||||
margin-top: 20px;
|
||||
display: inline-block;
|
||||
background-color: #08b3f2;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAFVBMVEX///////////////////////////9nSIHRAAAABnRSTlMASUrk5udXTd49AAAAOUlEQVR42tXQsQEAIAgDQcAn+4+snRZxAK79KokrIcNBwgYdc0Migwxk8Qsd1TJWDf/KQWobqt+9G4coA99W7as5AAAAAElFTkSuQmCC); }
|
||||
.create-keys-button:hover {
|
||||
background-color: #079dd4; }
|
||||
.create-keys-inputs {
|
||||
overflow: hidden;
|
||||
display: table;
|
||||
width: 100%; }
|
||||
.create-keys .left {
|
||||
padding-right: 10px; }
|
||||
.create-keys .right {
|
||||
padding-left: 10px; }
|
||||
.create-keys .left,
|
||||
.create-keys .right {
|
||||
display: table-cell;
|
||||
width: 48%; }
|
||||
.create-keys label:not(.radio) {
|
||||
display: block;
|
||||
margin-bottom: 15px;
|
||||
margin-top: 20px;
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
font-weight: bold; }
|
||||
.create-keys button,
|
||||
.create-keys input,
|
||||
.create-keys textarea {
|
||||
outline: none;
|
||||
font-family: 'Open Sans', sans-serif; }
|
||||
.create-keys input,
|
||||
.create-keys textarea {
|
||||
transition: 0.3s border-color;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #eee; }
|
||||
.create-keys input:focus,
|
||||
.create-keys textarea:focus {
|
||||
border-color: #08b3f2; }
|
||||
.create-keys textarea {
|
||||
padding: 15px;
|
||||
height: 110px;
|
||||
resize: none; }
|
||||
.create-keys input {
|
||||
padding: 0 15px;
|
||||
height: 36px; }
|
||||
.create-keys input[type="radio"] {
|
||||
display: none; }
|
||||
.create-keys input[type="radio"]:checked + .radio:after {
|
||||
opacity: 1; }
|
||||
|
||||
.rc-tooltip-inner {
|
||||
min-height: 0; }
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 60px;
|
||||
background-color: #6d2eae; }
|
||||
@media screen and (max-width: 414px) {
|
||||
.footer {
|
||||
height: auto;
|
||||
padding: 20px 10px 0; } }
|
||||
.footer.sokol {
|
||||
background-color: #6ac9b9; }
|
||||
.footer .container {
|
||||
position: relative; }
|
||||
@media screen and (max-width: 414px) {
|
||||
.footer .container {
|
||||
padding-top: 40px; } }
|
||||
.footer-logo,
|
||||
.footer .socials {
|
||||
transform: translateY(-50%);
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 50%; }
|
||||
@media screen and (max-width: 414px) {
|
||||
.footer-logo,
|
||||
.footer .socials {
|
||||
transform: translateY(0);
|
||||
top: 0; } }
|
||||
.footer-logo {
|
||||
z-index: 2;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 120px;
|
||||
height: 24px;
|
||||
background-image: url("../images/logo_ceremony_dapp_footer.png");
|
||||
background-position: 0 0; }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.footer-logo {
|
||||
background-image: url("../images/logo_ceremony_dapp_footer@2x.png");
|
||||
background-size: 120px 24px; } }
|
||||
.footer-rights {
|
||||
color: #fff;
|
||||
line-height: 60px;
|
||||
text-align: center;
|
||||
font-size: 12px; }
|
||||
@media screen and (max-width: 414px) {
|
||||
.footer-rights {
|
||||
line-height: 30px; } }
|
||||
|
||||
.header {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
padding: 18px 10px;
|
||||
background-image: url(../images/bg_header.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover; }
|
||||
.header.sokol {
|
||||
background-image: none;
|
||||
background-color: #6ac9b9; }
|
||||
.header-logo {
|
||||
float: left;
|
||||
width: 182px;
|
||||
height: 35px;
|
||||
background-image: url(../images/logo_ceremony_dapp.png);
|
||||
background-position: 0 0; }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.header-logo {
|
||||
background-image: url("../images/logo_ceremony_dapp@2x.png");
|
||||
background-size: 182px 35px; } }
|
||||
.header-logo-sokol {
|
||||
display: block;
|
||||
width: 146px;
|
||||
height: 35px;
|
||||
background-image: url("../images/logo_sokol.png");
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat; }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.header-logo-sokol {
|
||||
background-image: url("../images/logo_sokol@2x.png");
|
||||
background-size: 146px 35px; } }
|
||||
|
||||
.keys {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-bottom: 60px;
|
||||
text-align: left; }
|
||||
.keys-i {
|
||||
position: relative;
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
width: 33.33%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 15px 60px 15px; }
|
||||
.keys-i:first-child {
|
||||
padding-left: 0; }
|
||||
.keys-i:last-child {
|
||||
padding-right: 0; }
|
||||
.keys-i:not(:first-child) {
|
||||
border-left: 1px solid #e1e1e1; }
|
||||
.keys-title {
|
||||
margin-bottom: 10px; }
|
||||
.keys-hash {
|
||||
height: 30px;
|
||||
color: #6d2eae;
|
||||
line-height: 16px;
|
||||
font-size: 12px;
|
||||
display: table-cell; }
|
||||
.keys-hash-container {
|
||||
display: table; }
|
||||
.keys-description {
|
||||
line-height: 18px;
|
||||
font-size: 12px; }
|
||||
.keys-footer {
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
right: 15px;
|
||||
bottom: 0; }
|
||||
.keys-i:first-child .keys-footer {
|
||||
left: 0; }
|
||||
.keys-download, .keys-read-more {
|
||||
display: inline-block;
|
||||
vertical-align: middle; }
|
||||
.keys-download {
|
||||
background-color: #6d2eae;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAANlBMVEX///////////////////////////////////////////////////////////////////////8BOg0gAAAAEXRSTlMASUtWV1hZXF1e5ebn6Orr/GN0dVoAAABnSURBVHja1cnJDYBADENRDzBsYYn7bxaCFFmMaADf/B+0YlbwNSPtE3jvv9Ad29DCsB0dVtKnN8xOGowhCdm5o/eUgOw+AktKQPYFkDygLglQhyRAXZLzWV2iLlFvRb2V7O3qeVa9C41xDOyv+UmuAAAAAElFTkSuQmCC); }
|
||||
.keys-download:hover {
|
||||
background-color: #5d2795; }
|
||||
.keys-read-more {
|
||||
margin-left: 10px;
|
||||
color: #6d2eae;
|
||||
text-decoration: none; }
|
||||
.keys-read-more:hover {
|
||||
text-decoration: underline; }
|
||||
.keys-note {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
border: 1px solid #6d2eae;
|
||||
border-radius: 5px;
|
||||
padding: 20px 15px 20px 53px;
|
||||
background-color: rgba(109, 46, 174, 0.1);
|
||||
color: #6d2eae;
|
||||
text-align: left; }
|
||||
.keys-note:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 42px;
|
||||
background-color: #6d2eae;
|
||||
background-image: url(../images/warning.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center; }
|
||||
.keys-note-title {
|
||||
margin-bottom: 10px;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
font-weight: bold; }
|
||||
.keys-note-description {
|
||||
font-size: 12px; }
|
||||
|
||||
@keyframes fadeOut {
|
||||
0% {
|
||||
opacity: .2; }
|
||||
20% {
|
||||
opacity: 1;
|
||||
transform: scale(1); }
|
||||
100% {
|
||||
opacity: .2;
|
||||
transform: scale(0.3); } }
|
||||
|
||||
.loading {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 206px;
|
||||
margin: -30px 0 0 -111.5px;
|
||||
padding-top: 50px; }
|
||||
.loading:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 206px;
|
||||
height: 35px;
|
||||
background-image: url("../images/loading.png");
|
||||
background-position: 0 0; }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.loading:before {
|
||||
background-image: url("../images/loading@2x.png");
|
||||
background-size: 100% 100%; } }
|
||||
.loading-container {
|
||||
position: fixed;
|
||||
z-index: 1000000;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(35, 29, 115, 0.8); }
|
||||
.loading-i {
|
||||
animation-duration: 2s;
|
||||
animation-fill-mode: forwards;
|
||||
animation-iteration-count: infinite;
|
||||
animation-name: fadeOut;
|
||||
animation-timing-function: linear;
|
||||
opacity: .2;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-radius: 50%;
|
||||
background-color: #fff; }
|
||||
.loading-i:nth-child(2) {
|
||||
animation-delay: .1s; }
|
||||
.loading-i:nth-child(3) {
|
||||
animation-delay: .2s; }
|
||||
.loading-i:nth-child(4) {
|
||||
animation-delay: .3s; }
|
||||
.loading-i:nth-child(5) {
|
||||
animation-delay: .4s; }
|
||||
.loading-i:nth-child(6) {
|
||||
animation-delay: .5s; }
|
||||
|
||||
.waiting-container {
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
height: 100px;
|
||||
line-height: 100px; }
|
||||
|
||||
.socials {
|
||||
font-size: 0; }
|
||||
.footer .socials {
|
||||
right: 0; }
|
||||
.socials-i {
|
||||
transition: 0.3s background-color;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(255, 255, 255, 0.2); }
|
||||
.socials-i:not(:first-child) {
|
||||
margin-left: 10px; }
|
||||
.socials-i:hover {
|
||||
background-color: rgba(255, 255, 255, 0.4); }
|
||||
.socials-i:before {
|
||||
transform: translate(-50%, -50%);
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
background-image: url(../images/socials.png); }
|
||||
@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
|
||||
.socials-i:before {
|
||||
background-image: url("../images/socials@2x.png");
|
||||
background-size: 16px 69px; } }
|
||||
.socials-i_github:before {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-position: 0 0; }
|
||||
.socials-i_oracles:before {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
background-position: 0 -16px; }
|
||||
.socials-i_reddit:before {
|
||||
width: 15px;
|
||||
height: 13px;
|
||||
background-position: 0 -30px; }
|
||||
.socials-i_telegram:before {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
background-position: 0 -43px; }
|
||||
.socials-i_twitter:before {
|
||||
width: 15px;
|
||||
height: 12px;
|
||||
background-position: 0 -57px; }
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
@import './_vars';
|
||||
@import './_0_fonts';
|
||||
@import './_1_mixins';
|
||||
@import './_2_placeholders';
|
||||
@import './_3_base';
|
||||
@import './addition';
|
||||
@import './create-keys';
|
||||
@import './footer';
|
||||
@import './header';
|
||||
@import './keys';
|
||||
@import './loading';
|
||||
@import './socials';
|
||||
|
|
@ -1,124 +0,0 @@
|
|||
.keys {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-bottom: 60px;
|
||||
text-align: left;
|
||||
|
||||
$_this: &;
|
||||
|
||||
&-i {
|
||||
position: relative;
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
width: 33.33%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 15px 60px 15px;
|
||||
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
&:not(:first-child) {
|
||||
border-left: 1px solid #e1e1e1;
|
||||
}
|
||||
}
|
||||
|
||||
&-title {
|
||||
margin-bottom: 10px;
|
||||
@extend %title;
|
||||
}
|
||||
|
||||
&-hash {
|
||||
height: 30px;
|
||||
color: #6d2eae;
|
||||
line-height: 16px;
|
||||
font-size: 12px;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
&-hash-container {
|
||||
display: table;
|
||||
}
|
||||
|
||||
&-description {
|
||||
@extend %description;
|
||||
line-height: 18px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&-footer {
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
right: 15px;
|
||||
bottom: 0;
|
||||
|
||||
#{$_this}-i:first-child & {
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-download,
|
||||
&-read-more {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
&-download {
|
||||
@extend %btn;
|
||||
background-color: #6d2eae;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAANlBMVEX///////////////////////////////////////////////////////////////////////8BOg0gAAAAEXRSTlMASUtWV1hZXF1e5ebn6Orr/GN0dVoAAABnSURBVHja1cnJDYBADENRDzBsYYn7bxaCFFmMaADf/B+0YlbwNSPtE3jvv9Ad29DCsB0dVtKnN8xOGowhCdm5o/eUgOw+AktKQPYFkDygLglQhyRAXZLzWV2iLlFvRb2V7O3qeVa9C41xDOyv+UmuAAAAAElFTkSuQmCC);
|
||||
|
||||
&:hover {
|
||||
background-color: #5d2795;
|
||||
}
|
||||
}
|
||||
|
||||
&-read-more {
|
||||
margin-left: 10px;
|
||||
color: #6d2eae;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
&-note {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
border: 1px solid #6d2eae;
|
||||
border-radius: 5px;
|
||||
padding: 20px 15px 20px 53px;
|
||||
background-color: rgba(109, 46, 174, 0.1);
|
||||
color: #6d2eae;
|
||||
text-align: left;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 42px;
|
||||
background-color: #6d2eae;
|
||||
background-image: url(../images/warning.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
}
|
||||
|
||||
&-title {
|
||||
margin-bottom: 10px;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&-description {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,86 +0,0 @@
|
|||
@keyframes fadeOut {
|
||||
0% {
|
||||
opacity: .2;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
100% {
|
||||
opacity: .2;
|
||||
transform: scale(0.3);
|
||||
}
|
||||
}
|
||||
|
||||
.loading {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 206px;
|
||||
margin: -30px 0 0 -111.5px;
|
||||
padding-top: 50px;
|
||||
|
||||
&:before {
|
||||
@include image-2x('../images/loading@2x.png');
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 206px;
|
||||
height: 35px;
|
||||
background-image: url("../images/loading.png");
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
&-container {
|
||||
position: fixed;
|
||||
z-index: 1000000;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
background-color: fade-out(#231d73, 0.2);
|
||||
}
|
||||
|
||||
&-i {
|
||||
animation-duration: 2s;
|
||||
animation-fill-mode: forwards;
|
||||
animation-iteration-count: infinite;
|
||||
animation-name: fadeOut;
|
||||
animation-timing-function: linear;
|
||||
opacity:.2;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
|
||||
&:nth-child(2) {
|
||||
animation-delay: .1s;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
animation-delay: .2s;
|
||||
}
|
||||
|
||||
&:nth-child(4) {
|
||||
animation-delay: .3s;
|
||||
}
|
||||
|
||||
&:nth-child(5) {
|
||||
animation-delay: .4s;
|
||||
}
|
||||
|
||||
&:nth-child(6) {
|
||||
animation-delay: .5s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.waiting-container {
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
}
|
||||
|
|
@ -1,76 +0,0 @@
|
|||
.socials {
|
||||
font-size: 0;
|
||||
|
||||
.footer & {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&-i {
|
||||
transition: 0.3s background-color;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
background-color: fade-out(#fff, 0.8);
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: fade-out(#fff, 0.6);
|
||||
}
|
||||
|
||||
&:before {
|
||||
@include image-2x('../images/socials@2x.png', 16px, 69px);
|
||||
transform: translate(-50%, -50%);
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
background-image: url(../images/socials.png);
|
||||
}
|
||||
|
||||
&_github {
|
||||
&:before {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
&_oracles {
|
||||
&:before {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
background-position: 0 -16px;
|
||||
}
|
||||
}
|
||||
|
||||
&_reddit {
|
||||
&:before {
|
||||
width: 15px;
|
||||
height: 13px;
|
||||
background-position: 0 -30px;
|
||||
}
|
||||
}
|
||||
|
||||
&_telegram {
|
||||
&:before {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
background-position: 0 -43px;
|
||||
}
|
||||
}
|
||||
|
||||
&_twitter {
|
||||
&:before {
|
||||
width: 15px;
|
||||
height: 12px;
|
||||
background-position: 0 -57px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +1,11 @@
|
|||
import { constants } from './constants'
|
||||
import helpers from './helpers'
|
||||
//const local = {
|
||||
// const local = {
|
||||
// "KEYS_MANAGER_ADDRESS": "0x3ef32bb244016ad9af8c8f45398511e7e551b581"
|
||||
//}
|
||||
// }
|
||||
// module.exports = {
|
||||
// KEYS_MANAGER_ADDRESS: '0xfc90125492e58dbfe80c0bfb6a2a759c4f703ca8'
|
||||
// }
|
||||
|
||||
export default web3Config => {
|
||||
const branch = constants.NETWORKS[web3Config.netId].BRANCH
|
||||
|
|
@ -56,8 +56,8 @@ let getWeb3 = () => {
|
|||
console.log(`This is ${netIdName}`)
|
||||
} else {
|
||||
netIdName = 'ERROR'
|
||||
errorMsg = `You aren't connected to POA Network.
|
||||
Please switch on Metamask and refresh the page.
|
||||
errorMsg = `You aren't connected to POA Network.
|
||||
Please switch on Metamask and refresh the page.
|
||||
Check POA Network <a href='https://github.com/poanetwork/wiki' target='blank'>wiki</a> for more info.
|
||||
<b>Current Network ID</b> is <i>${netId}</i>`
|
||||
console.log('This is an unknown network.')
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import App from './App'
|
||||
import App from '../src/App'
|
||||
|
||||
it('renders without crashing', () => {
|
||||
const div = document.createElement('div')
|
||||
Loading…
Reference in New Issue