1 @-webkit-keyframes shake-rotate { 2 0% { 3 -webkit-transform:scale(1) rotate(0deg); 4 transform:scale(1) rotate(0deg) 5 } 6 7 50% { 8 -webkit-transform:scale(.8) rotate(-5deg); 9 transform:scale(.8) rotate(-5deg) 10 } 11 12 to { 13 -webkit-transform:scale(1) rotate(3deg); 14 transform:scale(1) rotate(3deg) 15 } 16 } 17 18 @keyframes shake-rotate { 19 0% { 20 -webkit-transform:scale(1) rotate(0deg); 21 transform:scale(1) rotate(0deg) 22 } 23 24 50% { 25 -webkit-transform:scale(.8) rotate(-5deg); 26 transform:scale(.8) rotate(-5deg) 27 } 28 29 to { 30 -webkit-transform:scale(1) rotate(3deg); 31 transform:scale(1) rotate(3deg) 32 } 33 } 34 35 .shake-rotate { 36 display: inline-block; 37 38 -webkit-animation-duration: .4s; 39 animation-duration: .4s; 40 -webkit-animation-iteration-count: infinite; 41 animation-iteration-count: infinite; 42 -webkit-animation-name: shake-rotate; 43 animation-name: shake-rotate; 44 -webkit-animation-timing-function: ease-in-out; 45 animation-timing-function: ease-in-out 46 } 47 48 .feedback-dialog { 49 .details { 50 textarea { 51 min-height: 100px; 52 } 53 } 54 55 .input-control { 56 background-color: $feedbackInputBg; 57 color: $feedbackInputTextColor; 58 59 &::-webkit-input-placeholder { 60 color: $feedbackInputPlaceholderColor; 61 } 62 &::-moz-placeholder { /* Firefox 19+ */ 63 color: $feedbackInputPlaceholderColor; 64 } 65 &:-ms-input-placeholder { 66 color: $feedbackInputPlaceholderColor; 67 } 68 } 69 70 .rating { 71 line-height: 1.2; 72 margin-top: 10px; 73 text-align: center; 74 75 .star-label { 76 font-size: 14px; 77 height: 16px; 78 } 79 80 .star-btn { 81 color: inherit; 82 cursor: pointer; 83 display: inline-block; 84 font-size: 34px; 85 outline: none; 86 position: relative; 87 text-decoration: none; 88 @include transition(all .2s ease); 89 90 &.active, 91 &:hover, 92 &.starHover { 93 color: #36B37E; 94 }; 95 96 } 97 .star-btn:focus, 98 .star-btn:active { 99 outline: 1px solid #B8C7E0; 100 } 101 } 102 }