2018-08-27 17:01:08 +02:00
|
|
|
#search-overlay
|
|
|
|
position: absolute
|
|
|
|
top: 0
|
|
|
|
left: 0
|
|
|
|
right: 0
|
|
|
|
bottom: 0
|
|
|
|
width: 100%
|
|
|
|
height: 100%
|
|
|
|
pointer-events: none
|
|
|
|
visibility: hidden
|
|
|
|
opacity: 0
|
|
|
|
z-index: $z-index-base + 4
|
|
|
|
transition: opacity 150ms ease-in-out
|
|
|
|
|
|
|
|
&.active
|
|
|
|
opacity: 1
|
|
|
|
visibility: visible
|
|
|
|
background-color: rgba($color-background-nav, .7)
|
|
|
|
|
|
|
|
.search-input
|
|
|
|
+media-lg
|
|
|
|
max-width: 350px
|
|
|
|
+media-md
|
|
|
|
max-width: 350px
|
|
|
|
+media-sm
|
|
|
|
max-width: 120px
|
|
|
|
+media-xs
|
|
|
|
display: block
|
|
|
|
margin: 0 10px
|
|
|
|
position: absolute
|
|
|
|
z-index: $z-index-base
|
|
|
|
right: 5px
|
|
|
|
position: relative
|
|
|
|
float: left
|
|
|
|
padding: 0
|
|
|
|
margin: 0
|
|
|
|
|
|
|
|
.search-icon
|
|
|
|
position: absolute
|
|
|
|
top: 4px
|
|
|
|
left: 10px
|
|
|
|
cursor: pointer
|
|
|
|
|
|
|
|
&:after
|
2018-08-31 19:32:17 +02:00
|
|
|
@extend .tooltip-inner
|
|
|
|
|
2018-08-27 17:01:08 +02:00
|
|
|
content: 'Use advanced search...'
|
|
|
|
font-size: .85em
|
2018-08-31 19:32:17 +02:00
|
|
|
font-style: normal
|
2018-08-27 17:01:08 +02:00
|
|
|
left: -10px
|
2018-08-31 19:32:17 +02:00
|
|
|
opacity: 0
|
|
|
|
pointer-events: none
|
2018-08-27 17:01:08 +02:00
|
|
|
position: absolute
|
2018-08-31 19:32:17 +02:00
|
|
|
top: 30px
|
2018-08-27 17:01:08 +02:00
|
|
|
transition: top 150ms ease-in-out, opacity 150ms ease-in-out
|
2018-08-31 19:32:17 +02:00
|
|
|
width: 150px
|
2018-08-27 17:01:08 +02:00
|
|
|
|
|
|
|
&:hover
|
|
|
|
&:after
|
|
|
|
opacity: 1
|
|
|
|
top: 35px
|
|
|
|
|
|
|
|
|
|
|
|
#cloud-search, .tt-hint
|
|
|
|
+text-overflow-ellipsis
|
|
|
|
border: thin solid $color-background
|
|
|
|
border-radius: 3px
|
|
|
|
font:
|
|
|
|
size: 1em
|
|
|
|
weight: 400
|
|
|
|
margin: 0
|
|
|
|
min-height: 32px
|
|
|
|
outline: none
|
|
|
|
padding: 0 20px 0 40px
|
|
|
|
transition: border 100ms ease-in-out
|
|
|
|
|
|
|
|
&:focus
|
|
|
|
box-shadow: none
|
|
|
|
border: none
|
|
|
|
|
|
|
|
&::placeholder
|
|
|
|
color: rgba($color-text, .5)
|
|
|
|
transition: color 150ms ease-in-out
|
|
|
|
|
|
|
|
&:hover
|
|
|
|
&::placeholder
|
|
|
|
color: rgba($color-text, .6)
|