diff options
| -rw-r--r-- | _layouts/journal.liquid | 18 | ||||
| -rw-r--r-- | _layouts/search.liquid | 92 | ||||
| -rw-r--r-- | pages/search.md | 6 | ||||
| -rw-r--r-- | public/js/posts.lunr.js | 23 |
4 files changed, 121 insertions, 18 deletions
diff --git a/_layouts/journal.liquid b/_layouts/journal.liquid index 6251483..e3f5ae4 100644 --- a/_layouts/journal.liquid +++ b/_layouts/journal.liquid @@ -30,24 +30,6 @@ </section> <!-- end hero --> - <!-- begin search --> - <section class="section"> - <div class="container"> - <form onsubmit="alert()"> - <div class="field"> - <div class="control"> - <input class="input is-rounded" - type="text" - placeholder="Search all posts..." - > - </div> - </div> - - </form> - </div> - </section> - <!-- end search --> - <!-- begin main content --> <section class="section"> <div class="container"> diff --git a/_layouts/search.liquid b/_layouts/search.liquid new file mode 100644 index 0000000..e1d2434 --- /dev/null +++ b/_layouts/search.liquid @@ -0,0 +1,92 @@ +<!DOCTYPE html> +<html> + <head> + {% include "head.liquid" %} + <script src="/public/js/lunr.js"></script> + <script src="/public/js/posts.lunr.js"></script> + </head> + + <body> + <!-- begin hero --> + <section class=" + hero + is-primary + "> + <!-- begin hero head --> + <div class="hero-head"> + {% include "nav.liquid" %} + </div> + <!-- end hero head --> + + <!-- begin hero body --> + <div class="hero-body"> + <div class="container"> + <h1 class="title"> + {{ page.title }} + </h1> + </div> + </div> + <!-- end hero body --> + + </section> + <!-- end hero --> + + <!-- begin search --> + <section class="section"> + <div class="container"> + <div class="field"> + <div class="control"> + <input class="input is-rounded" + type="text" + placeholder="Search all posts..." + > + </div> + </div> + + <button class="button" onclick="test()"> + search + </button> + </div> + </section> + <!-- end search --> + + <!-- begin main content --> + <section class="section"> + <div class="container"> + + <div class="content"> + {{ page.content }} + </div> + + </div> + </section> + <!-- end main content --> + + <!-- begin blog posts --> + <section class="section"> + <div class="container"> + <div class="columns"> + + <!-- begin short post list --> + <div class="column is-narrow"> + {% include all-posts.liquid %} + </div> + <!-- end short post list --> + + <!-- begin long post list --> + <div class="column"> + {% include post-list.liquid %} + </div> + <!-- end long post list --> + + </div> + </div> + </section> + <!-- end blog posts --> + + <footer class="footer"> + {% include "footer.liquid" %} + </footer> + </body> + +</html> diff --git a/pages/search.md b/pages/search.md new file mode 100644 index 0000000..09b576e --- /dev/null +++ b/pages/search.md @@ -0,0 +1,6 @@ +--- +title: Site Search +layout: search.liquid +permalink: "/{{slug}}" +--- +# Search the entire site diff --git a/public/js/posts.lunr.js b/public/js/posts.lunr.js new file mode 100644 index 0000000..bea1216 --- /dev/null +++ b/public/js/posts.lunr.js @@ -0,0 +1,23 @@ +let documents = [{ + "name": "Lunr", + "text": "Like Solr, but much smaller, and not as bright." +}, { + "name": "React", + "text": "A JavaScript library for building user interfaces." +}, { + "name": "Lodash", + "text": "A modern JavaScript utility library delivering modularity, performance & extras." +}]; + +function search() { + let searchIndex = lunr(function() { + this.ref("name") + this.field("text") + + documents.forEach(function(doc) { + this.add(doc) + }, this) + }); + + return searchIndex.search("bright"); +} |