---
title: Search | Compass Documentation
crumb: Search
body_id: search
---
- content_for(:javascripts) do
  %script(type="text/javascript" src="/javascripts/search-data.js")
  %script(type="text/javascript" src="/javascripts/jquery.url.packed.js")
  :javascript
    $(function(){
      if ($.url.param("q")) {
        var query = $.url.param("q").replace("+"," ");
        $('input#q').attr('value', query);
        search(query, displayResults);
      }
      $('input#q').keyup(function(){
        search(this.value, displayResults);
      });
    })
    function displayResults(items) {
      if (items.length > 0) {
        var html = ""
        for (var i = 0; i < items.length; i++) {
          html += '<li><a href="'+items[i].url+'">'+items[i].title+'</a></li>';
        }
        $('ol#results').html(html)
      } else {
        $('ol#results').html("<li class='none'>Nothing found.</li>");
      }
    }
%input#q{:type => "text", :placeholder=>"Search"}

%h2 Index of all:
%ul#indexes
  %li
    %a(href="/index/variables/") Variables
  %li
    %a(href="/index/mixins/") Mixins
  %li
    %a(href="/index/functions/") Functions

%h2 Results
%ol#results
  %li.none Please enter a search term.