From 032582afda6ecd4a0dedef11c67828eb135cf118 Mon Sep 17 00:00:00 2001 From: frankiebee Date: Tue, 31 Oct 2017 14:02:02 -0500 Subject: mascara:first-time - add alpha warning and a about metamask and mascot --- .../src/app/first-time/create-password-screen.js | 119 +++++++++++++-------- mascara/src/app/first-time/index.css | 35 +++++- 2 files changed, 107 insertions(+), 47 deletions(-) (limited to 'mascara') diff --git a/mascara/src/app/first-time/create-password-screen.js b/mascara/src/app/first-time/create-password-screen.js index 2f4b81e7c..b1c2581a1 100644 --- a/mascara/src/app/first-time/create-password-screen.js +++ b/mascara/src/app/first-time/create-password-screen.js @@ -1,8 +1,10 @@ +import EventEmitter from 'events' import React, {Component, PropTypes} from 'react' import {connect} from 'react-redux'; import {createNewVaultAndKeychain} from '../../../../ui/app/actions' import LoadingScreen from './loading-screen' import Breadcrumbs from './breadcrumbs' +import Mascot from '../../../../ui/app/components/mascot' class CreatePasswordScreen extends Component { static propTypes = { @@ -18,6 +20,11 @@ class CreatePasswordScreen extends Component { confirmPassword: '' } + constructor () { + super() + this.animationEventEmitter = new EventEmitter() + } + isValid() { const {password, confirmPassword} = this.state; @@ -50,52 +57,74 @@ class CreatePasswordScreen extends Component { return isLoading ? : ( -
-
- Create Password +
+

Warning This is Experemental software and is a Developer Alapha

+
+
+ +
+ MetaMask is a bridge that allows you to visit the distributed web + of tomorrow in your browser today. It allows you to run Ethereum dApps right in + your browser without running a full Ethereum node but still gives + you the option to if you want to bring your own. + + MetaMask includes a secure identity vault stored loacly on your machine, + providing a user interface to manage your identities on different sites + and sign blockchain transactions +
+
+
+
+ Create Password +
+ this.setState({password: e.target.value})} + /> + this.setState({confirmPassword: e.target.value})} + /> + + { + e.preventDefault() + goToImportWithSeedPhrase() + }} + > + Import with seed phrase + + { /* } + { + e.preventDefault() + goToImportAccount() + }} + > + Import an account + + { */ } + +
- this.setState({password: e.target.value})} - /> - this.setState({confirmPassword: e.target.value})} - /> - - { - e.preventDefault() - goToImportWithSeedPhrase() - }} - > - Import with seed phrase - - { /* } - { - e.preventDefault() - goToImportAccount() - }} - > - Import an account - - { */ } -
) } diff --git a/mascara/src/app/first-time/index.css b/mascara/src/app/first-time/index.css index 28aa3060a..c55edd79a 100644 --- a/mascara/src/app/first-time/index.css +++ b/mascara/src/app/first-time/index.css @@ -1,3 +1,4 @@ + .first-time-flow { height: 100vh; width: 100vw; @@ -5,6 +6,36 @@ overflow: auto; } +.alpha-warning { + background: #f7861c; + color: #fff; + line-height: 2em; + padding-left: 2em; +} + +.first-view-main { + display: flex; + flex-direction: row-reverse; + justify-content: space-between; +} + +.mascara-info { + display: flex; + flex-flow: column; + margin-top: 70px; + margin-right: 10vw; + width: 35vw; + max-width: 550px; +} + +.mascara-info :first-child { + align-self: flex-end; +} + +.info { + font-size: 19px; +} + .create-password, .unique-image, .tou, @@ -75,7 +106,7 @@ .backup-phrase__tips { margin: 40px 0 !important; - width: initial !important; + width: initial !important; } .backup-phrase__confirm-secret, @@ -337,7 +368,7 @@ button.backup-phrase__confirm-seed-option:hover { padding: 14px 21px; appearance: none; -webkit-appearance: none; - -moz-appearance: none; + -moz-appearance: none; cursor: pointer; } -- cgit v1.2.3 From 81af91371db91eb4059c9283b63d3e253c2e8d17 Mon Sep 17 00:00:00 2001 From: frankiebee Date: Tue, 31 Oct 2017 14:26:17 -0500 Subject: mascara:first-time - fix wording --- mascara/src/app/first-time/create-password-screen.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'mascara') diff --git a/mascara/src/app/first-time/create-password-screen.js b/mascara/src/app/first-time/create-password-screen.js index b1c2581a1..e5bfc1af4 100644 --- a/mascara/src/app/first-time/create-password-screen.js +++ b/mascara/src/app/first-time/create-password-screen.js @@ -68,11 +68,11 @@ class CreatePasswordScreen extends Component { />
MetaMask is a bridge that allows you to visit the distributed web - of tomorrow in your browser today. It allows you to run Ethereum dApps right in + of tomorrow in your browser today. It allows you to run Ethereum Apps right in your browser without running a full Ethereum node but still gives you the option to if you want to bring your own. - MetaMask includes a secure identity vault stored loacly on your machine, + MetaMask includes a secure identity vault stored locally on your machine, providing a user interface to manage your identities on different sites and sign blockchain transactions
-- cgit v1.2.3 From 910c69f6553fa433853684a17a6ff5c6df570ade Mon Sep 17 00:00:00 2001 From: frankiebee Date: Thu, 2 Nov 2017 12:24:50 -0500 Subject: mascara - fix words and enviroment vars --- mascara/src/app/first-time/create-password-screen.js | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) (limited to 'mascara') diff --git a/mascara/src/app/first-time/create-password-screen.js b/mascara/src/app/first-time/create-password-screen.js index e5bfc1af4..c852df9cf 100644 --- a/mascara/src/app/first-time/create-password-screen.js +++ b/mascara/src/app/first-time/create-password-screen.js @@ -67,14 +67,10 @@ class CreatePasswordScreen extends Component { height="225" />
- MetaMask is a bridge that allows you to visit the distributed web - of tomorrow in your browser today. It allows you to run Ethereum Apps right in - your browser without running a full Ethereum node but still gives - you the option to if you want to bring your own. - - MetaMask includes a secure identity vault stored locally on your machine, - providing a user interface to manage your identities on different sites - and sign blockchain transactions + MetaMask is a secure identity vault for Ethereum. +
+
+ It allows you to hold ether & tokens, and interact with decentralized applications.
-- cgit v1.2.3 From a89b682dec350218b2d753d6cfb196f965acdde2 Mon Sep 17 00:00:00 2001 From: frankiebee Date: Mon, 6 Nov 2017 12:48:58 -0500 Subject: mascara:create-password - use less words in metamask explanation --- mascara/src/app/first-time/create-password-screen.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'mascara') diff --git a/mascara/src/app/first-time/create-password-screen.js b/mascara/src/app/first-time/create-password-screen.js index c852df9cf..21d29d72b 100644 --- a/mascara/src/app/first-time/create-password-screen.js +++ b/mascara/src/app/first-time/create-password-screen.js @@ -58,7 +58,7 @@ class CreatePasswordScreen extends Component { ? : (
-

Warning This is Experemental software and is a Developer Alapha

+

Warning This is Experemental software and is a Developer BETA

Date: Fri, 29 Dec 2017 10:37:37 -0800 Subject: Fix mascara first time flow button colors --- mascara/src/app/first-time/index.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'mascara') diff --git a/mascara/src/app/first-time/index.css b/mascara/src/app/first-time/index.css index 28aa3060a..2248c0438 100644 --- a/mascara/src/app/first-time/index.css +++ b/mascara/src/app/first-time/index.css @@ -75,7 +75,7 @@ .backup-phrase__tips { margin: 40px 0 !important; - width: initial !important; + width: initial !important; } .backup-phrase__confirm-secret, @@ -337,7 +337,7 @@ button.backup-phrase__confirm-seed-option:hover { padding: 14px 21px; appearance: none; -webkit-appearance: none; - -moz-appearance: none; + -moz-appearance: none; cursor: pointer; } @@ -540,10 +540,10 @@ button.backup-phrase__confirm-seed-option:hover { text-transform: uppercase; margin: 35px 0 14px; transition: 200ms ease-in-out; + background-color: rgba(247, 134, 28, 0.9); } button.first-time-flow__button[disabled] { - background-color: rgba(247, 134, 28, 0.9); opacity: .6; } -- cgit v1.2.3 From 41057a76c567a80f98ff17e5d7a24c9500c11e4c Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Thu, 11 Jan 2018 22:45:22 -0330 Subject: [NewUI] Build mascara with uglification and gzipping. (#2735) * Adds uglification and gzipping. * Build mascara with uglification and gzipping. * Remove gzipping from extension build. --- mascara/server/index.js | 3 +++ mascara/server/util.js | 4 +++- 2 files changed, 6 insertions(+), 1 deletion(-) (limited to 'mascara') diff --git a/mascara/server/index.js b/mascara/server/index.js index 83f84f6d1..6fb1287cc 100644 --- a/mascara/server/index.js +++ b/mascara/server/index.js @@ -2,6 +2,7 @@ const path = require('path') const express = require('express') const createBundle = require('./util').createBundle const serveBundle = require('./util').serveBundle +const compression = require('compression') module.exports = createMetamascaraServer @@ -16,6 +17,8 @@ function createMetamascaraServer () { // serve bundles const server = express() + server.use(compression()) + // ui window serveBundle(server, '/ui.js', uiBundle) server.use(express.static(path.join(__dirname, '/../ui/'), { setHeaders: (res) => res.set('X-Frame-Options', 'DENY') })) diff --git a/mascara/server/util.js b/mascara/server/util.js index af2daddb9..f9692afb6 100644 --- a/mascara/server/util.js +++ b/mascara/server/util.js @@ -23,7 +23,9 @@ function createBundle (entryPoint) { cache: {}, packageCache: {}, plugin: [watchify], - }).transform('babelify') + }) + .transform('babelify') + .transform('uglifyify', { global: true }) bundler.on('update', bundle) bundle() -- cgit v1.2.3