{{ define "main" }}

<!-- teachers -->
<section class="section">
  <div class="container">
    <div class="row">
			<div class="col-lg-12">
				<div class="btn-group portfolio-filter btn-group-toggle justify-content-center d-flex flex-wrap"
					data-toggle="buttons">
					<label class="btn btn-primary-outline active">
						<input type="radio" name="shuffle-filter" value="all" checked="checked" />{{ i18n "all"}}
					</label>
					{{ $categories := slice }}
					{{ range .Data.Pages }}
					{{ range .Params.Courses }}
					{{ $categories = $categories | append . }}
					{{ end }}
					{{ end }}
					{{ range ( $categories | uniq ) }}
					<label class="btn btn-primary-outline">
						<input type="radio" name="shuffle-filter" value="{{ . | urlize }}" />{{ . }}
					</label>
					{{ end }}
				</div>
			</div>
		</div>

    <br>
    <!-- teacher list -->
    <div class="row shuffle-wrapper">
      <!-- teacher -->
      {{ range .Data.Pages }}
      <div class="col-lg-4 col-sm-6 shuffle-item"
				data-groups="[{{range $index, $element:= .Params.Courses }}{{if ne $index 0}},{{end}}&quot;{{. | urlize}}&quot;{{ end }}]">
        {{ .Render "teacher" }}
      </div>
      {{ end }}
    </div>
  </div>
</section>
<!-- /teachers -->

{{ end }}