diff options
| -rw-r--r-- | sitestatic/archweb.css | 25 | ||||
| -rw-r--r-- | templates/public/index.html | 18 |
2 files changed, 43 insertions, 0 deletions
diff --git a/sitestatic/archweb.css b/sitestatic/archweb.css index 70caf8f..905a3ec 100644 --- a/sitestatic/archweb.css +++ b/sitestatic/archweb.css @@ -486,6 +486,31 @@ h3 span.arrow { border: 1px solid #09c; } + .pkgsearch-typeahead { + position: absolute; + top: 100%; + left: 0; + z-index: 1000; + display: none; + float: left; + padding: 0.15em 0.1em; + margin: 0; + min-width: 10em; + font-size: 0.812em; + text-align: left; + list-style: none; + background-color: #f6f9fc; + border: 1px solid #09c; + } + + .pkgsearch-typeahead li a { + color: #000; + } + + .pkgsearch-typeahead li.active a { + color: #07b; + } + /* home: recent pkg updates */ #pkg-updates h3 { margin: 0 0 0.3em; diff --git a/templates/public/index.html b/templates/public/index.html index 60ae442..4af5995 100644 --- a/templates/public/index.html +++ b/templates/public/index.html @@ -215,4 +215,22 @@ </div> {% endcache %} + +{% load cdn %}{% jquery %} +<script type="text/javascript" src="{% static "bootstrap-typeahead.js" %}"></script> +<script type="text/javascript"> +$(document).ready(function() { + $('#pkgsearch-field').typeahead({ + source: function(query, callback) { + $.getJSON('/opensearch/packages/suggest', {q: query}, function(data) { + callback(data[1]); + }); + }, + matcher: function(item) { return true; }, + sorter: function(items) { return items; }, + menu: '<ul class="pkgsearch-typeahead"></ul>', + items: 10 + }).attr('autocomplete', 'off'); +}); +</script> {% endblock %} |