NProgress.scss 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. /*nprogress*/
  2. #nprogress {
  3. pointer-events: none
  4. }
  5. #nprogress .bar {
  6. //background: $primary-linear-gradient;
  7. background: rgba($primary, .8);
  8. position: fixed;
  9. z-index: 1031;
  10. top: 0;
  11. left: 0;
  12. width: 100%;
  13. height: 2.5px
  14. }
  15. #nprogress .peg {
  16. display: block;
  17. position: absolute;
  18. right: 0;
  19. width: 100px;
  20. height: 100%;
  21. box-shadow: 0 0 10px $primary, 0 0 5px $primary;
  22. opacity: 1;
  23. -webkit-transform: rotate(3deg) translate(0, -4px);
  24. -ms-transform: rotate(3deg) translate(0, -4px);
  25. transform: rotate(3deg) translate(0, -4px)
  26. }
  27. #nprogress .spinner {
  28. display: block;
  29. position: fixed;
  30. z-index: 1031;
  31. top: 25px;
  32. right: 15px
  33. }
  34. #nprogress .spinner-icon {
  35. width: 18px;
  36. height: 18px;
  37. box-sizing: border-box;
  38. border: solid 2px transparent;
  39. border-top-color: $primary;
  40. border-left-color: $primary;
  41. border-radius: 50%;
  42. -webkit-animation: nprogress-spinner .4s linear infinite;
  43. animation: nprogress-spinner .4s linear infinite
  44. }
  45. .nprogress-custom-parent {
  46. overflow: hidden;
  47. position: relative
  48. }
  49. //.nprogress-custom-parent #nprogress .bar, .nprogress-custom-parent #nprogress .spinner {
  50. // position: absolute
  51. //}
  52. @-webkit-keyframes nprogress-spinner {
  53. 0% {
  54. -webkit-transform: rotate(0)
  55. }
  56. 100% {
  57. -webkit-transform: rotate(360deg)
  58. }
  59. }
  60. @keyframes nprogress-spinner {
  61. 0% {
  62. transform: rotate(0)
  63. }
  64. 100% {
  65. transform: rotate(360deg)
  66. }
  67. }
  68. /*nprogress*/