nprogress.css 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. /* Make clicks pass-through */
  2. #nprogress {
  3. pointer-events: none;
  4. }
  5. #nprogress .bar {
  6. background: #29d;
  7. position: fixed;
  8. z-index: 1031;
  9. top: 0;
  10. left: 0;
  11. width: 100%;
  12. height: 2px;
  13. }
  14. /* Fancy blur effect */
  15. #nprogress .peg {
  16. display: block;
  17. position: absolute;
  18. right: 0px;
  19. width: 100px;
  20. height: 100%;
  21. box-shadow: 0 0 10px #29d, 0 0 5px #29d;
  22. opacity: 1.0;
  23. -webkit-transform: rotate(3deg) translate(0px, -4px);
  24. -ms-transform: rotate(3deg) translate(0px, -4px);
  25. transform: rotate(3deg) translate(0px, -4px);
  26. }
  27. /* Remove these to get rid of the spinner */
  28. #nprogress .spinner {
  29. display: block;
  30. position: fixed;
  31. z-index: 1031;
  32. top: 15px;
  33. right: 15px;
  34. }
  35. #nprogress .spinner-icon {
  36. width: 18px;
  37. height: 18px;
  38. box-sizing: border-box;
  39. border: solid 2px transparent;
  40. border-top-color: #29d;
  41. border-left-color: #29d;
  42. border-radius: 50%;
  43. -webkit-animation: nprogress-spinner 400ms linear infinite;
  44. animation: nprogress-spinner 400ms linear infinite;
  45. }
  46. .nprogress-custom-parent {
  47. overflow: hidden;
  48. position: relative;
  49. }
  50. .nprogress-custom-parent #nprogress .spinner,
  51. .nprogress-custom-parent #nprogress .bar {
  52. position: absolute;
  53. }
  54. @-webkit-keyframes nprogress-spinner {
  55. 0% { -webkit-transform: rotate(0deg); }
  56. 100% { -webkit-transform: rotate(360deg); }
  57. }
  58. @keyframes nprogress-spinner {
  59. 0% { transform: rotate(0deg); }
  60. 100% { transform: rotate(360deg); }
  61. }