{% extends "/base.html" %}

{%- block control -%}<section>
  {% if input.type != 'password' %}
  <p><span style="white-space: pre">{{ input.value }}</span>
    {% if input.multiple %}<a href=":%0A{{Q}}">↲</a>{% endif %}</p>
  <hr />
  {% endif %}
  <p><strong>abc</strong> | <a href="latin1-upper/{{Q}}">ABC</a> |
      <a href="latin1-symbol/{{Q}}">!@#</a> |
      <a href="latin1-accent-lower/{{Q}}">àêï</a> |
      <a href="latin1-accent/{{Q}}">ÀÊÏ</a></p>
  <table>
    <tr>
      <td><a href=":a{{Q}}">a</a></td>
      <td><a href=":b{{Q}}">b</a></td>
      <td><a href=":c{{Q}}">c</a></td>
      <td><a href=":d{{Q}}">d</a></td>
      <td><a href=":e{{Q}}">e</a></td>
      <td><a href=":f{{Q}}">f</a></td>
    </tr>
    <tr>
      <td><a href=":g{{Q}}">g</a></td>
      <td><a href=":h{{Q}}">h</a></td>
      <td><a href=":i{{Q}}">i</a></td>
      <td><a href=":j{{Q}}">j</a></td>
      <td><a href=":k{{Q}}">k</a></td>
      <td><a href=":l{{Q}}">l</a></td>
    </tr>
    <tr>
      <td><a href=":m{{Q}}">m</a></td>
      <td><a href=":n{{Q}}">n</a></td>
      <td><a href=":o{{Q}}">o</a></td>
      <td><a href=":p{{Q}}">p</a></td>
      <td><a href=":q{{Q}}">q</a></td>
      <td><a href=":r{{Q}}">r</a></td>
    </tr>
    <tr>
      <td><a href=":s{{Q}}">s</a></td>
      <td><a href=":t{{Q}}">t</a></td>
      <td><a href=":u{{Q}}">u</a></td>
      <td><a href=":v{{Q}}">v</a></td>
      <td><a href=":w{{Q}}">w</a></td>
      <td><a href=":x{{Q}}">x</a></td>
    </tr>
    <tr>
      <td><a href=":y{{Q}}">y</a></td>
      <td><a href=":z{{Q}}">z</a></td>
      <td><a href=":1{{Q}}">1</a></td>
      <td><a href=":2{{Q}}">2</a></td>
      <td><a href=":3{{Q}}">3</a></td>
      <td><a href=":4{{Q}}">4</a></td>
    </tr>
    <tr>
      <td><a href=":5{{Q}}">5</a></td>
      <td><a href=":6{{Q}}">6</a></td>
      <td><a href=":7{{Q}}">7</a></td>
      <td><a href=":8{{Q}}">8</a></td>
      <td><a href=":9{{Q}}">9</a></td>
      <td><a href=":0{{Q}}">0</a></td>
    </tr>
    {% if input.inputType == "email" || input.inputType == "url" %}<tr>
      {% if input.inputType == "email" %}
        <td><a href=":@{{Q}}">@</a></td>
      {% else %}
        <td><a href=":{{ '/'|xURI }}{{Q}}">/</a></td>
      {% endif %}
      <td><a href=":.{{Q}}">.</a></td>
      <td colspan="2"><a href=":.com{{Q}}">.com</a>
      <td colspan="2"><a href=":.org{{Q}}">.org</a>
    </tr>{% endif %}
    <tr>
      <td colspan="2"><a href=":%20{{Q}}">SPACE</a></td>
      <td colspan="2"><a href="-{{Q}}">DEL</a></td>
      <td colspan="2"><a href="={{Q}}">CLEAR</a></td>
    </tr>
  </table>
</section>{%- endblock -%}