103 lines
2.4 KiB
Stylus
103 lines
2.4 KiB
Stylus
.imageControls
|
|
position: absolute
|
|
top: 0
|
|
right: 0
|
|
height: 100%
|
|
padding: 5px
|
|
|
|
#scrollbar
|
|
margin-top: 5px
|
|
width: 31px
|
|
|
|
#imageSlider
|
|
height: 2px
|
|
position: absolute
|
|
left: 20px
|
|
|
|
-webkit-appearance: none
|
|
|
|
transform: rotate(90deg)
|
|
-webkit-transform: rotate(90deg)
|
|
-moz-transform :rotate(90deg)
|
|
-o-transform: rotate(90deg)
|
|
-ms-transform: rotate(90deg)
|
|
|
|
transform-origin: top left
|
|
-webkit-transform-origin: top left
|
|
-moz-transform-origin: top left
|
|
-o-transform-origin: top left
|
|
-ms-transform-origin: top left
|
|
|
|
// Remove focus highlights on range input
|
|
&:focus
|
|
outline: none
|
|
-moz-box-shadow: none
|
|
-webkit-box-shadow: none
|
|
box-shadow: none
|
|
|
|
// Remove focus border in Firefox
|
|
&::-moz-focus-outer
|
|
border: none
|
|
|
|
// --- Style the range track --- //
|
|
&::-webkit-slider-runnable-track
|
|
height: 2px
|
|
border: 2px solid #bdc3c7
|
|
background-color: darkgrey
|
|
z-index: 6
|
|
|
|
&::-moz-range-track
|
|
height: 1px
|
|
border: 1px solid #bdc3c7
|
|
background-color: darkgrey
|
|
z-index: 6
|
|
|
|
&::-ms-track
|
|
height: 2px
|
|
border: 1px solid #bdc3c7
|
|
background-color: darkgrey
|
|
z-index: 6
|
|
|
|
// Hide any fill IE tries to add
|
|
&::-ms-fill-lower
|
|
background: transparent
|
|
|
|
&::-ms-fill-upper
|
|
background: transparent
|
|
|
|
// --- Style the range thumb --- //
|
|
&::-webkit-slider-thumb
|
|
-webkit-appearance: none !important
|
|
background-color: rgb(169, 169, 169)
|
|
border: 2px solid rgb(169, 169, 169)
|
|
border-radius: 2px
|
|
height: 15px
|
|
width: 25px
|
|
cursor: pointer
|
|
margin-top: -7px
|
|
|
|
&:active
|
|
background-color: rgb(34, 126, 163)
|
|
|
|
&::-moz-range-thumb
|
|
background-color: rgb(169, 169, 169)
|
|
border: 2px solid rgb(169, 169, 169)
|
|
border-radius: 2px
|
|
height: 11px
|
|
width: 20px
|
|
cursor: pointer
|
|
z-index: 7
|
|
|
|
&:active
|
|
background-color: rgb(34, 126, 163)
|
|
|
|
&::-ms-thumb
|
|
background-color: rgb(169, 169, 169)
|
|
border: 2px solid rgb(169, 169, 169)
|
|
border-radius: 2px
|
|
height: 11px
|
|
width: 20px
|
|
cursor: pointer
|
|
|
|
&:active
|
|
background-color: rgb(34, 126, 163) |