diff --git a/assets/js/search-interactions.js b/assets/js/search-interactions.js index c516fea03..6aca60da0 100644 --- a/assets/js/search-interactions.js +++ b/assets/js/search-interactions.js @@ -1,7 +1,9 @@ +// Fade content wrapper when focusing on search input $('#algolia-search-input').focus(function() { $('.content-wrapper').fadeTo(400, .35); }) +// Hide search dropdown when leaving search input $('#algolia-search-input').blur(function() { $('.content-wrapper').fadeTo(200, 1); $('.ds-dropdown-menu').hide(); diff --git a/assets/styles/layouts/_algolia-search-overrides.scss b/assets/styles/layouts/_algolia-search-overrides.scss index f5146caec..d3fe978bd 100644 --- a/assets/styles/layouts/_algolia-search-overrides.scss +++ b/assets/styles/layouts/_algolia-search-overrides.scss @@ -90,6 +90,20 @@ } } +.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion { + &--wrapper { padding: 0; } + &--subcategory-column { display: none; } + &--content { + margin: 2px 0; + padding: .75rem; + width: 100%; + float: none; + &:before { + display: none; + } + } +} + //////////////////////////////////////////////////////////////////////////////// ///////////////////////////////// MEDIA QUERIES //////////////////////////////// //////////////////////////////////////////////////////////////////////////////// @@ -114,15 +128,6 @@ left: -1rem !important; top: 112% !important; } - .algolia-autocomplete .algolia-docsearch-suggestion { - .algolia-docsearch-suggestion--subcategory-column, - .algolia-docsearch-suggestion--content { - display: block; - margin: 2px 0; - float: none; - &:after { content: ""; } - } - } } @include media(small) {