{% import 'components/discussions.html' as discussions %}

<div class="page-separator">
  <div class="page-separator__text">{{ title }}</div>
</div>

<div class="card">
  <div class="card-header">
    <div class="row align-items-center" style="white-space: nowrap;">
      <div class="col-lg-auto">
        <form class="search-form {{ search_form }} d-lg-inline-flex mb-8pt mb-lg-0" action="{{ prefix or ''}}discussions.html">
          <input type="text" class="form-control w-lg-auto" placeholder="Search discussions">
          <button class="btn" type="submit" role="button"><i class="material-icons">search</i></button>
        </form>
      </div>
      <div class="col-lg d-flex flex-wrap align-items-center">
        <div class="ml-lg-auto dropdown">
          <a href="#" class="btn btn-link dropdown-toggle text-70" data-toggle="dropdown">All Topics</a>
          <div class="dropdown-menu dropdown-menu-right">
            <a href="" class="dropdown-item active">All Topics</a>
            <a href="" class="dropdown-item">My Topics</a>
          </div>
        </div>
        <div class="dropdown mr-8pt">
          <a href="#" class="btn btn-link dropdown-toggle text-70" data-toggle="dropdown">Newest</a>
          <div class="dropdown-menu dropdown-menu-right">
            <a href="" class="dropdown-item active">Newest</a>
            <a href="" class="dropdown-item">Unanswered</a>
          </div>
        </div>
        <a href="{{ prefix or '' }}discussions-ask.html" class="btn btn-accent">Ask a question</a>
      </div>
    </div>
  </div>
  
  {{ discussions.component(items=[{
    avatar: 'LB',
    date: '2 days ago',
    name: 'Laza Bogdan',
    title: 'Using Angular HttpClientModule instead of HttpModule',
    chips: ['Angular fundamentals']
  }, {
    avatar: 'AC',
    date: '3 days ago',
    name: 'Adam Curtis',
    title: 'Why am I getting an error when trying to install angular/http@2.4.2'
  }, {
    avatar: 'EH',
    date: '4 days ago',
    name: 'Emilie Howard',
    title: 'Using Angular HttpClientModule instead of HttpModule'
  }, {
    avatar: 'JK',
    date: '6 days ago',
    name: 'Jason Klein',
    title: 'Why am I getting an error when trying to install angular/http@2.4.2'
  }], prefix=prefix) }}

  <div class="card-footer">
    {% include 'layouts/_pagination.html' %}
    <!-- <a href="" class="text-70 text-underline">View more discussions</a> -->
  </div>
</div>