anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

styling

Browse source
This commit is contained in:
Gabriel Bazán 2016-11-03 13:39:01 -03:00
commit 11b4ec1fcc
9 changed files with 97 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/js/controllers/feedback/sendFeedback.js
View file

@ -5,23 +5,23 @@ angular.module('copayApp.controllers').controller('sendFeedbackController', func
switch ($scope.score) {
case 1:
$scope.reaction = gettextCatalog.getString("Ouch!");
$scope.comment = gettextCatalog.getString("There's obviously something we're doing wrong. Is there anything we could do to improve your experience?");
$scope.comment = gettextCatalog.getString("There's obviously something we're doing wrong.");
break;
case 2:
$scope.reaction = gettextCatalog.getString("Oh no!");
$scope.comment = gettextCatalog.getString("There's obviously something we're doing wrong. Is there anything we could do to improve your experience?");
$scope.comment = gettextCatalog.getString("There's obviously something we're doing wrong.");
break;
case 3:
$scope.reaction = gettextCatalog.getString("Thanks!");
$scope.comment = gettextCatalog.getString("We're always looking for ways to improve BitPay wallet. Is there anything we could do to improve your experience?");
$scope.comment = gettextCatalog.getString("We're always looking for ways to improve BitPay wallet.");
break;
case 4:
$scope.reaction = gettextCatalog.getString("Thanks!");
$scope.comment = gettextCatalog.getString("That's exciting to hear. We'd love to earn that fifth star from you - how could we improve your experience?");
$scope.comment = gettextCatalog.getString("That's exciting to hear. We'd love to earn that fifth star from you");
break;
case 5:
$scope.reaction = gettextCatalog.getString("Feedback!");
$scope.comment = gettextCatalog.getString("We're always looking for ways to improve BitPay wallet. Is there anything we could do to improve your experience?");
$scope.comment = gettextCatalog.getString("We're always looking for ways to improve BitPay wallet.");
break;
}

17
src/sass/views/feedback/rateAppStore.scss
View file

@ -1,12 +1,27 @@
#rate-app-store {
background-color: #ffffff;
.skip {
margin: 10px;
color: #667;
}
.title {
font-size: 20px;
font-weight: bold;
color: $dark-gray;
margin: 20px 10px;
margin: 40px 10px;
text-align: center;
}
.subtitle {
padding: 10px 30px 20px 40px;
}
.buttons {
bottom: 0;
width: 100%;
position: absolute;
background-color: $subtle-gray;
.button {
margin-top: 40px;
margin-bottom: 30px;
}
}
}

30
src/sass/views/feedback/sendFeedBack.scss
View file

@ -1,22 +1,25 @@
#send-feedback {
background-color: #fff;
background-color: #ffffff;
.skip {
margin: 10px;
color: #667;
}
.title {
font-size: 20px;
font-weight: bold;
color: $dark-gray;
margin: 20px 10px;
margin-left: 10px;
}
.star {
margin: 20px 0px;
}
a {
font-size: 25px;
padding: 12px;
.gold {
color: #ffd700 !important;
}
.grey {
color: #667 !important;
a {
font-size: 25px;
padding: 12px;
.gold {
color: #ffd700;
}
.subtle-gray {
color: $subtle-gray;
}
}
}
.comment {
@ -27,7 +30,8 @@
color: $dark-gray;
}
textarea {
padding: 10px;
border-top: 1px solid $subtle-gray;
padding: 20px;
width: 100%;
}
}

35
src/sass/views/feedback/thanks.scss
View file

