Merge pull request #5060 from bitjson/master

Improve design of sharing view
This commit is contained in:
Jason Dreyzehner 2016-11-16 14:03:15 -05:00 committed by GitHub
commit 58da84deff
3 changed files with 40 additions and 43 deletions

View file

@ -7,27 +7,27 @@ angular.module('copayApp.controllers').controller('completeController', function
var config = configService.getSync(); var config = configService.getSync();
$scope.shareFacebook = function() { $scope.shareFacebook = function() {
window.plugins.socialsharing.shareVia($scope.shareFacebookVia, config.download.url, null, null, null, null, null); window.plugins.socialsharing.shareVia($scope.shareFacebookVia, null, null, null, config.download.url);
}; };
$scope.shareTwitter = function() { $scope.shareTwitter = function() {
window.plugins.socialsharing.shareVia($scope.shareTwitterVia, config.download.url, null, null, null, null, null); window.plugins.socialsharing.shareVia($scope.shareTwitterVia, null, null, null, config.download.url);
}; };
$scope.shareGooglePlus = function() { $scope.shareGooglePlus = function() {
window.plugins.socialsharing.shareVia($scope.shareGooglePlusVia, config.download.url, null, null, null); window.plugins.socialsharing.shareVia($scope.shareGooglePlusVia, config.download.url);
}; };
$scope.shareEmail = function() { $scope.shareEmail = function() {
window.plugins.socialsharing.shareViaEmail(config.download.url, null, null, null); window.plugins.socialsharing.shareViaEmail(config.download.url);
}; };
$scope.shareWhatsapp = function() { $scope.shareWhatsapp = function() {
window.plugins.socialsharing.shareViaWhatsApp(config.download.url, null, null, null); window.plugins.socialsharing.shareViaWhatsApp(config.download.url);
}; };
$scope.shareMessage = function() { $scope.shareMessage = function() {
window.plugins.socialsharing.shareViaSMS(config.download.url, null, null, null); window.plugins.socialsharing.shareViaSMS(config.download.url);
}; };
$scope.$on("$ionicView.beforeEnter", function(event, data) { $scope.$on("$ionicView.beforeEnter", function(event, data) {

View file

@ -1,13 +1,21 @@
#complete { #complete {
background-color: #ffffff; background-color: #ffffff;
.item-heading { .close-button {
border-style: none; color: $dark-gray;
margin-top: 10px; position: absolute;
a { top: 10px;
color: $dark-gray; right: 15px;
} font-size: 36px;
i { }
font-size: 40px; .complete-layout {
display: flex;
flex-direction: column;
height: 100%;
&__expand {
display: flex;
flex-grow: 1;
align-items: center;
justify-content: center;
} }
} }
.title { .title {
@ -18,7 +26,7 @@
text-align: center; text-align: center;
} }
.subtitle { .subtitle {
padding: 10px 30px 20px 40px; padding: 10px 30px 20px;
text-align: center; text-align: center;
color: $mid-gray; color: $mid-gray;
} }
@ -29,9 +37,7 @@
} }
.socialsharing-icon { .socialsharing-icon {
display: inline-block; display: inline-block;
width: 50px; width: 60px;
height: 50px;
border-radius: 50%;
} }
.addressbook-icon-svg { .addressbook-icon-svg {
display: inline-block; display: inline-block;
@ -39,21 +45,14 @@
height: 50px; height: 50px;
} }
.share-buttons { .share-buttons {
bottom: 0; padding: 50px 10px;
width: 100%;
position: absolute;
padding: 20px;
background-color: $subtle-gray; background-color: $subtle-gray;
.row { text-align: center;
margin: 20px 0px 20px; }
span { .share-buttons__action {
margin-top: 15px; display: inline-block;
display: block; color: #667;
} font-size: .9rem;
div { width: 90px;
text-align: center;
width: 100%;
}
}
} }
} }

View file

@ -1,8 +1,6 @@
<ion-view id="complete" hide-tabs> <ion-view id="complete" hide-tabs>
<ion-content scroll="false"> <ion-content scroll="false">
<div class="padding oh"> <a class="close-button" ng-click="close()"><i class="icon ion-ios-close-empty close-home-tip"></i></a>
<a class="right size-36" ng-click="close()"><i class="icon ion-ios-close-empty close-home-tip"></i></a>
</div>
<div ng-show="skipped && isCordova"> <div ng-show="skipped && isCordova">
<div ng-show="score > 3"> <div ng-show="score > 3">
<div class="title" translate>Invite friends to BitPay!</div> <div class="title" translate>Invite friends to BitPay!</div>
@ -11,7 +9,7 @@
<img src="img/address-book-add.svg"/> <img src="img/address-book-add.svg"/>
</i> </i>
</div> </div>
<div class="text-center"> <div class="subtitle">
<span translate>Share the love by inviting your friends.</span> <span translate>Share the love by inviting your friends.</span>
</div> </div>
</div> </div>
@ -53,37 +51,37 @@
</div> </div>
<div class="share-buttons" 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="ng-hide" ng-show="socialsharing" ng-if="score >= 4">
<div class="left text-center m10r ng-hide" ng-show="facebook" ng-click="shareFacebook()"> <div class="share-buttons__action ng-hide" ng-show="facebook" ng-click="shareFacebook()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-facebook.svg"/> <img src="img/social-icons/ico-social-facebook.svg"/>
</i> </i>
<div>Facebook</div> <div>Facebook</div>
</div> </div>
<div class="left text-center m10r ng-hide" ng-show="twitter" ng-click="shareTwitter()"> <div class="share-buttons__action ng-hide" ng-show="twitter" ng-click="shareTwitter()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-twitter.svg"/> <img src="img/social-icons/ico-social-twitter.svg"/>
</i> </i>
<div>Twitter</div> <div>Twitter</div>
</div> </div>
<div class="left text-center m10r ng-hide" ng-show="googleplus" ng-click="shareGooglePlus()"> <div class="share-buttons__action ng-hide" ng-show="googleplus" ng-click="shareGooglePlus()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-googleplus.svg"/> <img src="img/social-icons/ico-social-googleplus.svg"/>
</i> </i>
<div>Google+</div> <div>Google+</div>
</div> </div>
<div class="left text-center m10r ng-hide" ng-show="email" ng-click="shareEmail()"> <div class="share-buttons__action ng-hide" ng-show="email" ng-click="shareEmail()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-email.svg"/> <img src="img/social-icons/ico-social-email.svg"/>
</i> </i>
<div>Email</div> <div>Email</div>
</div> </div>
<div class="left text-center m10r ng-hide" ng-show="whatsapp" ng-click="shareWhatsapp()"> <div class="share-buttons__action ng-hide" ng-show="whatsapp" ng-click="shareWhatsapp()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-whatsapp.svg"/> <img src="img/social-icons/ico-social-whatsapp.svg"/>
</i> </i>
<div>Whatsapp</div> <div>Whatsapp</div>
</div> </div>
<div class="left text-center m10r" ng-click="shareMessage()"> <div class="share-buttons__action" ng-click="shareMessage()">
<i class="icon socialsharing-icon"> <i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-message.svg"/> <img src="img/social-icons/ico-social-message.svg"/>
</i> </i>