Merge pull request #7805 from Gamboster/fix/scanStylesAndButtons

[V4] Fix: scan styles and buttons
This commit is contained in:
Gabriel Edgardo Bazán 2018-01-11 10:16:53 -03:00 committed by GitHub
commit 68090768aa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 11 additions and 7 deletions

View File

@ -14,3 +14,4 @@ $color-primary: #647ce8;
$color-secondary: #111b49;
$icon-border-radius: 50%;
$toolbar-background: #1e3186;
$toolbar-scanner: rgba(30, 49, 134, 0.8);

View File

@ -14,3 +14,4 @@ $color-primary: #1abb9b;
$color-secondary: #31465b;
$icon-border-radius: 3px;
$toolbar-background: #192c3a;
$toolbar-scanner: rgba(25, 44, 58, 0.8);

View File

@ -1,13 +1,11 @@
<ion-header>
<ion-navbar>
<ion-navbar class="navbar-transparent">
<ion-title>{{'Scan' | translate}}</ion-title>
</ion-navbar>
</ion-header>
<ion-content class="back-transparent">
<div class="tab-scan-has-problems" *ngIf="currentState === scannerStates.unauthorized || currentState === scannerStates.denied || currentState === scannerStates.unavailable">
<div class="page-scan-has-problems" *ngIf="currentState === scannerStates.unauthorized || currentState === scannerStates.denied || currentState === scannerStates.unavailable">
<ion-icon>
<img src="img/tab-icons/ico-receive.svg" />
</ion-icon>
@ -20,8 +18,8 @@
<button ion-button block *ngIf="currentState === scannerStates.denied && canOpenSettings" (click)="openSettings()" translate>Open Settings</button>
<button ion-button block *ngIf="currentState === scannerStates.unavailable" (click)="attemptToReactivate()" translate>Retry Camera</button>
</div>
<div class="tab-scan-loading-camera" *ngIf="currentState === scannerStates.loading"></div>
<div class="tab-scan-camera-ready" *ngIf="currentState === scannerStates.visible">
<div class="page-scan-loading-camera" *ngIf="currentState === scannerStates.loading"></div>
<div class="page-scan-camera-ready" *ngIf="currentState === scannerStates.visible">
<div class="guides">
<img class="svg qr-scan-guides" src="assets/img/bitpay-wallet-qr-scan-guides.svg">
</div>

View File

@ -8,6 +8,9 @@ html , body, .back-transparent, ion-app, .nav-decor {
page-scan {
color: #fff;
background: transparent none;
.navbar-transparent, .toolbar-background {
background: $toolbar-scanner;
}
.not-supported-message {
height: 100%;
display: flex;
@ -23,6 +26,7 @@ page-scan {
.page-scan-camera-ready {
// view background is transparent to show video preview
background: none transparent;
height: 100%;
.guides {
display: flex;
position: absolute;