{{ define "main" }}
<div class="col-xs-12 col-sm-8 col-md-9 content-column">
  {{ partial "mobile_nav_toggle.html" . }}
  <div class="row">
    <div class="col-lg-8">
      <article class="h-entry">

        <header>
         <h1 class="p-name">Platform: {{ .Title }}</h1>
        <hr/>
        </header>

        <div class="e-content">
        {{ .Content | safeHTML }}
        </div>

        Browse the Codex: <a href="/games">all games</a> | <a href="/platforms">by platform</a>  | <a href="/tags">the appendix</a><br/>

        <h2>Games &raquo;</h2>

        <div class="gamegridcontrols">
          Sort by: <button class="sortbtn sorted sorted-asc" data-sort="date">Date added</button>&nbsp;&nbsp;<button class="sortbtn" data-sort="name">Title</button>&nbsp;&nbsp;<button class="sortbtn" data-sort="year">Release year</button>&nbsp;&nbsp;<button class="sortbtn" data-sort="hours">How long to beat</button>
        </div>

        <div class="gamegrid">
          {{ $targetplatform := .Params.platform | lower }}
          {{ range sort (where .Site.Pages ".Section" "in" (slice  "games" "articles")) ".Params.game_name" "asc" }}
            {{ $platform := .Params.game_platform | lower }}
            {{ if eq $targetplatform $platform }}
              {{ partial "portfoliolite-block.html" . }}
            {{ end }}
          {{ end }}
        </div>

         <hr/>

      </article>
    </div>
  </div>
</div>
{{ end }}