{% extends 'base.html' %}
{% block content %}

  <h4 class="center">Settings</h4>

  <div class="bold center" id="dark-pref">
    <p><span>NOTE<span>: Your browser has indicated that you prefer a dark theme.</p>
    <p>This will always override the "Light" theme setting here!</p>
  </div>

  <form class="center" id="settings" action="{{ url_for('.settings_edit') }}" method="post">
    <table style="margin: 0 auto;">
      <thead>
        <tr></tr>
      </thead>
      <tbody>

        <tr>
          <td>
            <label>{% if icons %}<i class="fas fa-palette"></i> {% endif %}Theme selection</label>
          </td>
          <td>
            <select id="themes" class="center" name="theme">
              {% for t in themes %}
                <option value="{{ t.name }}"{% if t.name in theme %} selected{% endif %}>{{ t.proper }}</option>
              {% endfor %}
            </select>
          </td>
        </tr>

        <tr>
          <td>
            <label>{% if icons %}<i class="fas fa-icons"></i> {% endif %}Enable or disable icons
            </label>
          </td>
          <td>
            <select class="center" name="icons">
              <option value="disabled"{% if not icons %} selected{% endif %}>Disabled</option>
              <option value="enabled"{% if icons %} selected{% endif %}>Enabled</option>
            </select>
          </td>
        </tr>

      </tbody>
    </table>
    <input style="margin:0 auto; margin-top:10px;" class="center" type="submit" value="Submit">
  </form>
{% endblock %}
