You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

43 lines
1.3 KiB

---
layout: default
---
<div class="search container max-width-2">
<div id="search-container">
<h3 class="center mb3 blue">Chowdown Search</h3>
<input type="text" id="search-input" placeholder="search titles or ingredients...">
</div>
</div>
<div class="clearfix">
<div class="recipes xs-px1 xs-mt2 center" id="results-container">
</div>
</div>
<!-- Script pointing to search-script.js -->
<script src="{{site.baseurl}}/plugins/simple-jekyll-search.min.js" type="text/javascript"></script>
<!-- Configuration -->
<script>
SimpleJekyllSearch({
searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('results-container'),
json: '{{site.baseurl}}/search.json',
searchResultTemplate: '<div class="sm-col sm-col-6 md-col-6 lg-col-4 xs-px1 xs-mb2 left-align"><a class="block relative bg-blue" href="{url}"><div class="image ratio bg-cover" style="background-image:url({image});"></div><h1 class="title p2 m0 absolute bold white bottom-0 left-0">{title}</h1></a></div>'
})
</script>
<script>
$( document ).ready(function() {
$('#search-input').on('input', function() {
currentHeight = $('#search-container').outerHeight();
$('.search').addClass('used').css('height', currentHeight);
});
});
</script>