2014-07-12 21:22:47 +02:00
|
|
|
//
|
|
|
|
|
// kremalicious3
|
|
|
|
|
// --------------
|
|
|
|
|
// Search
|
|
|
|
|
//
|
|
|
|
|
|
2015-11-28 01:19:31 +01:00
|
|
|
.has-search-open
|
2015-11-19 17:53:50 +01:00
|
|
|
overflow: hidden
|
|
|
|
|
|
|
|
|
|
.site__content
|
2016-04-17 00:17:17 +02:00
|
|
|
@extend .transition
|
|
|
|
|
filter: blur(10px) opacity(0.3)
|
2015-11-19 17:53:50 +01:00
|
|
|
user-select: none
|
|
|
|
|
pointer-events: none
|
2015-08-09 18:15:40 +02:00
|
|
|
|
2014-07-13 01:58:31 +02:00
|
|
|
.search-btn
|
2016-06-09 19:25:01 +02:00
|
|
|
right: 70px
|
2014-07-13 01:58:31 +02:00
|
|
|
padding: .65em .85em
|
|
|
|
|
|
2016-06-09 19:25:01 +02:00
|
|
|
@media $screen-md
|
|
|
|
|
right: 50px
|
2014-07-12 21:22:47 +02:00
|
|
|
|
|
|
|
|
.search-close
|
|
|
|
|
position: absolute
|
2015-11-19 17:53:50 +01:00
|
|
|
right: 14px
|
2014-07-12 21:22:47 +02:00
|
|
|
|
|
|
|
|
&,
|
|
|
|
|
&:active
|
2015-11-19 17:53:50 +01:00
|
|
|
top: 8%
|
2014-07-12 21:22:47 +02:00
|
|
|
|
|
|
|
|
.search-area
|
|
|
|
|
@extend .transition
|
|
|
|
|
position: absolute
|
|
|
|
|
left: 0
|
2015-11-20 22:35:41 +01:00
|
|
|
top: -7px
|
2014-07-12 21:22:47 +02:00
|
|
|
z-index: 3
|
2016-06-09 19:25:01 +02:00
|
|
|
margin-left: ($spacer / 2)
|
|
|
|
|
margin-right: ($spacer / 2)
|
|
|
|
|
width: "calc(100% - %s)" % $spacer
|
2014-07-12 21:22:47 +02:00
|
|
|
|
|
|
|
|
// hidden by default
|
2014-07-13 22:21:56 +02:00
|
|
|
display: none
|
2014-07-12 21:22:47 +02:00
|
|
|
|
2016-06-12 18:18:51 +02:00
|
|
|
@media $screen-md
|
2016-06-09 19:25:01 +02:00
|
|
|
margin-left: 0
|
|
|
|
|
margin-right: 0
|
|
|
|
|
width: 100%
|
|
|
|
|
|
2015-11-28 01:19:31 +01:00
|
|
|
&.is-ready
|
2014-07-13 22:21:56 +02:00
|
|
|
display: block
|
2014-07-12 21:22:47 +02:00
|
|
|
|
2016-06-09 19:25:01 +02:00
|
|
|
.form-control
|
|
|
|
|
background: #fff
|
|
|
|
|
|
2015-08-18 20:55:30 +02:00
|
|
|
|
|
|
|
|
.search-popover
|
|
|
|
|
position: absolute
|
|
|
|
|
left: 0
|
2016-04-17 00:17:17 +02:00
|
|
|
top: ($spacer*2.4)
|
|
|
|
|
bottom: 0
|
2015-08-18 20:55:30 +02:00
|
|
|
z-index: 6
|
|
|
|
|
width: 100%
|
2016-04-17 00:17:17 +02:00
|
|
|
max-height: 90vh
|
|
|
|
|
padding: ($spacer / 2) 0
|
|
|
|
|
overflow: auto
|
|
|
|
|
-webkit-overflow-scrolling: touch
|
2015-08-18 20:55:30 +02:00
|
|
|
|
2016-06-09 19:25:01 +02:00
|
|
|
@media $screen-sm
|
2016-04-17 00:17:17 +02:00
|
|
|
top: ($spacer * 3)
|
2015-08-09 18:15:40 +02:00
|
|
|
|
2016-04-17 00:17:17 +02:00
|
|
|
.search-results
|
2016-06-12 18:18:51 +02:00
|
|
|
@extend .breakoutviewport
|
2016-04-17 00:17:17 +02:00
|
|
|
padding-bottom: $spacer
|
2014-07-13 00:42:57 +02:00
|
|
|
|
|
|
|
|
.search-link
|
2016-04-17 00:17:17 +02:00
|
|
|
@extend .h4
|
2015-11-19 17:53:50 +01:00
|
|
|
line-height: $line-height-small
|
2015-08-09 18:15:40 +02:00
|
|
|
margin: 0
|
2016-04-17 00:17:17 +02:00
|
|
|
padding: ($spacer / 2)
|
2014-07-13 00:42:57 +02:00
|
|
|
display: block
|
2016-04-17 00:17:17 +02:00
|
|
|
border-bottom: 1px solid alpha($brand-grey-light, .2)
|
|
|
|
|
box-shadow: 0 1px 0 alpha(#fff,.2)
|
2015-11-19 17:53:50 +01:00
|
|
|
|
2016-04-17 00:17:17 +02:00
|
|
|
&:hover
|
|
|
|
|
background: $link-color
|
|
|
|
|
color: #fff
|
