mirror of https://github.com/fspc/workstand.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
2.3 KiB
67 lines
2.3 KiB
{% extends 'base.html' %}
|
|
|
|
{% load staticfiles compress %}
|
|
|
|
{% block styles %}
|
|
{{ block.super }}
|
|
{% compress css %}
|
|
<link href="{% static 'vendor/material-design-lite/src/icon-toggle/_icon-toggle.scss' %}" rel="stylesheet" type="text/x-scss">
|
|
{% endcompress %}
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
{{ block.super }}
|
|
<script>
|
|
var passwordToggle = document.getElementById('icon-toggle-1');
|
|
passwordToggle.addEventListener('change', function () {
|
|
toggle();
|
|
});
|
|
|
|
var passwordField = document.getElementById('password');
|
|
|
|
var toggle = function () {
|
|
if (passwordToggle.checked) {
|
|
passwordField.type = 'password';
|
|
passwordToggle.nextElementSibling.textContent = 'visibility_off'
|
|
}
|
|
else {
|
|
passwordField.type = 'text';
|
|
passwordToggle.nextElementSibling.textContent = 'visibility'
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
|
|
|
|
|
|
{% block content %}
|
|
<div class="demo-graphs mdl-shadow--2dp mdl-color--white mdl-cell mdl-cell--8-col mdl-shadow--2dp">
|
|
<h2 class="mdl-card__title-text">Welcome</h2>
|
|
<form method="post">
|
|
{% if form.non_field_errors %}
|
|
<div>
|
|
<span class="error">{{ form.non_field_errors }}</span>
|
|
</div>
|
|
{% endif %}
|
|
{% csrf_token %}
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" type="text" id="username" name="username">
|
|
<label class="mdl-textfield__label" for="username">Email address</label>
|
|
</div>
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" type="password" id="password" name="password">
|
|
<label class="mdl-textfield__label" for="password">Password</label>
|
|
</div>
|
|
<label class="mdl-icon-toggle mdl-js-icon-toggle mdl-js-ripple-effect" for="icon-toggle-1">
|
|
<input type="checkbox" id="icon-toggle-1" class="mdl-icon-toggle__input" checked>
|
|
<i class="mdl-icon-toggle__label material-icons">visibility_off</i>
|
|
</label>
|
|
<div>
|
|
<button type="submit" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
|
|
Login
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
</div>
|
|
{% endblock %}
|