123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- #loading-bar,
- #loading-bar-spinner {
- -webkit-pointer-events: none;
- pointer-events: none;
- transition: 350ms linear all;
- }
- #loading-bar.ng-enter,
- #loading-bar.ng-leave.ng-leave-active,
- #loading-bar-spinner.ng-enter,
- #loading-bar-spinner.ng-leave.ng-leave-active {
- opacity: 0;
- }
- #loading-bar.ng-enter.ng-enter-active,
- #loading-bar.ng-leave,
- #loading-bar-spinner.ng-enter.ng-enter-active,
- #loading-bar-spinner.ng-leave {
- opacity: 1;
- }
- #loading-bar .bar {
- position: fixed;
- top: 0;
- left: 0;
- z-index: 20002;
- width: 100%;
- height: 2px;
- background: #20a8d8;
- border-top-right-radius: 1px;
- border-bottom-right-radius: 1px;
- transition: width 350ms;
- }
- #loading-bar .peg {
- position: absolute;
- top: 0;
- right: 0;
- width: 70px;
- height: 2px;
- border-radius: 100%;
- -ms-box-shadow: #29d 1px 0 6px 1px;
- box-shadow: #29d 1px 0 6px 1px;
- opacity: .45;
- }
- #loading-bar-spinner {
- position: fixed;
- top: 10px;
- left: 10px;
- z-index: 10002;
- display: block;
- }
- #loading-bar-spinner .spinner-icon {
- width: 14px;
- height: 14px;
- border: solid 2px transparent;
- border-top-color: #29d;
- border-left-color: #29d;
- border-radius: 50%;
- -webkit-animation: loading-bar-spinner 400ms linear infinite;
- animation: loading-bar-spinner 400ms linear infinite;
- }
- @-webkit-keyframes loading-bar-spinner {
- 0% {
- -webkit-transform: rotate(0deg);
- transform: rotate(0deg);
- }
- 100% {
- -webkit-transform: rotate(360deg);
- transform: rotate(360deg);
- }
- }
- @keyframes loading-bar-spinner {
- 0% {
- -webkit-transform: rotate(0deg);
- transform: rotate(0deg);
- transform: rotate(0deg);
- }
- 100% {
- -webkit-transform: rotate(360deg);
- transform: rotate(360deg);
- transform: rotate(360deg);
- }
- }
- .pace {
- -webkit-pointer-events: none;
- pointer-events: none;
- -moz-user-select: none;
- -webkit-user-select: none;
- -ms-user-select: none;
- user-select: none;
- }
- .pace-inactive {
- display: none;
- }
- .pace .pace-progress {
- position: fixed;
- top: 0;
- right: 100%;
- z-index: 2000;
- width: 100%;
- height: 2px;
- background: #20a8d8;
- }
|