{% extends "index.html" %}
{% block title %}Panel studenta{% endblock %}

{% block content %}
<div class="container header__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <span class="card-title">Panel studenta</span>
            </div>
        </div>
    </div>
</div>
<div class="container body__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <div class="card-content">
                    <span class="card-title card-title__body">Pytania studentów</span>
                    <ul id="questions-list">
                        <li>Pytanie odnośnie zadania domowego 12.11.2018<span class="counter"><i class="btn-thumb-up material-icons">thumb_up</i><span>12</span></span></li>
                        <li>Zagadnienia dotyczące egzaminu<span class="counter"><i class="btn-thumb-up material-icons">thumb_up</i><span>45</span></span></li>
                        <li>Czy 12 listopada odbędą się zajęcia?<span class="counter"><i class="btn-thumb-up material-icons">thumb_up</i><span>157</span></span></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container footer__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <div class="card-content footer__container--content">
                    <div class="col s4">Powrót</div>
                    <div class="col s4 modal-trigger" href="#modalAsk">Zadaj pytanie</div>
                    <div class="col s4">Informacje</div>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="modalAsk" class="modal">
    <div class="modal-content">
        <h4>Zadaj pytanie</h4>
        <form class="col s12">
            <div class="row">
                <div class="input-field col s12">
                <textarea id="textarea1" class="materialize-textarea"></textarea>
                <label for="textarea1">Tutaj wpisz swoje pytanie</label>
                </div>
            </div>
        </form>
    </div>
    <div class="modal-footer">
        <a href="#!" class="modal-close waves-effect red btn">Anuluj</a>
        <a href="#!" id="btn-send" class="modal-close waves-effect waves-primary btn">Wyślij</a>
    </div>
</div>
{% endblock %}

{%block script%}
<script>
    $(document).ready(() => {
        $('.modal').modal();
    });

    $('#btn-send').on('click', () => {
        alertify.notify('Pomyślnie wysłano wiadomość', 'success', 3);
    });
    $('.btn-thumb-up').on('click', () => {
        alertify.notify('Pomyślnie oceniono pytanie', 'success', 3);
    })
</script>
{%endblock%}