From df0f77b3837fbec1e4df0c27cf78109bf7fa295e Mon Sep 17 00:00:00 2001 From: Gustavo Maximiliano Cortez Date: Tue, 16 Aug 2016 17:45:20 -0300 Subject: [PATCH] Add/create/import/join. Main sass file --- public/views/add.html | 52 ++-- public/views/create.html | 292 +++++++++++---------- public/views/import.html | 388 ++++++++++++++-------------- public/views/join.html | 216 ++++++++-------- src/js/controllers/import.js | 4 +- src/js/directives/qrScanner.js | 2 +- src/sass/main.scss | 449 +++++++++++++++++++++++++++++++++ 7 files changed, 926 insertions(+), 477 deletions(-) create mode 100644 src/sass/main.scss diff --git a/public/views/add.html b/public/views/add.html index b399d9bd7..52663759c 100644 --- a/public/views/add.html +++ b/public/views/add.html @@ -1,34 +1,26 @@ -
-
+ + + Close + + + + +

Create new wallet

+ + + +

Join shared wallet

+ + -
- -
diff --git a/public/views/create.html b/public/views/create.html index cab18365a..1d427e392 100644 --- a/public/views/create.html +++ b/public/views/create.html @@ -1,164 +1,178 @@ -
-
+ + + Add + -
+ -
-
-
- Personal Wallet +
+
+
-
- Shared Wallet +
+
-
-
-
- - {{create.error|translate}} - +
+ {{create.error|translate}}
-
-
-
- -
-
- -
-
-
- + + +
+ + + + + -
- - - Show advanced options - Hide advanced options - - - -
+ + Show advanced options + Hide advanced options + -
-
-
- -
+
-
- -
+ -
- + -
- - - - WARNING: The password cannot be recovered. Be sure to write it down. The wallet can not be restored without the password. - - -
+ -
- +
+
+ WARNING: The password cannot be recovered. Be sure to write it down. The wallet can not be restored without the password.
+
-
- -
+ -
- -
-
- -
-
- - Testnet - -
-
- -
- Single Address Wallet - For audit purposes -
- -
-
+ + + + + + + + Testnet + + + + Single Address Wallet + For audit purposes + +
+
- + - + + + + + -
-
- -
-
diff --git a/public/views/import.html b/public/views/import.html index ecc99485a..9c40af245 100644 --- a/public/views/import.html +++ b/public/views/import.html @@ -1,228 +1,226 @@ -
-
+ + + Add + + + + + + -
-
-
- Recovery Phrase +
+
-
- File/Text +
+
-
- Hardware Wallet +
+
-
-
+
-
-
-
-
-
Could not access the wallet at the server. Please check:
-
    -
  • The password of the recovery phrase (if set)
    • -
  • The derivation path
    • -
  • The wallet service URL
    • -
-
- NOTE: To import a wallet from a 3rd party software, please go to Add Wallet > Create Wallet, and specify the Recovery Phrase there.
-
+
+
+
Could not access the wallet at the server. Please check:
+
    +
  • The password of the recovery phrase (if set)
    • +
  • The derivation path
    • +
  • The wallet service URL
    • +
