<!-- Get data maybe from custom Luckperms API -->
<div class="flex flex-col">
  {{ range .Site.Data.team.ranks }}
  <h2>{{.name | humanize }}</h2>
  <div class="flex flex-row flex-wrap ranks -{{.name}}">
    {{ range .members }}
    <div id="{{.uid}}" class="flex flex-row playerbox ml-4 pr-5 pt-4">
      <div class="mx-6">
        <img src="http://localhost:3000/renders/body/{{.uid}}?overlay&scale=5" alt="{{.name}}" class="playerimage w-16">
      </div>
      <div id="description" class="flex flex-col text-center">
        <p><b>Name: </b>{{.name}}</p>
        <p><b>Location: </b><img src="https://flagsapi.com/{{.loc}}/flat/32.png" alt=""></p>
        <p>
          <b>Languages: </b>
          {{ range .lang }}
          <img src="https://flagsapi.com/{{.}}/flat/32.png" alt="">
          {{ end }}
        </p>
      </div>
    </div>
    {{ end }}
  </div>
  {{ end }}
</div>
