<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8"/>
    <link rel="icon" type="image/png" sizes="96x96" href="{{ url_for('static', filename='img/logo.png') }}">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

    {% if title %}
        <title>Smart Garden - {{ title }}</title>
    {% else %}
        <title>Smart Garden</title>
    {% endif %}

    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport'/>
    <meta name="viewport" content="width=device-width"/>

    <!-- Main CSS -->
    <link href="{{ url_for('static', filename='css/main.css') }}" rel="stylesheet"/>

    <!-- Bootstrap core CSS     -->
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet"/>

    <!-- Animation library for notifications   -->
    <link href="{{ url_for('static', filename='css/animate.min.css') }}" rel="stylesheet"/>

    <!--  Paper Dashboard core CSS    -->
    <link href="{{ url_for('static', filename='css/paper-dashboard.css') }}" rel="stylesheet"/>

    <!--  Fonts and icons     -->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css"
          integrity="sha384-gfdkjb5BdAXd+lj+gudLWI+BXq4IuLW5IT+brZEZsLFm++aCMlF1V92rMkPaX4PP" crossorigin="anonymous">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" rel="stylesheet">
    <link href='https://fonts.googleapis.com/css?family=Muli:400,300' rel='stylesheet' type='text/css'>
    <link href="{{ url_for('static', filename='css/themify-icons.css') }}" rel="stylesheet">

    <script src="{{ url_for('static', filename='js/jquery.min.js') }}" type="text/javascript"></script>

</head>

<body>

<div class="wrapper">

    <div class="login">
        <form class="form-signin" method="POST" action="">
            {{ form.hidden_tag() }}
            <fieldset class="form-group">
                <legend class="border-bottom mb-4">Log In</legend>

                <div class="form-group">
                    {{ form.username.label(class="form-control-label") }}
                    {% if form.username.errors %}
                        {{ form.username(class="form-control form-control-lg is-invalid") }}
                        <div class="invalid-feedback">
                            {% for error in form.username.errors %}
                                <span>{{ error }}</span>
                            {% endfor %}
                        </div>
                    {% else %}
                        {{ form.username(class="form-control form-control-lg") }}
                    {% endif %}
                </div>

                <div class="form-group">
                    {{ form.password.label(class="form-control-label") }}
                    {% if form.password.errors %}
                        {{ form.password(class="form-control form-control-lg is-invalid") }}
                        <div class="invalid-feedback">
                            {% for error in form.password.errors %}
                                <span>{{ error }}</span>
                            {% endfor %}
                        </div>
                    {% else %}
                        {{ form.password(class="form-control form-control-lg") }}
                    {% endif %}
                </div>

                {% if error %}
                    <p class=error><strong>Error:</strong> {{ error }}
                  {% endif %}
            </fieldset>

            <div class="form-group">
                {{ form.submit(class="btn btn-outline-info") }}
            </div>
        </form>
    </div>

    <footer class="footer-login">
        <div class="container-fluid">
            <div class="copyright pull-right">
                 IOT Smart Garden <span class="text-info">Wendler Zacariotto</span>
            </div>
        </div>
    </footer>

</div>

</div>

</body>

<!--   Core JS Files   -->
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}" type="text/javascript"></script>

<!--  Checkbox, Radio & Switch Plugins -->
<script src="{{ url_for('static', filename='js/bootstrap-checkbox-radio.js') }}"></script>

<!--  Charts Plugin -->
<script src="{{ url_for('static', filename='js/chartist.min.js') }}"></script>

<!-- Paper Dashboard Core javascript and methods for Demo purpose -->
<script src="{{ url_for('static', filename='js/paper-dashboard.js') }}"></script>

<!--   Main JS File   -->
<script src="{{ url_for('static', filename='js/main.js') }}" type="text/javascript"></script>

</html>