+
+ NOTE: To import a wallet from a 3rd party software, please go to Add Wallet > Create Wallet, and specify the Recovery Phrase there.
-
-
{{error|translate}}
+
+ {{error|translate}}
-
-
-
-
-
- -
-
-
-
- - {{error|translate}} -
-
-
- - -
+ +
+
-
- - -
+
-
- -
-
-
-
- - {{error|translate}} -
-
-
- No hardware wallets supported on this device + + +
+ +
+
+ {{error|translate}} +
+ +
+ +
+
+ No hardware wallets supported on this device
-
-
- + + + + + Shared Wallet + + + + Show advanced options + Hide advanced options + + +
+ + +
+
-
+ +
- -
- -
- - Shared Wallet - -
- -
- - - Show advanced options - Hide advanced options - - - -
-
-
- - -
-
- - -
-
-
+
-
-
-
+ + + diff --git a/public/views/join.html b/public/views/join.html index 0c62e118c..14ddb49b3 100644 --- a/public/views/join.html +++ b/public/views/join.html @@ -1,130 +1,126 @@ -
-
+ + + Add + + + + + -
-
-
- - {{join.error|translate}} - +
+ {{join.error|translate}}
-
-
-
- -
+ -
- - - - Wallet Invitation is not valid! +
+ + + +
+ + + + -
- -
- -
-
+ + Show advanced options + Hide advanced options + -
- - - Show advanced options - Hide advanced options - - - -
+
-
-
-
- + + + -
- -
+ -
- -
- -
- - - +
+
+ WARNING: The password cannot be recovered. Be sure to write it down. The wallet can not be restored without the password. -
+
-
- -
+ -
- -
+ + + + + -
- -
-
- -
-
+
+ + + + + - -
-
- -
-
diff --git a/src/js/controllers/import.js b/src/js/controllers/import.js index 8c9f72295..8b1bedb18 100644 --- a/src/js/controllers/import.js +++ b/src/js/controllers/import.js @@ -178,8 +178,8 @@ angular.module('copayApp.controllers').controller('importController', }, 100); }; - $scope.setDerivationPath = function() { - if ($scope.testnetEnabled) + $scope.setDerivationPath = function(testnetEnabled) { + if (testnetEnabled) $scope.derivationPath = derivationPathHelper.defaultTestnet; else $scope.derivationPath = derivationPathHelper.default; diff --git a/src/js/directives/qrScanner.js b/src/js/directives/qrScanner.js index f4fddbc19..09f3b5c61 100644 --- a/src/js/directives/qrScanner.js +++ b/src/js/directives/qrScanner.js @@ -70,6 +70,6 @@ angular.module('copayApp.directives') }, controller: controller, replace: true, - template: '' + template: '' } }); diff --git a/src/sass/main.scss b/src/sass/main.scss new file mode 100644 index 000000000..be3be54ab --- /dev/null +++ b/src/sass/main.scss @@ -0,0 +1,449 @@ +/* + * + * Copay main CSS + * + */ + + +// QR Code + +#qr-canvas { + display: none; +} + +#qrcode-scanner-video { + display: block; + margin: 0 auto; +} + +// General purpose +.dn { + display: none; +} + +.dni { + display: none !important; +} + +.pr { + position: relative; +} + +.pa { + position: absolute; +} + +.m0 { + margin: 0; +} + +.p0i { + padding: 0 !important; +} + +.db { + display: block; +} + +.dib { + display: inline-block; +} + +.size-10 { + font-size: 10px; +} + +.size-12 { + font-size: 12px; +} + +.size-14 { + font-size: 14px; +} + +.size-16 { + font-size: 16px; +} + +.size-18 { + font-size: 18px; +} + +.size-21 { + font-size: 21px; +} + +.size-24 { + font-size: 24px; +} + +.size-28 { + font-size: 28px; +} + +.size-36 { + font-size: 36px; +} + +.size-42 { + font-size: 42px; +} + +.size-48 { + font-size: 48px; +} + +.size-60 { + font-size: 60px; +} + +.size-72 { + font-size: 72px; +} + +.m5 { + margin: 5px; +} + +.m5t { + margin-top: 5px; +} + +.m8t { + margin-top: 8px; +} + +.m5b { + margin-bottom: 5px; +} + +.m5r { + margin-right: 5px; +} + +.m10 { + margin: 10px; +} + +.m10b { + margin-bottom: 10px; +} + +.m3t { + margin-top: 3px; +} + +.m10t { + margin-top: 10px; +} + +.m15b { + margin-bottom: 15px; +} + +.m15r { + margin-right: 15px; +} + +.m20b { + margin-bottom: 20px; +} + +.m30b { + margin-bottom: 30px; +} + +.m40b { + margin-bottom: 40px; +} + +.m50b { + margin-bottom: 50px; +} + +.m10r { + margin-right: 10px; +} + +.m40r { + margin-right: 40px; +} + +.m25r { + margin-right: 25px; +} + +.m10l { + margin-left: 10px; +} + +.m5l { + margin-left: 5px; +} + +.m15l { + margin-left: 15px; +} + +.m15t { + margin-top: 15px; +} + +.m20r { + margin-right: 20px; +} + +.m20t { + margin-top: 20px; +} + +.m20ti { + margin-top: 20px !important; +} + +.m20tp { + margin-top: 20%; +} + +.m30tp { + margin-top: 30%; +} + +.m15 { + margin: 15px; +} + +.m15h { + margin: 0 15px; +} + +.p10t { + padding-top: 10px; +} + +.p10h { + padding-right: 10px; + padding-left: 10px; +} + +.p15h { + padding: 0 15px; +} + +.p0r { + padding-right: 0; +} + +.p70r { + padding-right: 70px; +} + +.p70l { + padding-left: 70px; +} + +.p5h { + padding: 0 5px; +} + +.p20h { + padding: 0 20px; +} + +.p20v { + padding: 20px 0; +} + +.p20b { + padding-bottom: 20px; +} + +.p25b { + padding-bottom: 25px; +} + +.p25l { + padding-left: 25px; +} + +.p15l { + padding-left: 15px; +} + +.p15 { + padding: 15px; +} + +.p20 { + padding: 20px; +} + +.p15t { + padding-top: 15px; +} + +.p20t { + padding-top: 20px; +} + +.p50t { + padding-top: 50px; +} + +.p10 { + padding: 10px; +} + +.p10i { + padding: 10px !important; +} + +.p10b { + padding-bottom: 10px; +} + +.p45t { + padding-top: 45px; +} + +.p60t { + padding-top: 60px; +} + +.p60b { + padding-bottom: 60px; +} + +.m60t { + margin-top: 60px; +} + +.p45li { + padding-left: 45px !important; +} + +.m30v { + margin: 30px 0; +} + +.m10h { + margin: 0 10px; +} + +.m10v { + margin: 10px 0; +} + +.m20v { + margin: 20px 0; +} + +.m30v { + margin: 30px 0; +} + +.m30a { + margin: 30px auto; +} + +.m-negative-l { + margin-left: -0.9375rem; +} + +.br100 { + border-radius: 100% !important; +} + +.lh { + line-height: 0; +} + +.lh140 { + line-height: 140%; +} + +.oh { + overflow: hidden; +} + +.vm { + vertical-align: middle; +} + +.vt { + vertical-align: top; +} + +.ma { + margin: 0 auto; +} + +.tu { + text-transform: uppercase; +} + +.tl { + text-transform: lowercase; +} + +/* + * Calculator + */ + +.calculator .header-calc { + position: absolute; + width: 100%; + text-align: center; +} + +.calculator .button-calc { + position: absolute; + width: 100%; + bottom: 0; +} + +.calculator .button-calc .row { + padding: 0 !important; +} + +.calculator .button-calc .columns { + cursor: pointer; + text-align: center; +} + +.calculator .button-calc .operator { + color: #2C3E50; + background-color: #eee; +} + +.calculator .button-calc .columns:active { + background-color: #eee; +} + +.calculator .button-calc .operator:active { + background-color: #f8f8f8; +} + +// No looks likes locked +input[type="number"] { + &[readonly] { + background-color: #F6F7F9; + padding-left: 0; + } +} + +@media all and (max-height: 480px) { + .calculator .button-calc .columns { padding: 10px; } + .calculator .header-calc { top: 11%; } +} + +@media (min-height: 481px) and (max-height: 670px) { + .calculator .button-calc .columns { padding: 15px; } + .calculator .header-calc { top: 15%; } +} + +@media all and (min-height: 671px) { + .calculator .button-calc .columns { padding: 20px; } + .calculator .header-calc { top: 18%; } +} +