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

adding icon to feedback flow

Browse source
This commit is contained in:
Gabriel Bazán 2016-11-14 23:20:41 -03:00
commit 1675acb87a
9 changed files with 117 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/js/controllers/feedback/rateCard.js
View file

@ -3,6 +3,7 @@
angular.module('copayApp.controllers').controller('rateCardController', function($scope, $state, $timeout, gettextCatalog, platformInfo, storageService) {
$scope.isCordova = platformInfo.isCordova;
$scope.score = 0;
$scope.goFeedbackFlow = function() {
if ($scope.isModal) {

19
src/sass/views/feedback/complete.scss
View file

@ -19,10 +19,21 @@
}
.subtitle {
padding: 10px 30px 20px 40px;
.image {
text-align: center;
padding: 30px;
}
}
.icon-svg > img {
height: 16rem;
width: 16rem;
}
.socialsharing-icon {
display: inline-block;
width: 50px;
height: 50px;
border-radius: 50%;
}
.addressbook-icon-svg {
display: inline-block;
width: 50px;
height: 50px;
}
.share-buttons {
bottom: 0;

8
src/sass/views/feedback/rateApp.scss
View file

@ -4,11 +4,17 @@
margin: 10px;
color: #667;
}
.icon-svg > img {
width: 80px;
height: 80px;
margin-right: 30px;
margin-top: 15px;
}
.title {
font-size: 20px;
font-weight: bold;
color: $dark-gray;
margin: 40px 10px;
margin: 40px 10px 10px;
text-align: center;
}
.subtitle {

24
src/sass/views/feedback/rateCard.scss
View file

@ -1,20 +1,12 @@
#rate-card {
.stars {
display: flex;
border-bottom: none;
.button {
background-color: #fff;
outline: none;
border: none;
height:10px;
width:10px;
}
.gold {
color: #ffd700;
}
.subtle-gray {
color: $subtle-gray;
}
.row {
border: none;
}
.row.row-margin{
margin: 20px 0px 20px 0px;
}
.item-icon-right {
margin: 0;
}
.feedback-flow-button {
padding: 20px;

15
src/sass/views/feedback/send.scss
View file

@ -1,5 +1,8 @@
#send-feedback {
background-color: #ffffff;
.row {
border: none;
}
.skip {
margin: 20px 20px 10px;
color: #667;
@ -11,18 +14,6 @@
font-weight: bold;
color: $dark-gray;
}
.star {
a {
font-size: 25px;
padding: 20px;
.gold {
color: #ffd700;
}
.subtle-gray {
color: $subtle-gray;
}
}
}
.comment {
padding: 20px;
font-size: 1rem;

36
www/views/feedback/complete.html
View file

@ -5,8 +5,8 @@
</div>
<div ng-show="skipped && isCordova">
<div class="title" translate>Invite friends to BitPay Wallet!</div>
<div>
<i class="icon zero-state-icon">
<div class="text-center">
<i class="icon addressbook-icon-svg">
<img src="img/address-book-add.svg"/>
</i>
</div>
@ -21,9 +21,11 @@
</div>
<div class="subtitle" ng-if="score <= 3 || !isCordova">
<span translate>If you have additional feedback, please let us know by tapping the "Send feedback" option in the Settings tab.</span>
<div class="image">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
</div>
<div ng-if="score <= 3 || !isCordova">
<div class="text-center">
<i class="icon icon-svg">
<img src="img/illustration-send-feedback.png"/>
</i>
</div>
</div>
@ -35,40 +37,40 @@
<div class="ng-hide" ng-show="socialsharing" ng-if="score >= 4">
<div class="row">
<div class="ng-hide" ng-show="facebook" ng-click="shareFacebook()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-facebook.svg"/>
</i>
<span>Facebook</span>
</div>
<div class="ng-hide" ng-show="twitter" ng-click="shareTwitter()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-twitter.svg"/>
</i>
<span>Twitter</span>
</div>
<div class="ng-hide" ng-show="googleplus" ng-click="shareGooglePlus()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-googleplus.svg"/>
</i>
<span>Google+</span>
</div>
</div>
<div class="row">
<div class="ng-hide" ng-show="email" ng-click="shareEmail()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-email.svg"/>
</i>
<span>Email</span>
</div>
<div class="ng-hide" ng-show="whatsapp" ng-click="shareWhatsapp()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-whatsapp.svg"/>
</i>
<span>Whatsapp</span>
</div>
<div ng-click="shareMessage()">
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-message.svg"/>
</i>
<span>Message</span>
</div>

4
www/views/feedback/rateApp.html
View file

@ -4,8 +4,8 @@
<div class="title">
<span translate>Thank you!</span>
<div>
<i class="icon zero-state-icon">
<img src="img/address-book-add.svg"/>
<i class="icon icon-svg">
<img src="img/ico-positive-feedback.svg" class="bg"/>
</i>
</div>
</div>

37
www/views/feedback/rateCard.html
View file

@ -3,12 +3,37 @@
<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="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 class="row item item-sub" ng-class="{'row-margin': isModal}">
<div class="col col-20">
<i class="icon icon-svg" ng-click="setScore(1)">
<img ng-if="1 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="1 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-20">
<i class="icon icon-svg" ng-click="setScore(2)">
<img ng-if="2 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="2 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-20">
<i class="icon icon-svg" ng-click="setScore(3)">
<img ng-if="3 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="3 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-20">
<i class="icon icon-svg" ng-click="setScore(4)">
<img ng-if="4 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="4 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-20">
<i class="icon icon-svg" ng-click="setScore(5)">
<img ng-if="5 == score" src="img/ico-star-filled.svg"/>
<img ng-if="5 > score" src="img/ico-star.svg"/>
</i>
</div>
</div>
<div class="feedback-flow-button" ng-if="button_title">
<button type="submit" class="button button-standard button-primary" ng-click="goFeedbackFlow()">

37
www/views/feedback/send.html
View file

@ -4,12 +4,37 @@
<div class="title">
<span>{{reaction}}</span>
</div>
<div class="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 class="row item item-sub">
<div class="col col-10">
<i class="icon icon-svg" ng-click="setScore(1)">
<img ng-if="1 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="1 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-10">
<i class="icon icon-svg" ng-click="setScore(2)">
<img ng-if="2 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="2 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-10">
<i class="icon icon-svg" ng-click="setScore(3)">
<img ng-if="3 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="3 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-10">
<i class="icon icon-svg" ng-click="setScore(4)">
<img ng-if="4 <= score" src="img/ico-star-filled.svg"/>
<img ng-if="4 > score" src="img/ico-star.svg"/>
</i>
</div>
<div class="col col-10">
<i class="icon icon-svg" ng-click="setScore(5)">
<img ng-if="5 == score" src="img/ico-star-filled.svg"/>
<img ng-if="5 > score" src="img/ico-star.svg"/>
</i>
</div>
</div>
<div class="comment">
<span translate>{{comment}}</span>