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
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>
|