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

Merge pull request #5069 from bitjson/master

Browse source 
feat(share): add brief entry animation for the sharing view
This commit is contained in:
Jason Dreyzehner 2016-11-17 12:12:32 -05:00 • committed by GitHub
commit 61d58af970
7 changed files with 41 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/sass/ionic.scss
View file

@ -6,10 +6,6 @@
/* Ionic Overrides and Workarounds */ /* Ionic Overrides and Workarounds */
// Please include a description of the problem solved by the workaround. // Please include a description of the problem solved by the workaround.
// class to dynamically hide the ion-nav-bar for v1 Amazon flow
// Fix hide-nav-bar (true|false)
//ion-nav-bar.hide { display: block !important; }
// the ion tabs element never needs it's own background (backgrounds are // the ion tabs element never needs it's own background (backgrounds are
// rendered by the tabs), and the default background would cover the scanner // rendered by the tabs), and the default background would cover the scanner
ion-tabs.ion-tabs-transparent { ion-tabs.ion-tabs-transparent {

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

@ -64,13 +64,13 @@
padding: 50px 10px 30px; padding: 50px 10px 30px;
background-color: $subtle-gray; background-color: $subtle-gray;
text-align: center; text-align: center;
transition: transform .3s cubic-bezier(0.4, 0.0, 0.2, 1) .2s, opacity .5s ease-in .2s;
transform: translateY(100%); transform: translateY(100%);
opacity: 0; opacity: 0;
&.slide-up { animation-name: slideUpFadeIn;
transform: translateY(0); animation-duration: .3s;
opacity: 1; animation-fill-mode: forwards;
} animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);
animation-delay: .2s;
} }
.share-buttons__action { .share-buttons__action {
display: inline-block; display: inline-block;
@ -81,3 +81,14 @@
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
@keyframes slideUpFadeIn {
from {
transform: translateY(100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}

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

@ -28,11 +28,11 @@
padding: 10px 30px 20px 40px; padding: 10px 30px 20px 40px;
color: #667; color: #667;
} }
.buttons { .rate-buttons {
bottom: 0; bottom: 0;
width: 100%; width: 100%;
position: absolute; position: absolute;
background-color: $subtle-gray; background-color: $subtle-gray;
padding: 50px 0; padding: 30px 0 15px;
} }
} }

13
src/sass/views/tab-receive.scss
View file

@ -278,7 +278,7 @@
.swiper-slide{ .swiper-slide{
text-align: center; text-align: center;
.card{ .card{
margin-top:2vh; margin-top: 1vh;
display: inline-block; display: inline-block;
width:80%; width:80%;
@media(min-height: 1000px) and (max-width: 699px){ @media(min-height: 1000px) and (max-width: 699px){
@ -412,7 +412,7 @@
display: inline-block; display: inline-block;
&.wallet-name{ &.wallet-name{
font-size:16px; font-size:16px;
width: 70%; width: 79%;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
@ -425,8 +425,13 @@
visibility: visible !important; visibility: visible !important;
} }
} }
.big-icon-svg{ .big-icon-svg {
& > .bg{padding:.3rem;width: 40px;height:40px;} padding: 0;
& > .bg {
padding:.3rem;
width: 40px;
height:40px;
}
} }
} }
} }

12
www/img/contact-placeholder.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.1;}
</style>
<path class="st0" d="M17.5,0C7.9,0,0,7.9,0,17.5s7.9,17.5,17.5,17.5S35,27.1,35,17.5S27.1,0,17.5,0L17.5,0z M28.6,26.9
c-1-2.3-3.2-3.3-5.4-4.1c-1-0.3-1.6-1.3-1.8-2.2c1.9-1.2,3.4-3.5,3.4-6.1v-1.5c0-4.1-3.2-7.3-7.3-7.3s-7.3,3.2-7.3,7.3v1.5
c0,2.6,1.5,4.9,3.5,6.3C13.4,21.7,13,22.5,12,23c-2.2,0.7-4.4,1.7-5.4,4.1c-2.3-2.6-3.6-6-3.6-9.6c0-8,6.6-14.5,14.6-14.5
s14.6,6.5,14.6,14.5C32.1,21.1,30.8,24.4,28.6,26.9L28.6,26.9z"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 812 B

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

@ -9,7 +9,7 @@
<div class="subtitle"> <div class="subtitle">
<span class="text-bold" translate>Would you be willing to rate BitPay in the app store?</span> <span class="text-bold" translate>Would you be willing to rate BitPay in the app store?</span>
</div> </div>
<div class="buttons"> <div class="rate-buttons">
<button type="submit" class="button button-standard button-primary" ng-click="goAppStore()"> <button type="submit" class="button button-standard button-primary" ng-click="goAppStore()">
<span translate>Rate on the app store</span> <span translate>Rate on the app store</span>
</button> </button>

2
www/views/tab-send.html
View file

@ -41,7 +41,7 @@
<div class="list"> <div class="list">
<a class="item item-icon-left item-icon-right" ng-if="!hasContacts" ui-sref="tabs.send.addressbook"> <a class="item item-icon-left item-icon-right" ng-if="!hasContacts" ui-sref="tabs.send.addressbook">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<gravatar class="send-gravatar" name="" width="30" email=""></gravatar> <img src="img/contact-placeholder.svg" class="bg"/>
</i> </i>
<span translate>Add a Contact</span> <span translate>Add a Contact</span>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>