nprogress.less 1.5 KB

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