{% extends "template.html" %}
{% block content %}

<!-- Main -->
	<article id="main">
		<header>
			<h2>Dashboard</h2>
			<p>Your personal dashboard</p>
		</header>
		<section class="wrapper style5">
			<div class="inner">

				<h3>Current automatized tweets</h3>
        <hr />
          <table>
            {% for t in tweets %}
            <tr>
              <td><blockquote>{{ t }}</blockquote></td>
              <td><a href="#" class="button primary">Disable</a>
              <a href="#" class="button">Delet</a></td>
            </tr>
            {% endfor %}
          </table>
        <hr />

        <h3>Add an automatized tweet</h3>
        <hr />
        <section>
          <div class="row">
            <div class="col-6 col-12-medium">
              {% for t in timeline %}
              <div class="col-4 col-12-small">
                <input type="radio" id="{{ t['id'] }}" name="tweet">
                <label for="{{ t['id'] }}">{{ t['text'] }}</label>
              </div>
              {% endfor %}
            </div>
            <div class="col-6 col-12-medium">
              <input type="text" name="slots" placeholder="Slots number" />
              <input type="text" name="keywords" placeholder="Keywords (separate with a comma)" />
            </div>
          </div>
        </section>
        <input type="submit" value="Connect" class="button primary">
        <hr />

        <h3>Trello board</h3>
        <hr />
        <section>
          <div class="row">
            <div class="col-6 col-12-medium">
              <h4>Choose a board</h4>
            </div>
            <div class="col-6 col-12-medium">
              <h4>Choose a columns</h4>
            </div>
          </div>
        </section>
        <hr />
			</div>
		</section>
	</article>

{% endblock %}