category_page.hbs

<section class="section hero hero-small">
  <header class="hero-inner">
    <div class="hero-inner-search">
      {{search submit=false scoped=settings.scoped_kb_search class="search search-full" placeholder="Search knowledge base..."}}
    </div>
  </header>
</section>

<div class="container">

  <nav class="sub-nav">
    {{breadcrumbs}}
  </nav>

  <div class="category-container">
    <div class="category-content">
      {{!-- <header class="page-header">
        <h1>{{category.name}}</h1>
        {{#if category.description}}<p class="page-header-description">{{category.description}}</p>{{/if}}
      </header> --}}

      <div class="section-tree">
        {{#each sections}}
        <section class="section">
          <h2 class="section-tree-title">
            {{#is name 'Getting started'}}
            <i class="fas fa-rocket" style="color:#74BF95;font-size:28px;"></i>
            {{/is}}
            <a href="{{url}}">{{name}}</a>
          </h2>
          {{#if articles}}
          <ul class="article-list">
            {{#each articles}}
            <li class="article-list-item{{#if promoted}} article-promoted{{/if}}">
              {{#if promoted}}
              <span data-title="{{t 'promoted'}}" class="icon-star"></span>
              {{/if}}
              <a href="{{url}}" class="article-list-link">{{title}}</a>
              {{#if internal}}
              <span class="icon-lock" title="{{t 'internal'}}"></span>
              {{/if}}
            </li>
            {{/each}}
          </ul>
          {{#if more_articles}}
          <a href="{{url}}" class="see-all-articles">
            {{t 'show_all_articles' count=article_count}}
          </a>
          {{/if}}
          {{/if}}
        </section>
        {{else}}
        <i class="category-empty">
          <a href="{{category.url}}">{{t 'empty'}}</a>
        </i>
        {{/each}}
      </div>
    </div>
  </div>
</div>

{{!-- get category name and add to search bar placeholder --}}
{{#if settings.scoped_kb_search}}
<script>
  var breadcrumbs = document.getElementsByClassName("breadcrumbs");
  var categoryName = breadcrumbs[0].children[1].title;
  document.getElementById("query").placeholder = "Search " + categoryName + "...";
</script>
{{/if}}