Fix create/join/import form UI for switches and wide screen

This commit is contained in:
Gustavo Maximiliano Cortez 2016-06-23 17:42:05 -03:00
commit c27d7c2c5e
No known key found for this signature in database
GPG key ID: 15EDAD8D9F2EB1AF
5 changed files with 147 additions and 141 deletions

View file

@ -8,10 +8,10 @@
<div class="create-tab small-only-text-center" ng-hide="create.hideTabs"> <div class="create-tab small-only-text-center" ng-hide="create.hideTabs">
<div class="row"> <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> <a href ng-click="create.setTotalCopayers(1)" translate>Personal Wallet</a>
</div> </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> <a href ng-click="create.setTotalCopayers(3)" translate>Shared Wallet</a>
</div> </div>
</div> </div>
@ -58,7 +58,7 @@
</div> </div>
<div class="m10t oh" ng-init="hideAdv=true"> <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> <i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span> <span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span> <span translate ng-hide="hideAdv">Hide advanced options</span>
@ -134,19 +134,17 @@
</label> </label>
</div> </div>
<div class="oh" ng-show="create.seedSourceId == 'new'"> <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 ng-model="testnetEnabled" toggle-class="toggle-balanced" class="bct">
<span class="toggle-label">Testnet</span>
</ion-toggle> </ion-toggle>
</label>
</div> </div>
<div class="oh" ng-show="create.seedSourceId == 'new'"> <div class="oh" ng-show="create.seedSourceId == 'new'">
<label for="single-address" class="dbi"> <ion-toggle ng-model="singleAddressEnabled" toggle-class="toggle-balanced" class="bct">
<div class="toggle-label">
<span class="db" translate>Single Address Wallet</span> <span class="db" translate>Single Address Wallet</span>
<small translate>For audit purposes</small> <small translate>For audit purposes</small>
<ion-toggle ng-model="singleAddressEnabled" toggle-class="toggle-balanced" class="bct"> </div>
</ion-toggle> </ion-toggle>
</label>
</div> </div>
</div> <!-- columns --> </div> <!-- columns -->
</div> <!-- advanced --> </div> <!-- advanced -->

View file

@ -21,6 +21,8 @@
<div ng-show="type == '12' "> <div ng-show="type == '12' ">
<div class="row">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="import.importErr"> <div class="box-notification m20b" ng-show="import.importErr">
<div ng-show="import.importErr" class="text-warning"> <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> <div class="m10 text-bold" translate>Could not access the wallet at the server. Please check:</div>
@ -42,8 +44,11 @@
{{import.error|translate}} {{import.error|translate}}
</div> </div>
</div> </div>
</div>
</div>
<div class="row large-12 columns"> <div class="row">
<div class="large-12 columns">
<form name="importForm12" ng-submit="import.importMnemonic(importForm12)" novalidate> <form name="importForm12" ng-submit="import.importMnemonic(importForm12)" novalidate>
<div > <div >
@ -54,7 +59,7 @@
</div> </div>
<div class="m10t oh" ng-init="hideAdv=true"> <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> <i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span> <span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span> <span translate ng-hide="hideAdv">Hide advanced options</span>
@ -84,11 +89,9 @@
</label> </label>
<div class="oh"> <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 ng-model="testnetEnabled" ng-change="setDerivationPath()" toggle-class="toggle-balanced" class="bct">
<span class="toggle-label">Testnet</span>
</ion-toggle> </ion-toggle>
</label>
</div> </div>
</div> </div>
</div> </div>
@ -100,14 +103,16 @@
</form> </form>
</div> </div>
</div> </div>
</div>
<div ng-show="type == 'file' "> <div ng-show="type == 'file' ">
<div class="row">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="import.error"> <div class="box-notification m20b" ng-show="import.error">
<span class="text-warning size-14"> <span class="text-warning size-14">
{{import.error|translate}} {{import.error|translate}}
</span> </span>
</div> </div>
<div class="row large-12 columns">
<form name="importForm" ng-submit="import.importBlob(importForm)" novalidate> <form name="importForm" ng-submit="import.importBlob(importForm)" novalidate>
<div ng-show="!index.isSafari && !index.isCordova" class="line-b m10b"> <div ng-show="!index.isSafari && !index.isCordova" class="line-b m10b">
@ -133,7 +138,7 @@
</div> </div>
<div class="m10t oh" ng-init="hideAdv=true"> <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> <i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span> <span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span> <span translate ng-hide="hideAdv">Hide advanced options</span>
@ -158,14 +163,16 @@
</form> </form>
</div> </div>
</div> </div>
</div>
<div ng-show="type == 'hwWallet'"> <div ng-show="type == 'hwWallet'">
<div class="row">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="import.error"> <div class="box-notification m20b" ng-show="import.error">
<span class="text-warning size-14"> <span class="text-warning size-14">
{{import.error|translate}} {{import.error|translate}}
</span> </span>
</div> </div>
<div class="row large-12 columns">
<form name="importForm3" ng-submit="import.importHW(importForm3)" novalidate> <form name="importForm3" ng-submit="import.importHW(importForm3)" novalidate>
<div class="large-12 columns"> <div class="large-12 columns">
@ -189,15 +196,14 @@
</label> </label>
</div> </div>
<div ng-show="import.seedSourceId == 'trezor'"> <div class="oh" ng-show="import.seedSourceId == 'trezor'">
<label for="isMultisig" class="oh"> <ion-toggle ng-model="isMultisig" toggle-class="toggle-balanced" class="bct">
<span translate>Shared Wallet</span> <span class="toggle-label" translate>Shared Wallet</span>
<switch id="isMultisig" name="isMultisig" ng-model="isMultisig" class="green right m5t m10b"></switch> </ion-toggle>
</label>
</div> </div>
<div class="m10t oh" ng-init="hideAdv=true"> <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> <i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span> <span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span> <span translate ng-hide="hideAdv">Hide advanced options</span>
@ -224,6 +230,7 @@
</form> </form>
</div> </div>
</div> </div>
</div>
</div> </div>
<div class="extra-margin-bottom"></div> <div class="extra-margin-bottom"></div>

View file

@ -44,7 +44,7 @@
</div> </div>
<div class="m10t oh" ng-init="hideAdv=true"> <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> <i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span> <span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span> <span translate ng-hide="hideAdv">Hide advanced options</span>

View file

@ -61,10 +61,7 @@
.bct { .bct {
background-color: transparent !important; background-color: transparent !important;
margin-top: -25px; margin-bottom: 15px !important;
padding-bottom: 30px;
right: -24px !important;
border-width: 0px;
} }
.r0 { .r0 {

View file

@ -715,6 +715,10 @@ ul.manage li {
padding: 10px; padding: 10px;
} }
.p10i {
padding: 10px !important;
}
.p10b { .p10b {
padding-bottom: 10px; padding-bottom: 10px;
} }