This repository has been archived on 2022-01-02. You can view files and clone it, but cannot push or open issues/pull-requests.
AriaNg/src/styles/controls/angular-promise-buttons.css

114 lines
2.8 KiB
CSS

/* angular-promise-buttons */
@-webkit-keyframes three-quarters {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes three-quarters {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-o-keyframes three-quarters {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes three-quarters {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.btn-spinner {
font-family: sans-serif;
font-weight: 100;
}
.btn-spinner:not(:required) {
-webkit-animation: three-quarters 1250ms infinite linear;
-moz-animation: three-quarters 1250ms infinite linear;
-ms-animation: three-quarters 1250ms infinite linear;
-o-animation: three-quarters 1250ms infinite linear;
animation: three-quarters 1250ms infinite linear;
border: 3px solid #8c8c8c;
border-right-color: transparent;
border-radius: 100%;
box-sizing: border-box;
display: inline-block;
position: relative;
vertical-align: middle;
overflow: hidden;
text-indent: -9999px;
width: 18px;
height: 18px;
}
.btn-primary .btn-spinner:not(:required), .btn-danger .btn-spinner:not(:required) {
border: 3px solid #efefef;
border-right-color: transparent;
}
.btn-spinner:not(:required) {
margin-left: -17px;
opacity: 0;
transition: 0.4s margin ease-out, 0.2s opacity ease-out;
}
.is-loading .btn-spinner {
transition: 0.2s margin ease-in, 0.4s opacity ease-in;
margin-left: 5px;
opacity: 1;
}