chappe/src/templates/_body_search.jade

Developer Docs builder. Write guides in Markdown and references in API Blueprint. Comes with a built-in search engine.

//- chappe
//-
//- Copyright 2021, Crisp IM SAS
//- Author: Valerian Saliou <valerian@valeriansaliou.name>

#search
  .spotlight(
    data-has-results="false"
  )
    .spotlight-box
      .spotlight-field
        input.spotlight-input.font-sans-regular(
          name="search",
          type="search",
          placeholder="#{$_.COMMON.SEARCH.FIELD.INPUT_PLACEHOLDER}"
        )

      .spotlight-results
        ul.spotlight-entries

      .spotlight-legend
        .spotlight-shortcuts
          - var shortcuts = [["navigate", $_.COMMON.SEARCH.LEGEND.SHORTCUT_NAVIGATE], ["go", $_.COMMON.SEARCH.LEGEND.SHORTCUT_GO], ["close", $_.COMMON.SEARCH.LEGEND.SHORTCUT_CLOSE]];

          each shortcut in shortcuts
            .spotlight-shortcut(
              class="spotlight-shortcut--#{shortcut[0]}"
            )
              | #{shortcut[1]}

        span.spotlight-error.text-ellipsis.font-sans-semibold
          | #{$_.COMMON.SEARCH.LEGEND.ERROR_INDEX}