You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Hydro/packages/ui-default/components/nprogress/nprogress.page.styl

67 lines
1.5 KiB
Stylus

$spinner-size = 18px
$spinner-margin = ($nav-item-height - $spinner-size) / 2
#nprogress
pointer-events: none
#nprogress .bar
background: $nprogress-color
position: fixed
z-index: 1031
top: 0
left: 0
width: 100%
height: 2px
&+above(rupture.mobile-cutoff)
background: $nprogress-color-floating
#nprogress .peg
display: block
position: absolute
right: 0px
width: 100px
height: 100%
box-shadow: 0 0 10px $nprogress-color, 0 0 5px $nprogress-color
opacity: 1.0
transform: rotate(3deg) translate(0px, -4px)
&+above(rupture.mobile-cutoff)
box-shadow: 0 0 10px $nprogress-color-floating, 0 0 5px $nprogress-color-floating
#nprogress .spinner
display: block
position: fixed
z-index: 1031
top: rem($spinner-margin)
right: rem($spinner-margin)
#nprogress .spinner-icon
width: rem($spinner-size)
height: rem($spinner-size)
box-sizing: border-box
border: solid 2px transparent
border-top-color: $nprogress-color
border-left-color: $nprogress-color
border-radius: 50%
animation: nprogress-spinner 400ms linear infinite
&+above(rupture.mobile-cutoff)
border-top-color: $nprogress-color-floating
border-left-color: $nprogress-color-floating
.nprogress-custom-parent
overflow: hidden
position: relative
.nprogress-custom-parent #nprogress .spinner,
.nprogress-custom-parent #nprogress .bar
position: absolute
@keyframes nprogress-spinner
0%
transform: rotate(0deg)
100%
transform: rotate(360deg)