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

<style>
    .ui.button {
        cursor: pointer;
        display: inline-block;
        min-height: 1em;
        outline: none;
        border: none;
        vertical-align: baseline;
        background: #E0E1E2 none;
        color: rgba(0, 0, 0, 0.6);
        font-family: 'Lato', 'Helvsetica Neue', Arial, Helvetica, sans-serif;
        margin: 0em 0.25em 0em 0em;
        padding: 0.78571429em 1.5em 0.78571429em;
        text-transform: none;
        text-shadow: none;
        font-weight: bold;
        line-height: 1em;
        font-style: normal;
        text-align: center;
        text-decoration: none;
        border-radius: 0.28571429rem;
        -webkit-box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
        box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
        transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
        transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
        transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
        will-change: '';
        -webkit-tap-highlight-color: transparent;
    }
</style>

<div style="margin: 2em" class="ui one column centered grid">
    <div class="row">
        <div class="column">
            <h2 class="ui center aligned header">
                Welcome back, {{current_user.username}}!
                <div class="sub header">Choose a platform</div>
            </h2>
        </div>
    </div>

    <div class="row">
        <a style="padding: .2em" href="{{ url_for('twitter') }}"><button class="massive teal ui button">Twitter</button></a>
        <a style="padding: .2em" href="{{ url_for('youtube') }}"><button class="massive red ui button">Youtube</button></a>
    </div>
</div>
{% endblock %}