Merge pull request #3159 from bechi/feat/glidera-ui

Feat/glidera ui
This commit is contained in:
Gustavo Maximiliano Cortez 2015-09-12 14:41:53 -03:00
commit 32b1ee6a77
4 changed files with 81 additions and 65 deletions

View file

@ -22,33 +22,27 @@
</div>
</div>
<div class="row m20t">
<div class="columns">
<div class="text-center m5b">
<img src="img/glidera-logo.png" ng-click="index.updateGlidera(index.glideraToken, index.glideraPermissions)" width="100">
<div class="row">
<div class="m20b box-notification" ng-if="index.glideraError">
<div class="text-warning">
<span>{{index.glideraError}}</span>
</div>
<div class="m20b box-notification" ng-if="index.glideraError">
<div class="text-warning">
<span>{{index.glideraError}}</span>
</div>
</div>
<div class="m10t text-center" ng-show="index.glideraError">
<button
class="dark-gray outline round tiny"
ng-show="index.glideraError.indexOf('Forbidden') == 40"
ng-click="index.glideraToken = null; index.glideraError = null">
Request a new token
</div>
<div class="m10t text-center" ng-show="index.glideraError">
<button
class="dark-gray outline round tiny"
ng-show="index.glideraError.indexOf('Forbidden') == 40"
ng-click="index.glideraToken = null; index.glideraError = null">
Request a new token
</button>
<div ng-show="index.glideraError.indexOf('Forbidden') != 40">
<button
class="dark-gray outline round tiny"
ng-click="index.initGlidera(index.glideraToken)">
Retry
</button>
<div ng-show="index.glideraError.indexOf('Forbidden') != 40">
<button
class="dark-gray outline round tiny"
ng-click="index.initGlidera(index.glideraToken)">
Retry
</button>
<div class="m20t size-12">
<a class="text-gray" ng-click="$root.go('preferencesGlidera')" translate>Preferences</a>
</div>
<div class="m20t size-12">
<a class="text-gray" ng-click="$root.go('preferencesGlidera')" translate>Preferences</a>
</div>
</div>
</div>
@ -56,17 +50,19 @@
<div ng-if="!index.glideraToken && !index.glideraLoading && !index.glideraError"
class="row">
<div class="box-notification text-center size-12 text-warning" ng-show="index.glideraTestnet">
<i class="fi-info"></i>
Testnet wallets only work with Glidera Sandbox Accounts
</div>
<div class="columns" ng-init="showOauthForm = false">
<div class="text-center" ng-show="!showOauthForm">
<p translate>You can buy and sell Bitcoin with a US bank account directly in Copay.</p>
<div class="m10b text-gray size-12" translate>Connect your Glidera account to get started</div>
<div class="text-center m20v">
<img src="img/glidera-logo.png" ng-click="index.updateGlidera(index.glideraToken, index.glideraPermissions)" width="200">
</div>
<div class="text-center small-10 small-centered columns" ng-show="!showOauthForm">
<p class="m10b" translate>You can buy and sell Bitcoin with a US bank account directly in Copay.</p>
<p class="text-gray size-12" translate>Connect your Glidera account to get started</p>
<div class="box-notification size-12 text-warning" ng-show="index.glideraTestnet">
<i class="fi-info"></i>
Testnet wallets only work with Glidera Sandbox Accounts
</div>
<a class="button dark-gray outline round tiny"
<a class="button m20t light-gray outline round small"
ng-click="$root.openExternalLink(glidera.getAuthenticateUrl(), '_system'); showOauthForm = true" translate>
Connect to Glidera
</a>
@ -98,31 +94,52 @@
</div>
<div ng-if="index.glideraToken && index.glideraPermissions">
<div class="text-center m10b">
<div class="size-12" ng-show="index.glideraEmail">
{{index.glideraEmail}}
<div class="m20v text-center">
<img src="img/glidera-logo.png" ng-click="index.updateGlidera(index.glideraToken, index.glideraPermissions)" width="100">
</div>
<div class="sub-header" ng-click="$root.go('preferencesGlidera')">
<div class="left">
<div ng-show="!index.glideraPersonalInfo && !index.glideraEmail">
<h4 class="title p0i m10t m0" translate>Preferences</h4>
</div>
<div ng-show="index.glideraPersonalInfo" class="size-12">
<b>
{{index.glideraPersonalInfo.firstName}} {{index.glideraPersonalInfo.lastName}}
</b>
</div>
<div class="size-12" ng-show="index.glideraEmail">
{{index.glideraEmail}}
</div>
</div>
<div ng-show="index.glideraPersonalInfo" class="size-12">
{{index.glideraPersonalInfo.firstName}} {{index.glideraPersonalInfo.lastName}}
<div class="right">
<div class="pointer m5t">
<i class="fi-widget size-16 text-gray"></i>
<span class="right text-gray">
<i class="icon-arrow-right3 size-24 right"></i>
</span>
</div>
</div>
<div class="columns text-warning size-12 m20t m20b"
</div>
<div class="row">
<div class="text-center columns small-8 small-centered m30v size-12"
ng-show="index.glideraStatus && (!index.glideraStatus.userEmailIsSetup || !index.glideraStatus.userPhoneIsSetup
|| (!index.glideraStatus.userBankAccountIsSetup && index.glideraStatus.bankAccountState != 'VERIFIED'))">
<span translate>Your Glidera account is not ready to transact. Please, verify it at</span>
<a href
ng-init="glideraUrl = index.glideraTestnet ? 'https://sandbox.glidera.io/login' :
'https://glidera.io/login'"
ng-click="$root.openExternalLink(glideraUrl)">Glidera.io</a>
<h4 class="text-bold" translate> Complete Setup</h4>
<span translate>Your Glidera account is not ready to transact. Please, verify it at <b>Glidera.io</b> </span>
<a class="button m20t light-gray outline round tiny"
ng-init="glideraUrl = index.glideraTestnet ? 'https://sandbox.glidera.io/login' :
'https://glidera.io/login'"
ng-click="$root.openExternalLink(glideraUrl)"
translate>
Go to Glidera
</a>
</div>
</div>
</div>
<ul class="no-bullet m0 size-14">
<li class="line-b line-t p20 pointer"
ng-show="index.glideraPermissions.transact &&
(index.glideraStatus.userCanBuy || index.glideraStatus.userCanTransact)"
<li ng-show="index.glideraPermissions.transact &&
(index.glideraStatus.userCanBuy || index.glideraStatus.userCanTransact)" class="line-b line-t p20 pointer"
ng-click="$root.go('buyGlidera')">
<i class="icon-buy-btc size-24 m5r"></i>
<span translate>Buy Bitcoin</span>
@ -140,12 +157,6 @@
<i class="icon-arrow-right3 size-24 right"></i>
</span>
</li>
<li class="line-b p20 pointer" ng-click="$root.go('preferencesGlidera')">
<span translate>Preferences</span>
<span class="right text-gray">
<i class="icon-arrow-right3 size-24 right"></i>
</span>
</li>
</ul>
<div ng-show="index.glideraPermissions.transaction_history">

