Files
pillar/src/styles/components/_search.sass

68 lines
1.2 KiB
Sass
Raw Normal View History

#search-overlay
position: fixed
top: 0
left: 0
right: 0
bottom: 0
width: 100%
height: 100%
visibility: hidden
opacity: 0
overflow-y: scroll
z-index: $zindex-sticky + 1
transition: visibility $long-transition, opacity $long-transition
&.show
opacity: 1
visibility: visible
background-color: rgba($body-bg, .7)
.qs-result
max-width: 80vw
#qs-toggle
opacity: 1
visibility: visible
.quick-search
opacity: 0
transition: opacity $short-transition
visibility: hidden
.quick-search.show
opacity: 1
visibility: visible
.qs-input
input
border-style: solid
border-radius: $border-radius
height: $input-height-inner
padding: $input-padding-y 25px $input-padding-y $input-padding-x
width: 30vw
&:focus
&+i+select
border-color: $color-primary
&.multi-scope // has a select next to it
border-right: none
border-bottom-right-radius: 0
border-top-right-radius: 0
select
border-width: 2px
border-left: none
border-bottom-right-radius: $border-radius
border-top-right-radius: $border-radius
height: $input-height-inner
margin-left: 5px
padding: $input-padding-y $input-padding-x
&:focus, option
// background-color: $dark
// color: $light
.qs-busy-symbol
margin-left: -2em