@ -1,4 +1,15 @@
#thanks-feedback {
background-color: #ffffff;
.item-heading {
border-style: none;
margin-top: 5px;
a {
color: $dark-gray;
}
i {
font-size: 40px;
}
}
.title {
font-size: 20px;
font-weight: bold;
@ -9,15 +20,21 @@
.subtitle {
padding: 10px 30px 20px 40px;
}
.row {
margin: 20px 0px 20px;
span {
margin-top: 15px;
display: block;
}
div {
text-align: center;
width: 100%;
.share-buttons {
bottom: 0;
width: 100%;
position: absolute;
background-color: $subtle-gray;
.row {
margin: 20px 0px 20px;
span {
margin-top: 15px;
display: block;
}
div {
text-align: center;
width: 100%;
}
}
}
}

15
src/sass/views/tab-home.scss
View file

@ -118,21 +118,24 @@
position: absolute;
}
}
.starts {
.stars {
display: flex;
border-bottom: none;
.button {
background-color: #fff;
width: 100%;
outline: none;
border: none;
height:10px;
width:10px;
}
.gold {
color: #ffd700 !important;
color: #ffd700;
}
.grey {
color: #667 !important;
.subtle-gray {
color: $subtle-gray;
}
}
.continue-button {
.feedback-flow-button {
padding: 20px;
}
}

14
www/views/feedback/rateAppStore.html
View file

@ -1,12 +1,6 @@
<ion-view id="rate-app-store">
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="secondary">
<button class="button button-button-clear" ng-click="skip()" translate>
Skip
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-content scroll="false">
<a class="right skip" ng-click="skip()">Skip</a>
<div class="title">
<span translate>Thank you!</span>
<div>
@ -19,13 +13,13 @@
<span translate>5-star ratings help us get BitPay Wallet into more hands, and more users means more resoucers can be committed to the app!</span>
</div>
<div class="subtitle">
<span translate>Would you be willing to rate BitPay Wallet in the app store?</span>
<span class="text-bold" translate>Would you be willing to rate BitPay Wallet in the app store?</span>
</div>
<div>
<div class="buttons">
<button type="submit" class="button button-standard button-primary" ng-click="goAppStore()">
<span translate>Rate on the app store</span>
</button>
<button type="submit" class="button button-standard button-primary" ng-click="sendFeedback()">
<button type="submit" class="button button-standard button-primary button-clear" ng-click="sendFeedback()">
<span translate>Send us feedback instead</span>
</button>
</div>

24
www/views/feedback/sendFeedback.html
View file

@ -1,29 +1,23 @@
<ion-view id="send-feedback">
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="secondary">
<button class="button button-back button-clear" ng-click="skip()">
Skip
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-content scroll="false">
<a class="right skip" ng-click="skip()">Skip</a>
<div class="row">
<div class="col col-50 title">
<div class="col col-40 title">
<span>{{reaction}}</span>
</div>
<div class="col col-50 star">
<a><i ng-class="{'gold': 1 <= score, 'grey': 1 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 2 <= score, 'grey': 2 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 3 <= score, 'grey': 3 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 4 <= score, 'grey': 4 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 5 == score, 'grey': 5 > score}" class="icon ion-android-star"></i></a>
<div class="col col-60 star">
<a><i ng-class="{'gold': 1 <= score, 'subtle-gray': 1 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 2 <= score, 'subtle-gray': 2 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 3 <= score, 'subtle-gray': 3 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 4 <= score, 'subtle-gray': 4 > score}" class="icon ion-android-star"></i></a>
<a><i ng-class="{'gold': 5 == score, 'subtle-gray': 5 > score}" class="icon ion-android-star"></i></a>
</div>
</div>
<div class="row comment">
<span translate>{{comment}}</span>
</div>
<div>
<textarea row="40"></textarea>
<textarea placeholder="Is there anything we could do to improve your experience?" row="40"></textarea>
</div>
<div class="padding">
<button type="submit" class="button button-full button-primary" ng-click="sendFeedback()" translate>

11
www/views/feedback/thanks.html
View file

@ -1,11 +1,8 @@
<ion-view id="thanks-feedback">
<ion-nav-bar class="bar-royal">
<ion-nav-buttons side="secondary">
<button class="button icon ion-ios-close-empty" ui-sref="tabs.home()">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-content scroll="false">
<div class="item item-icon-right item-heading">
<a ui-sref="tabs.home()"><i class="icon ion-ios-close-empty close-home-tip"></i></a>
</div>
<div ng-show="skipped && isCordova">
<div class="title" translate>Invite friends to BitPay Wallet!</div>
<div>
@ -34,7 +31,7 @@
<span translate>Share the love by inviting your friends.</span>
</div>
</div>
<div ng-if="isCordova && score > 3">
<div class="share-buttons" ng-if="isCordova && score > 3">
<div class="ng-hide" ng-show="socialsharing" ng-if="score >= 4">
<div class="row">
<div class="ng-hide" ng-show="facebook" ng-click="shareFacebook()">

14
www/views/tab-home.html
View file

@ -18,14 +18,14 @@
<span translate>How do you like BitPay Wallet?</span>
<a ng-click="hideCard()" ><i class="icon ion-ios-close-empty close-home-tip"></i></a>
</div>
<div class="starts item item-sub">
<button class="button icon ion-android-star" ng-click="setScore(1)" ng-class="{'gold': 1 <= score, 'grey': 1 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(2)" ng-class="{'gold': 2 <= score, 'grey': 2 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(3)" ng-class="{'gold': 3 <= score, 'grey': 3 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(4)" ng-class="{'gold': 4 <= score, 'grey': 4 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(5)" ng-class="{'gold': 5 == score, 'grey': 5 > score}"></button>
<div class="stars item item-sub">
<button class="button icon ion-android-star" ng-click="setScore(1)" ng-class="{'gold': 1 <= score, 'subtle-gray': 1 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(2)" ng-class="{'gold': 2 <= score, 'subtle-gray': 2 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(3)" ng-class="{'gold': 3 <= score, 'subtle-gray': 3 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(4)" ng-class="{'gold': 4 <= score, 'subtle-gray': 4 > score}"></button>
<button class="button icon ion-android-star" ng-click="setScore(5)" ng-class="{'gold': 5 == score, 'subtle-gray': 5 > score}"></button>
</div>
<div class="continue-button" ng-if="button_title">
<div class="feedback-flow-button" ng-if="button_title">
<button type="submit" class="button button-standard button-primary" ng-click="goFeedbackFlow()">
<span>{{button_title}}</span>
</button>