Restyling of warnings
This commit is contained in:
parent
cd2e66ffe1
commit
471df8cda0
|
@ -1,49 +1 @@
|
|||
<svg class="lds-spinner" width="200px" height="200px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" style="background: none;"><g transform="rotate(0 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.9166666666666666s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(30 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.8333333333333334s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(60 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.75s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(90 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.6666666666666666s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(120 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5833333333333334s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(150 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(180 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.4166666666666667s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(210 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.3333333333333333s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(240 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.25s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(270 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.16666666666666666s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(300 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.08333333333333333s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g><g transform="rotate(330 50 50)">
|
||||
<rect x="47" y="22.5" rx="4.7" ry="2.25" width="6" height="15" fill="#6729a8">
|
||||
<animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="0s" repeatCount="indefinite"></animate>
|
||||
</rect>
|
||||
</g></svg>
|
||||
<svg width="150px" height="150px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-ripple" style="background: none;"><circle cx="50" cy="50" r="29.6013" fill="none" ng-attr-stroke="{{config.c1}}" ng-attr-stroke-width="{{config.width}}" stroke="#6630a5" stroke-width="3"><animate attributeName="r" calcMode="spline" values="0;40" keyTimes="0;1" dur="2" keySplines="0 0.2 0.8 1" begin="-1s" repeatCount="indefinite"></animate><animate attributeName="opacity" calcMode="spline" values="1;0" keyTimes="0;1" dur="2" keySplines="0.2 0 0.8 1" begin="-1s" repeatCount="indefinite"></animate></circle><circle cx="50" cy="50" r="8.10015" fill="none" ng-attr-stroke="{{config.c2}}" ng-attr-stroke-width="{{config.width}}" stroke="#6630a5" stroke-width="3"><animate attributeName="r" calcMode="spline" values="0;40" keyTimes="0;1" dur="2" keySplines="0 0.2 0.8 1" begin="0s" repeatCount="indefinite"></animate><animate attributeName="opacity" calcMode="spline" values="1;0" keyTimes="0;1" dur="2" keySplines="0.2 0 0.8 1" begin="0s" repeatCount="indefinite"></animate></circle></svg>
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 1.1 KiB |
|
@ -1 +1,3 @@
|
|||
<svg height="32" viewBox="0 0 33 32" width="33" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="translate(-1 -1)"><path d="m20.1321134 3.85444772 12.4400695 22.74755558c.7949791 1.4536761.2609997 3.2765713-1.1926764 4.0715504-.4413776.2413784-.9363687.3678866-1.439437.3678866h-24.88013896c-1.65685425 0-3-1.3431457-3-3 0-.5030683.12650819-.9980594.36788658-1.439437l12.44006948-22.74755558c.7949791-1.4536761 2.6178743-1.98765551 4.0715504-1.19267639.503438.27531763.9173588.68923844 1.1926764 1.19267639z" stroke="#ff001f" stroke-width="2"/><g fill="#ff001f"><path d="m16 9h3v13h-3z"/><path d="m16 24h3v3h-3z"/></g></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="12">
|
||||
<path fill="#FF1345" fill-rule="evenodd" d="M13.877 10.689L7.735.418A.859.859 0 0 0 7 0a.859.859 0 0 0-.735.418L.123 10.689a.872.872 0 0 0-.012.871c.152.272.438.44.747.44h12.284a.857.857 0 0 0 .747-.44.872.872 0 0 0-.012-.871zM7.005 3.553c.352 0 .651.2.651.556 0 1.085-.127 2.645-.127 3.73 0 .283-.307.401-.524.401-.29 0-.534-.119-.534-.401 0-1.085-.127-2.645-.127-3.73 0-.356.29-.556.661-.556zm.009 6.721a.7.7 0 0 1-.697-.702c0-.383.299-.703.697-.703.37 0 .687.32.687.703 0 .373-.317.702-.687.702z"/>
|
||||
</svg>
|
||||
|
|
Before Width: | Height: | Size: 660 B After Width: | Height: | Size: 577 B |
|
@ -37,6 +37,8 @@ AccountImportSubview.prototype.render = function () {
|
|||
h('div', {
|
||||
style: {
|
||||
width: '100%',
|
||||
paddingLeft: '30px',
|
||||
paddingRight: '30px',
|
||||
},
|
||||
}, [
|
||||
h('.section-title.flex-row.flex-center', [
|
||||
|
@ -55,14 +57,13 @@ AccountImportSubview.prototype.render = function () {
|
|||
style: {
|
||||
display: 'inline-block',
|
||||
alignItems: 'center',
|
||||
padding: '5px 30px 0px 30px',
|
||||
},
|
||||
}, [
|
||||
h('span', 'Imported accounts will not be associated with your originally created Nifty Wallet account seedphrase.'),
|
||||
]),
|
||||
h('div', {
|
||||
style: {
|
||||
padding: '10px 30px',
|
||||
padding: '10px 0',
|
||||
},
|
||||
}, [
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@ class JsonImportSubview extends Component {
|
|||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
padding: '5px 30px 0px 30px',
|
||||
padding: '5px 0px 0px 0px',
|
||||
},
|
||||
}, [
|
||||
|
||||
|
@ -39,7 +39,7 @@ class JsonImportSubview extends Component {
|
|||
},
|
||||
}),
|
||||
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
placeholder: 'Enter password',
|
||||
id: 'json-password-box',
|
||||
|
|
|
@ -26,12 +26,12 @@ PrivateKeyImportView.prototype.render = function () {
|
|||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
padding: '5px 30px 0px 30px',
|
||||
padding: '5px 0px 0px 0px',
|
||||
},
|
||||
}, [
|
||||
h('span', 'Paste your private key string here'),
|
||||
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'private-key-box',
|
||||
onKeyPress: this.createKeyringOnEnter.bind(this),
|
||||
|
|
|
@ -54,13 +54,17 @@ AddTokenScreen.prototype.render = function () {
|
|||
h('h2.page-subtitle', 'Add Token'),
|
||||
]),
|
||||
|
||||
h('.error', {
|
||||
h('div', {
|
||||
style: {
|
||||
display: warning ? 'block' : 'none',
|
||||
padding: '0 20px',
|
||||
textAlign: 'center',
|
||||
margin: '0 30px',
|
||||
},
|
||||
}, warning),
|
||||
}, [
|
||||
h('.error', {
|
||||
style: {
|
||||
display: warning ? 'block' : 'none',
|
||||
},
|
||||
}, warning),
|
||||
]),
|
||||
|
||||
// conf view
|
||||
h('.flex-column.flex-justify-center.flex-grow.select-none', [
|
||||
|
|
|
@ -642,13 +642,7 @@ App.prototype.renderPrimary = function () {
|
|||
},
|
||||
}, 'QR Code'),
|
||||
]),
|
||||
h('div', {
|
||||
style: {
|
||||
position: 'absolute',
|
||||
left: '44px',
|
||||
width: '285px',
|
||||
},
|
||||
}, [
|
||||
h('div', [
|
||||
h(QrView, {key: 'qr'}),
|
||||
]),
|
||||
])
|
||||
|
|
|
@ -56,7 +56,6 @@ ExportAccountView.prototype.render = function () {
|
|||
color: '#333333',
|
||||
marginBottom: '0px',
|
||||
marginTop: '30px',
|
||||
textAlign: 'center',
|
||||
},
|
||||
}, warning),
|
||||
h('input#exportAccount.sizing-input', {
|
||||
|
@ -116,7 +115,7 @@ ExportAccountView.prototype.render = function () {
|
|||
},
|
||||
}, 'Your private key'),
|
||||
h('div.flex-row', [
|
||||
h('p.error', {
|
||||
h('p', {
|
||||
style: {
|
||||
paddingTop: '25px',
|
||||
textOverflow: 'ellipsis',
|
||||
|
|
|
@ -95,19 +95,23 @@ BnAsDecimalInput.prototype.render = function () {
|
|||
}, suffix),
|
||||
]),
|
||||
|
||||
state.invalid ? h('span.error', {
|
||||
state.invalid ? h('div', {
|
||||
style: {
|
||||
paddingLeft: '30px',
|
||||
paddingRight: '30px',
|
||||
background: 'rgba(255, 255, 255, 0.85)',
|
||||
position: 'absolute',
|
||||
right: '0px',
|
||||
textAlign: 'right',
|
||||
transform: 'translateY(26px)',
|
||||
padding: '3px',
|
||||
background: 'rgba(255,255,255,0.85)',
|
||||
zIndex: '1',
|
||||
textTransform: 'capitalize',
|
||||
border: '2px solid #E20202',
|
||||
top: '130px',
|
||||
left: '0px',
|
||||
},
|
||||
}, state.invalid) : null,
|
||||
}, [
|
||||
h('div.error', {
|
||||
style: {
|
||||
transform: 'translateY(26px)',
|
||||
zIndex: '1',
|
||||
},
|
||||
}, state.invalid),
|
||||
]) : null,
|
||||
])
|
||||
)
|
||||
}
|
||||
|
|
|
@ -76,72 +76,44 @@ Network.prototype.render = function () {
|
|||
switch (iconName) {
|
||||
case 'ethereum-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Main Network'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
case 'sokol-test-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Sokol Network'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
case 'ropsten-test-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Ropsten Test Net'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
case 'kovan-test-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Kovan Test Net'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
case 'rinkeby-test-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Rinkeby Test Net'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
case 'poa-network':
|
||||
return h('.network-indicator', [
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'POA Network'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
default:
|
||||
return h('.network-indicator', [
|
||||
|
||||
h('.network-name', {
|
||||
style: {
|
||||
paddingLeft: '9px',
|
||||
color: '#6729a8',
|
||||
}},
|
||||
h('.network-name',
|
||||
'Private Network'),
|
||||
props.onClick && h('i.fa.fa-caret-down.fa-lg'),
|
||||
])
|
||||
|
|
|
@ -93,7 +93,7 @@ Notice.prototype.render = function () {
|
|||
style: {
|
||||
background: '#542289',
|
||||
color: '#ffffff',
|
||||
height: '310px',
|
||||
height: '430px',
|
||||
width: '90%',
|
||||
overflowY: 'scroll',
|
||||
scroll: 'auto',
|
||||
|
|
|
@ -282,8 +282,9 @@ PendingTx.prototype.render = function () {
|
|||
position: 'absolute',
|
||||
top: '25px',
|
||||
background: 'rgba(255, 255, 255, 0.85)',
|
||||
border: '2px solid rgb(226, 2, 2)',
|
||||
width: '100%',
|
||||
paddingLeft: '30px',
|
||||
paddingRight: '30px',
|
||||
},
|
||||
}, [
|
||||
txMeta.simulationFails ?
|
||||
|
@ -303,7 +304,7 @@ PendingTx.prototype.render = function () {
|
|||
: null,
|
||||
|
||||
insufficientBalance ?
|
||||
h('span.error', {
|
||||
h('.error', {
|
||||
style: {
|
||||
fontSize: '12px',
|
||||
},
|
||||
|
@ -311,7 +312,7 @@ PendingTx.prototype.render = function () {
|
|||
: null,
|
||||
|
||||
(dangerousGasLimit && !gasLimitSpecified) ?
|
||||
h('span.error', {
|
||||
h('.error', {
|
||||
style: {
|
||||
fontSize: '12px',
|
||||
},
|
||||
|
|
|
@ -39,7 +39,6 @@ QrCodeView.prototype.render = function () {
|
|||
alignItems: 'center',
|
||||
},
|
||||
}, [
|
||||
Array.isArray(Qr.message) ? h('.message-container', this.renderMultiMessage()) : h('.qr-header', Qr.message),
|
||||
|
||||
this.props.warning ? this.props.warning && h('span.error.flex-center', {
|
||||
style: {
|
||||
|
@ -59,6 +58,7 @@ QrCodeView.prototype.render = function () {
|
|||
__html: qrImage.createTableTag(4),
|
||||
},
|
||||
}),
|
||||
Array.isArray(Qr.message) ? h('.message-container', this.renderMultiMessage()) : h('.qr-header', Qr.message),
|
||||
h('.flex-row', [
|
||||
h('h3.ellip-address', {
|
||||
style: {
|
||||
|
|
|
@ -26,7 +26,7 @@ TabBar.prototype.render = function () {
|
|||
},
|
||||
}, tabs.map((tab) => {
|
||||
const { key, content } = tab
|
||||
return h(subview === key ? '.activeForm' : '.inactiveForm.pointer', {
|
||||
return h(subview === key ? subview === 'history' ? '.activeForm.left' : '.activeForm.right' : '.inactiveForm.pointer', {
|
||||
onClick: () => {
|
||||
this.setState({ subview: key })
|
||||
tabSelected(key)
|
||||
|
|
|
@ -53,13 +53,17 @@ ConfigScreen.prototype.render = function () {
|
|||
h('h2.page-subtitle', 'Settings'),
|
||||
]),
|
||||
|
||||
h('.error', {
|
||||
h('div', {
|
||||
style: {
|
||||
display: warning ? 'block' : 'none',
|
||||
padding: '0 20px',
|
||||
textAlign: 'center',
|
||||
margin: '0 30px',
|
||||
},
|
||||
}, warning),
|
||||
}, [
|
||||
h('.error', {
|
||||
style: {
|
||||
display: warning ? 'block' : 'none',
|
||||
},
|
||||
}, warning),
|
||||
]),
|
||||
|
||||
// conf view
|
||||
h('.flex-column.flex-justify-center.flex-grow.select-none', [
|
||||
|
|
|
@ -221,6 +221,8 @@ textarea.twelve-word-phrase {
|
|||
width: 5.2em;
|
||||
line-height: 9px;
|
||||
text-rendering: geometricPrecision;
|
||||
padding-left: 9px;
|
||||
color: #6729a8;
|
||||
}
|
||||
|
||||
.check {
|
||||
|
@ -258,8 +260,18 @@ app sections
|
|||
|
||||
/* unlock */
|
||||
.error {
|
||||
color: #db60a4;
|
||||
margin-bottom: 9px;
|
||||
border: 1px solid #ff1345 !important;
|
||||
color: #ff1345 !important;
|
||||
font-size: 12px;
|
||||
background: rgba(255,19,69, 0.1);
|
||||
border-radius: 3px;
|
||||
text-align: left;
|
||||
padding: 10px 10px 10px 34px;
|
||||
background-image: url('../images/warning.svg');
|
||||
background-position: 10px 10px;
|
||||
background-repeat: no-repeat;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.warning {
|
||||
|
@ -751,6 +763,14 @@ input.large-input {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.activeForm.left {
|
||||
border-radius: 0px 8px 0px 0px;
|
||||
}
|
||||
|
||||
.activeForm.right {
|
||||
border-radius: 8px 0px 0px 0px;
|
||||
}
|
||||
|
||||
.inactiveForm {
|
||||
background: #60269c;
|
||||
color: #ffffff;
|
||||
|
@ -822,7 +842,7 @@ input.large-input {
|
|||
.qr-header {
|
||||
font-family: "Nunito SemiBold";
|
||||
font-size: 16px;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.qr-message {
|
||||
|
|
|
@ -85,10 +85,17 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
|
|||
]),
|
||||
]),
|
||||
|
||||
h('span.in-progress-notification', state.warning),
|
||||
state.warning ? h('div', {
|
||||
style: {
|
||||
width: '260px',
|
||||
padding: '20px 0 0',
|
||||
},
|
||||
}, [
|
||||
h('div.error', state.warning),
|
||||
]) : null,
|
||||
|
||||
// password
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'password-box',
|
||||
placeholder: 'New Password (min 8 chars)',
|
||||
|
@ -101,7 +108,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
|
|||
}),
|
||||
|
||||
// confirm password
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'password-box-confirm',
|
||||
placeholder: 'Confirm Password',
|
||||
|
@ -128,7 +135,6 @@ InitializeMenuScreen.prototype.renderMenu = function (state) {
|
|||
style: {
|
||||
fontSize: '0.8em',
|
||||
color: '#8fdc97',
|
||||
textDecoration: 'underline',
|
||||
},
|
||||
}, 'Import Existing DEN'),
|
||||
]),
|
||||
|
|
|
@ -52,7 +52,7 @@ CreateVaultCompleteScreen.prototype.render = function () {
|
|||
textAlign: 'center',
|
||||
},
|
||||
}, [
|
||||
h('span.error', 'These 12 words are the only way to restore your Nifty Wallet accounts.\nSave them somewhere safe and secret.'),
|
||||
h('div.error', 'These 12 words are the only way to restore your Nifty Wallet accounts.\nSave them somewhere safe and secret.'),
|
||||
]),
|
||||
|
||||
h('textarea.twelve-word-phrase', {
|
||||
|
|
|
@ -49,10 +49,10 @@ RevealSeedConfirmation.prototype.render = function () {
|
|||
},
|
||||
}, [
|
||||
|
||||
h('h4', 'Do not recover your seed words in a public place! These words can be used to steal all your accounts.'),
|
||||
h('.error', 'Do not recover your seed words in a public place! These words can be used to steal all your accounts.'),
|
||||
|
||||
// confirmation
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'password-box',
|
||||
placeholder: 'Enter your password to confirm',
|
||||
|
@ -65,7 +65,7 @@ RevealSeedConfirmation.prototype.render = function () {
|
|||
(props.warning) && (
|
||||
h('span.error', {
|
||||
style: {
|
||||
margin: '20px',
|
||||
margin: '20px 0',
|
||||
},
|
||||
}, props.warning.split('-'))
|
||||
),
|
||||
|
|
|
@ -24,7 +24,12 @@ RestoreVaultScreen.prototype.render = function () {
|
|||
|
||||
return (
|
||||
|
||||
h('.initialize-screen.flex-column.flex-center.flex-grow', [
|
||||
h('.initialize-screen.flex-column.flex-center.flex-grow', {
|
||||
style: {
|
||||
paddingLeft: '30px',
|
||||
paddingRight: '30px',
|
||||
},
|
||||
}, [
|
||||
|
||||
h('h3.flex-center.section-title', {
|
||||
style: {
|
||||
|
@ -45,15 +50,14 @@ RestoreVaultScreen.prototype.render = function () {
|
|||
style: {
|
||||
width: '100%',
|
||||
marginBottom: '20px',
|
||||
marginLeft: '60px',
|
||||
},
|
||||
}, 'Wallet Seed'),
|
||||
h('textarea.twelve-word-phrase.letter-spacey', {
|
||||
h('textarea.twelve-word-phrase', {
|
||||
placeholder: 'Enter your secret twelve word phrase here to restore your vault.',
|
||||
}),
|
||||
|
||||
// password
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'password-box',
|
||||
placeholder: 'New Password (min 8 chars)',
|
||||
|
@ -61,14 +65,14 @@ RestoreVaultScreen.prototype.render = function () {
|
|||
persistentFormId: 'password',
|
||||
},
|
||||
style: {
|
||||
width: 300,
|
||||
width: '100%',
|
||||
marginTop: 20,
|
||||
border: '1px solid #e2e2e2',
|
||||
},
|
||||
}),
|
||||
|
||||
// confirm password
|
||||
h('input.large-input.letter-spacey', {
|
||||
h('input.large-input', {
|
||||
type: 'password',
|
||||
id: 'password-box-confirm',
|
||||
placeholder: 'Confirm Password',
|
||||
|
@ -77,14 +81,21 @@ RestoreVaultScreen.prototype.render = function () {
|
|||
persistentFormId: 'password-confirmation',
|
||||
},
|
||||
style: {
|
||||
width: 300,
|
||||
width: '100%',
|
||||
marginTop: 20,
|
||||
border: '1px solid #e2e2e2',
|
||||
},
|
||||
}),
|
||||
|
||||
(state.warning) && (
|
||||
h('span.error.in-progress-notification', state.warning)
|
||||
h('div', {
|
||||
style: {
|
||||
padding: '20px 0 0',
|
||||
width: '100%',
|
||||
},
|
||||
}, [
|
||||
h('div.error.in-progress-notification', state.warning),
|
||||
])
|
||||
),
|
||||
|
||||
// submit
|
||||
|
@ -93,7 +104,6 @@ RestoreVaultScreen.prototype.render = function () {
|
|||
style: {
|
||||
marginTop: 20,
|
||||
width: '100%',
|
||||
marginRight: '60px',
|
||||
},
|
||||
}, [
|
||||
|
||||
|
|
|
@ -70,8 +70,6 @@ UnlockScreen.prototype.render = function () {
|
|||
h('.error', {
|
||||
style: {
|
||||
display: warning ? 'block' : 'none',
|
||||
padding: '0 20px',
|
||||
textAlign: 'center',
|
||||
},
|
||||
}, warning),
|
||||
]),
|
||||
|
|
Loading…
Reference in New Issue