{% extends "mainTemplate.html" %}

{% block title %}User Dashboard{% endblock %}

{% block content %}
    <div class="container-fluid">
        <div style="padding-top: 100px; padding-left: 10px">
        <div class="card">
            <div class="card-body">


        <h2 style="text-align: center">Forms</h2>

            <div class="container">
                <hr>
                <div class="row">
                    <div class="col">
                    <h4 style="text-align: center">Observation</h4>
                    <p style="text-align: center"><i>Take if the individual does not wish to be disturbed.</i></p>


                    <p style="text-align: center">Start with adding individuals. </p>
                        <div class="d-flex justify-content-center">
                            <a href="/observation_ind_new" class="btn btn-info" role="button">Add Individual</a>
                        </div>

                    <p style="text-align: center; padding-top: 10px">
                        Then proceed to filling out the general observation form to attach the individuals.</p>
                        <div class="d-flex justify-content-center">
                            <a href="/observation_new" class="btn btn-success" role="button">Add Observation</a>
                        </div>
                    </div>
                <hr>
                    <div class="col">
                    <h4 style="text-align: center">Survey</h4>
                        <p style="text-align: center"><i>Take if the individual agrees to be surveyed.</i></p>

                        <p style="text-align: center">Start with adding individuals. </p>
                            <div class="d-flex justify-content-center">
                                <a href="/survey_new_ind" class="btn btn-info" role="button">Add Individual</a>
                            </div>

                        <p style="text-align: center; padding-top: 10px">
                            Then proceed to filling out the general survey form to attach the individuals.</p>
                            <div class="d-flex justify-content-center">
                                <a href="/survey_new" class="btn btn-success" role="button">Add Survey</a>
                            </div>
                    </div>
            </div>

     </div>
        </div>
        </div>
    </div>

{% endblock %}