omg add, little animation

This commit is contained in:
Lisa P 2015-08-17 17:34:54 +02:00
parent 3d1cbdd1d8
commit 144c3cd4f8
3 changed files with 22 additions and 1 deletions

View File

@ -21,6 +21,8 @@
@import "app/components/sync-button";
@import "app/components/loading-indicator";
@import "app/animation/tractor";
@import "app/modules/section";
@import "app/modules/loader";
@import "app/modules/tiles";

View File

@ -0,0 +1,19 @@
.tractor
@media #{$medium-up}
width: 258px
height: 188px
.tractor-arm
@media #{$medium-up}
width: 90px
height: 71px
transform-origin: 89px 70px
animation: armMovement 1.5s 1 ease
@keyframes armMovement
0%,
100%
transform: rotateZ(0)
40%
transform: rotateZ(-20deg)
70%
transform: rotateZ(10deg)

View File

@ -43,7 +43,7 @@
c2.3,0,4.5-0.8,6.1-2.2c0.9-1.5,1.4-3.2,1.4-5.1C70,118.4,65.5,113.9,60.1,113.9z"/>
</g>
</g>
<g id="TractorArm">
<g id="TractorArm" class="tractor-arm">
<path fill="#3B3633" d="M76.6,76c-0.4-1.4-1.2-2.5-2.3-3.2l-30.5-18l0,0c0.1-0.2,0.1-0.4,0.2-0.7c0.5-2.1,0.6-3.4,0.6-3.4
c0.4-3.3,0.2-6.8-0.7-10.2c-2.2-8.2-7.9-14.8-15.8-18.2c-1-0.4-2.3,0-2.8,0.9L21,30.6c-0.3,0.6-0.4,1.3-0.2,1.9
c0.2,0.6,0.7,1.1,1.4,1.4c4.5,1.6,8,5.3,9.2,9.9c2,7.7-2.6,15.6-10.2,17.6c-4.6,1.2-9.6,0.1-13.2-3.1c-0.5-0.4-1.2-0.6-1.9-0.5