View file

@ -1,7 +1,7 @@
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b" translate>Are you sure you would like to log out of your Glidera account?</h1>
<p class="text-gray" translate>You will need to log back in to buy or sell bitcoin in Copay.</p>
<h1 class="text-center m20b p20h" translate>Are you sure you would like to log out of your Glidera account?</h1>
<p class="text-gray p20h" translate>You will need to log back in to buy or sell bitcoin in Copay.</p>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-click="cancel()">
<i class="fi-arrow-left"></i> <span class="tu" translate>Back</span>

View file

@ -1,5 +1,5 @@
<div
class="topbar-container"
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Preferences'; goBackToState = 'glidera'">
</div>
@ -34,7 +34,7 @@
</li>
</ul>
<ul ng-if="index.glideraPermissions.view_email_address"
<ul ng-if="index.glideraPermissions.view_email_address"
ng-init="glidera.getEmail(index.glideraToken)"
class="no-bullet m0 size-14">
<h4 class="title m0" translate>Email</h4>
@ -52,7 +52,7 @@
</li>
</ul>
<ul ng-if="index.glideraPermissions.personal_info"
<ul ng-if="index.glideraPermissions.personal_info"
ng-init="glidera.getPersonalInfo(index.glideraToken)"
class="no-bullet m0 size-14">
<h4 class="title m0" translate>Personal Information</h4>
@ -260,7 +260,6 @@
<span class="text-warning" translate>Log out</span>
</li>
</ul>
</div>
<div class="extra-margin-bottom"></div>

View file

@ -108,6 +108,12 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill, inpu
-webkit-box-shadow: 0 0 0px 1000px white inset;
}
.sub-header {
background: #F1f3F5;
padding: 0.8rem;
overflow: hidden;
}
.status {
color: #FFFFFF;
background-color: #A02F23;