Fix create/join/import form UI for switches and wide screen
This commit is contained in:
Gustavo Maximiliano Cortez
parent
dc37bcc28e
commit
c27d7c2c5e
5 changed files with 147 additions and 141 deletions
|
|
@ -8,10 +8,10 @@
|
|||
|
||||
<div class="create-tab small-only-text-center" ng-hide="create.hideTabs">
|
||||
<div class="row">
|
||||
<div class="tab-container small-6 medium-3 large-2" ng-class="{'selected': totalCopayers == 1}">
|
||||
<div class="tab-container small-6 medium-6 large-6" ng-class="{'selected': totalCopayers == 1}">
|
||||
<a href ng-click="create.setTotalCopayers(1)" translate>Personal Wallet</a>
|
||||
</div>
|
||||
<div class="tab-container small-6 medium-3 large-2" ng-class="{'selected': totalCopayers != 1}">
|
||||
<div class="tab-container small-6 medium-6 large-6" ng-class="{'selected': totalCopayers != 1}">
|
||||
<a href ng-click="create.setTotalCopayers(3)" translate>Shared Wallet</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -58,7 +58,7 @@
|
|||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny" ng-click="hideAdv=!hideAdv">
|
||||
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
|
|
@ -134,19 +134,17 @@
|
|||
</label>
|
||||
</div>
|
||||
<div class="oh" ng-show="create.seedSourceId == 'new'">
|
||||
<label for="network-name" class="dbi">
|
||||
<span>Testnet</span>
|
||||
<ion-toggle ng-model="testnetEnabled" toggle-class="toggle-balanced" class="bct">
|
||||
</ion-toggle>
|
||||
</label>
|
||||
<ion-toggle ng-model="testnetEnabled" toggle-class="toggle-balanced" class="bct">
|
||||
<span class="toggle-label">Testnet</span>
|
||||
</ion-toggle>
|
||||
</div>
|
||||
<div class="oh" ng-show="create.seedSourceId == 'new'">
|
||||
<label for="single-address" class="dbi">
|
||||
<span class="db" translate>Single Address Wallet</span>
|
||||
<small translate>For audit purposes</small>
|
||||
<ion-toggle ng-model="singleAddressEnabled" toggle-class="toggle-balanced" class="bct">
|
||||
</ion-toggle>
|
||||
</label>
|
||||
<ion-toggle ng-model="singleAddressEnabled" toggle-class="toggle-balanced" class="bct">
|
||||
<div class="toggle-label">
|
||||
<span class="db" translate>Single Address Wallet</span>
|
||||
<small translate>For audit purposes</small>
|
||||
</div>
|
||||
</ion-toggle>
|
||||
</div>
|
||||
</div> <!-- columns -->
|
||||
</div> <!-- advanced -->
|
||||
|
|
|
|||
|
|
@ -21,93 +21,98 @@
|
|||
|
||||
<div ng-show="type == '12' ">
|
||||
|
||||
<div class="box-notification m20b" ng-show="import.importErr">
|
||||
<div ng-show="import.importErr" class="text-warning">
|
||||
<div class="m10 text-bold" translate>Could not access the wallet at the server. Please check:</div>
|
||||
<ul class="size-12">
|
||||
<li translate>The password of the recovery phrase (if set)
|
||||
</li>
|
||||
<li translate>The derivation path
|
||||
</li>
|
||||
<li translate>The wallet service URL
|
||||
</ul>
|
||||
<div class="m15l">
|
||||
<span translate>NOTE: To import a wallet from a 3rd party software, please go to Add Wallet > Create Wallet, and specify the Recovery Phrase there.</span><br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<div class="text-warning">
|
||||
{{import.error|translate}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row large-12 columns">
|
||||
<form name="importForm12" ng-submit="import.importMnemonic(importForm12)" novalidate>
|
||||
|
||||
<div >
|
||||
<label for="words">
|
||||
<span translate>Type the Recovery Phrase (usually 12 words)</span>:
|
||||
</label>
|
||||
<textarea class="form-control" name="words" ng-model="import.words" rows="2" autocapitalize="off" spellcheck="false"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
|
||||
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div ng-hide="hideAdv" class="row">
|
||||
<div class="large-12 columns">
|
||||
|
||||
<label for="passphrase" class="oh"><span translate>Password</span> <small translate>The Wallet Recovery Phrase could require a password to be imported</small>
|
||||
<div class="input">
|
||||
<input type="password" class="form-control" placeholder="{{'Password'|translate}}"
|
||||
name="passphrase" ng-model="import.passphrase">
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div>
|
||||
<label class="oh"><span translate>Derivation Path</span> <small translate>BIP32 path for address derivation</small>
|
||||
<input type="text" class="form-control" name="derivationPath" ng-model="derivationPath">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<label for="bws" class="oh">
|
||||
<span>Wallet Service URL</span>
|
||||
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
|
||||
</label>
|
||||
|
||||
<div class="oh">
|
||||
<label for="network-name" class="dbi">
|
||||
<span>Testnet</span>
|
||||
<ion-toggle ng-model="testnetEnabled" ng-change="setDerivationPath()" toggle-class="toggle-balanced" class="bct">
|
||||
</ion-toggle>
|
||||
</label>
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<div class="box-notification m20b" ng-show="import.importErr">
|
||||
<div ng-show="import.importErr" class="text-warning">
|
||||
<div class="m10 text-bold" translate>Could not access the wallet at the server. Please check:</div>
|
||||
<ul class="size-12">
|
||||
<li translate>The password of the recovery phrase (if set)
|
||||
</li>
|
||||
<li translate>The derivation path
|
||||
</li>
|
||||
<li translate>The wallet service URL
|
||||
</ul>
|
||||
<div class="m15l">
|
||||
<span translate>NOTE: To import a wallet from a 3rd party software, please go to Add Wallet > Create Wallet, and specify the Recovery Phrase there.</span><br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button translate type="submit" class="button round expand black m10t"
|
||||
ng-disabled="importForm12.$invalid ">
|
||||
Import
|
||||
</button>
|
||||
</form>
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<div class="text-warning">
|
||||
{{import.error|translate}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<form name="importForm12" ng-submit="import.importMnemonic(importForm12)" novalidate>
|
||||
|
||||
<div >
|
||||
<label for="words">
|
||||
<span translate>Type the Recovery Phrase (usually 12 words)</span>:
|
||||
</label>
|
||||
<textarea class="form-control" name="words" ng-model="import.words" rows="2" autocapitalize="off" spellcheck="false"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
|
||||
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div ng-hide="hideAdv" class="row">
|
||||
<div class="large-12 columns">
|
||||
|
||||
<label for="passphrase" class="oh"><span translate>Password</span> <small translate>The Wallet Recovery Phrase could require a password to be imported</small>
|
||||
<div class="input">
|
||||
<input type="password" class="form-control" placeholder="{{'Password'|translate}}"
|
||||
name="passphrase" ng-model="import.passphrase">
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div>
|
||||
<label class="oh"><span translate>Derivation Path</span> <small translate>BIP32 path for address derivation</small>
|
||||
<input type="text" class="form-control" name="derivationPath" ng-model="derivationPath">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<label for="bws" class="oh">
|
||||
<span>Wallet Service URL</span>
|
||||
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
|
||||
</label>
|
||||
|
||||
<div class="oh">
|
||||
<ion-toggle ng-model="testnetEnabled" ng-change="setDerivationPath()" toggle-class="toggle-balanced" class="bct">
|
||||
<span class="toggle-label">Testnet</span>
|
||||
</ion-toggle>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button translate type="submit" class="button round expand black m10t"
|
||||
ng-disabled="importForm12.$invalid ">
|
||||
Import
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="type == 'file' ">
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<span class="text-warning size-14">
|
||||
{{import.error|translate}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="row large-12 columns">
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<span class="text-warning size-14">
|
||||
{{import.error|translate}}
|
||||
</span>
|
||||
</div>
|
||||
<form name="importForm" ng-submit="import.importBlob(importForm)" novalidate>
|
||||
|
||||
<div ng-show="!index.isSafari && !index.isCordova" class="line-b m10b">
|
||||
|
|
@ -133,7 +138,7 @@
|
|||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny" ng-click="hideAdv=!hideAdv">
|
||||
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
|
|
@ -156,72 +161,74 @@
|
|||
Import backup
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="type == 'hwWallet'">
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<span class="text-warning size-14">
|
||||
{{import.error|translate}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="row large-12 columns">
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<div class="box-notification m20b" ng-show="import.error">
|
||||
<span class="text-warning size-14">
|
||||
{{import.error|translate}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<form name="importForm3" ng-submit="import.importHW(importForm3)" novalidate>
|
||||
<div class="large-12 columns">
|
||||
<div ng-show="!import.seedOptions[0]">
|
||||
<span translate>No hardware wallets supported on this device</span>
|
||||
</div>
|
||||
<div ng-show="import.seedOptions[0]">
|
||||
<div>
|
||||
<label><span translate>Wallet Recovery Phrase</span>
|
||||
<select class="m10t" ng-model="seedSource"
|
||||
ng-options="seed as seed.label for seed in import.seedOptions"
|
||||
ng-change="import.setSeedSource()">
|
||||
</select>
|
||||
</label>
|
||||
<form name="importForm3" ng-submit="import.importHW(importForm3)" novalidate>
|
||||
<div class="large-12 columns">
|
||||
<div ng-show="!import.seedOptions[0]">
|
||||
<span translate>No hardware wallets supported on this device</span>
|
||||
</div>
|
||||
|
||||
<div ng-show="import.seedSourceId == 'trezor' || import.seedSourceId == 'ledger'">
|
||||
|
||||
<label class="oh"><span translate>Account Number</span>
|
||||
<input type="number" id="account" ng-model="account">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div ng-show="import.seedSourceId == 'trezor'">
|
||||
<label for="isMultisig" class="oh">
|
||||
<span translate>Shared Wallet</span>
|
||||
<switch id="isMultisig" name="isMultisig" ng-model="isMultisig" class="green right m5t m10b"></switch>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
|
||||
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div ng-hide="hideAdv" class="row">
|
||||
<div class="large-12 columns">
|
||||
|
||||
<label for="bws" class="oh">
|
||||
<span>Wallet Service URL</span>
|
||||
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
|
||||
<div ng-show="import.seedOptions[0]">
|
||||
<div>
|
||||
<label><span translate>Wallet Recovery Phrase</span>
|
||||
<select class="m10t" ng-model="seedSource"
|
||||
ng-options="seed as seed.label for seed in import.seedOptions"
|
||||
ng-change="import.setSeedSource()">
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="import.seedSourceId == 'trezor' || import.seedSourceId == 'ledger'">
|
||||
|
||||
<label class="oh"><span translate>Account Number</span>
|
||||
<input type="number" id="account" ng-model="account">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="oh" ng-show="import.seedSourceId == 'trezor'">
|
||||
<ion-toggle ng-model="isMultisig" toggle-class="toggle-balanced" class="bct">
|
||||
<span class="toggle-label" translate>Shared Wallet</span>
|
||||
</ion-toggle>
|
||||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
|
||||
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div ng-hide="hideAdv" class="row">
|
||||
<div class="large-12 columns">
|
||||
|
||||
<label for="bws" class="oh">
|
||||
<span>Wallet Service URL</span>
|
||||
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<button translate type="submit" class="button round expand black">
|
||||
Import
|
||||
</button>
|
||||
</div> <!-- seedoptions show -->
|
||||
</div>
|
||||
</form>
|
||||
<button translate type="submit" class="button round expand black">
|
||||
Import
|
||||
</button>
|
||||
</div> <!-- seedoptions show -->
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
</div>
|
||||
|
||||
<div class="m10t oh" ng-init="hideAdv=true">
|
||||
<a class="button outline light-gray expand tiny" ng-click="hideAdv=!hideAdv">
|
||||
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
|
||||
<i class="fi-widget m3r"></i>
|
||||
<span translate ng-hide="!hideAdv">Show advanced options</span>
|
||||
<span translate ng-hide="hideAdv">Hide advanced options</span>
|
||||
|
|
|
|||
|
|
@ -61,10 +61,7 @@
|
|||
|
||||
.bct {
|
||||
background-color: transparent !important;
|
||||
margin-top: -25px;
|
||||
padding-bottom: 30px;
|
||||
right: -24px !important;
|
||||
border-width: 0px;
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
|
||||
.r0 {
|
||||
|
|
|
|||
|
|
@ -715,6 +715,10 @@ ul.manage li {
|
|||
padding: 10px;
|
||||
}
|
||||
|
||||
.p10i {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.p10b {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue