ayan.poddar/eShopOnContainers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update basket animations

Browse Source
This commit is contained in:
Quique Fernandez 2016-12-28 16:56:16 +01:00
parent bbef68c112
commit 6f3a6a8c16
3 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.html
View File

@ -1,9 +1,10 @@
<div class="esh-basketstatus"> <a class="esh-basketstatus"
<div class="esh-basketstatus-image" [routerLink]="['basket']">
[routerLink]="['basket']">
<div class="esh-basketstatus-image">
<img src="../../../images/cart.png" /> <img src="../../../images/cart.png" />
</div> </div>
<div class="esh-basketstatus-badge"> <div class="esh-basketstatus-badge">
{{badge}} {{badge}}
</div> </div>
</div> </a>

9
src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket-status/basket-status.component.scss
View File

@ -1,8 +1,10 @@
@import '../../_variables.scss'; @import '../../_variables.scss';
.esh-basketstatus { .esh-basketstatus {
cursor: pointer;
float: right; float: right;
position: relative; position: relative;
transition: all $animation-speed-default;
&-image { &-image {
height: 36px; height: 36px;
@ -21,6 +23,13 @@
text-align: center; text-align: center;
top: 0; top: 0;
transform: translateX(-38%); transform: translateX(-38%);
transition: all $animation-speed-default;
width: $size; width: $size;
} }
&:hover &-badge {
background-color: transparent;
color: $color-secondary-dark;
transition: all $animation-speed-default;
}
} }

6
src/Web/WebSPA/eShopOnContainers.WebSPA/Client/modules/basket/basket.component.scss
View File

@ -86,5 +86,11 @@
padding: 1rem 1.5rem; padding: 1rem 1.5rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
transition: all $animation-speed-default;
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
} }
} }