{% extends "main.html" %}
{% block title %}Locations{% endblock %}
{% block mainBlock %}
<div id="myBtnContainer">
  <button class="btn active" onclick="filterSelection('all')"> Show all</button>
  <button class="btn" onclick="filterSelection('Wales')"> Wales</button>
  <button class="btn" onclick="filterSelection('North-England')"> North England</button>
  <button class="btn" onclick="filterSelection('South-West-England')"> South West England</button>
  <button class="btn" onclick="filterSelection('Midlands')"> Midlands</button>
  <button class="btn" onclick="filterSelection('Scotland')"> Scotland</button>
</div>

<div class="container">
  <div class="filterDiv Wales">Location 1</div>
  <div class="filterDiv Wales">Location 2</div>
  <div class="filterDiv North-England">Location 3</div>
  <div class="filterDiv North-England">Location 4</div>
  <div class="filterDiv South-West-England">Location 5</div>
  <div class="filterDiv South-West-England">Location 6</div>
  <div class="filterDiv South-West-England">Location 7</div>
  <div class="filterDiv Midlands">Location 8</div>
  <div class="filterDiv Midlands">Location 9</div>
  <div class="filterDiv Scotland">Location 10</div>
  <div class="filterDiv Scotland">Location 11</div>
  <div class="filterDiv Scotland">Location 12</div>
</div>
{% endblock %}