jiti-meet/css/modals/feedback/_feedback.scss

110 lines
2.2 KiB
SCSS
Raw Normal View History

2016-09-13 16:15:07 +00:00
@-webkit-keyframes shake-rotate {
0% {
-webkit-transform:scale(1) rotate(0deg);
transform:scale(1) rotate(0deg)
}
2015-11-05 17:27:26 +00:00
2016-09-13 16:15:07 +00:00
50% {
-webkit-transform:scale(.8) rotate(-5deg);
transform:scale(.8) rotate(-5deg)
}
to {
-webkit-transform:scale(1) rotate(3deg);
transform:scale(1) rotate(3deg)
}
2015-11-05 17:27:26 +00:00
}
2016-09-13 16:15:07 +00:00
@keyframes shake-rotate {
0% {
-webkit-transform:scale(1) rotate(0deg);
transform:scale(1) rotate(0deg)
}
50% {
-webkit-transform:scale(.8) rotate(-5deg);
transform:scale(.8) rotate(-5deg)
}
to {
-webkit-transform:scale(1) rotate(3deg);
transform:scale(1) rotate(3deg)
}
2015-11-05 17:27:26 +00:00
}
2016-09-13 16:15:07 +00:00
.shake-rotate {
2016-09-14 15:11:53 +00:00
display: inline-block;
2016-09-13 16:15:07 +00:00
-webkit-animation-duration: .4s;
animation-duration: .4s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: shake-rotate;
animation-name: shake-rotate;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out
2015-11-05 17:27:26 +00:00
}
2016-09-14 15:11:53 +00:00
.feedback {
2016-09-13 16:15:07 +00:00
h2 {
font-weight: 400;
2016-09-13 16:15:07 +00:00
font-size: 24px;
line-height: 1.2;
}
p {
2016-09-14 15:11:53 +00:00
font-weight: 400;
font-size: 14px;
}
2016-09-14 15:11:53 +00:00
&__content {
text-align: center;
2016-09-13 16:15:07 +00:00
}
2016-09-14 15:11:53 +00:00
&__footer {
2016-09-13 16:15:07 +00:00
&:hover {
2016-09-14 15:11:53 +00:00
color: #287ade;
outline: 0;
}
}
&__rating {
line-height: 1.2;
padding: 20px 0;
2016-09-14 15:11:53 +00:00
p {
margin: 10px 0 0;
}
2016-09-13 16:15:07 +00:00
2016-09-14 15:11:53 +00:00
.star-label {
font-size: 16px;
color: $rateStarLabelColor;
2016-09-13 16:15:07 +00:00
}
2016-09-14 15:11:53 +00:00
.star-btn {
color: $rateStarDefault;
font-size: 36px;
2016-09-13 16:15:07 +00:00
position: relative;
2016-09-14 15:11:53 +00:00
cursor: pointer;
outline: none;
text-decoration: none;
@include transition(all .2s ease);
&.starHover,
&.active,
&:hover {
color: $rateStarActivity;
> i:before {
content: "\e90a";
}
};
}
}
&__details {
text-align: left;
textarea {
resize: vertical;
min-height: 100px;
2016-09-13 16:15:07 +00:00
}
}
}