# Szablon: logowanie wersja alternatywna
# W katalogu
|--src/ → Pliki źródłowe
| |--templates/ → Szablony: katalog główny
| | |--pages/ → Szablony: podstrony
| | | |--login-alt.twig
# HTML
{% extends '../layouts/default.twig' %}
{% set head_title = 'Logowanie' %}
{% set body_class = 'bg-gradient' %}
{% block page %}
<div class="page page-register">
<div class="container">
<div class="row">
<div class="col-12">
<div class="page-container">
<div class="login-baner">
<a href="./" class="logo">
<img src="../img/logo.png" srcset="img/[email protected] 2x,
img/[email protected] 3x" alt="">
</a>
<a href="" class="btn btn-language">Change language <img src="img/flag-uk.jpg" srcset="img/[email protected] 2x,
img/[email protected] 3x"></a>
</div>
<form class="formValidation" action="">
<div class="bg bg-grey">
<div class="m-titleBar">
<div class="titleBar__title">Zaloguj się</div>
</div>
<div class="form-module">
<div class="input-field">
<label for="">Adres e-mail</label>
<input type="email" name="email" required>
</div>
<div class="input-field input-field__icon" data-js="showPassword">
<label for="">Hasło</label>
<input type="password" name="password" required>
<i class="icon icon-eye-slash"></i>
</div>
</div>
</div>
<div class="button-sets button-sets__space-between">
<div class="quarter order-1 order-md-0">
<a href="" class="btn btn-block">Resetuj hasło</a>
</div>
<div class="half order-0 order-md-1">
<button type="submit" class="btn btn-block btn-primary">Zaloguj SIĘ</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
{% include '../components/footer.twig' %}
</div>
{% endblock %}
{% block pagejs %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js" integrity="sha256-sPB0F50YUDK0otDnsfNHawYmA5M0pjjUf4TvRJkGFrI=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/localization/messages_pl.min.js" integrity="sha256-dBjdiP5KbMpHWhMtrAZIL8MU3Rxz09JA+z8VS650njc=" crossorigin="anonymous"></script>
<script>
$('.formValidation').validate({
ignore:":hidden",
highlight: function(element) {
if($(element).is('.dropzone-validation')) {
$(element).parent().addClass('is-error');
} else if($(element).is('.invisible') || $(element).is('select')) {
$(element).parent().addClass('is-error');
} else {
$(element).addClass('is-error');
}
},
unhighlight: function(element) {
if($(element).is('.dropzone-validation')) {
$(element).parent().removeClass('is-error');
} else if($(element).is('.invisible') || $(element).is('select')) {
$(element).parent().removeClass('is-error');
} else {
$(element).removeClass('is-error');
}
},
errorElement: 'div',
errorClass: 'help is-error',
errorPlacement: function(error, element) {
if(element.is('.invisible') || element.is('select')) {
error.insertAfter(element.parent().find('.select2-container'));
} else if (element.is('.dropzone-validation')) {
error.insertAfter(element.parent());
} else if(element.is('input[type="checkbox"]')) {
error.insertAfter(element.parent());
} else {
error.insertAfter(element);
}
}
});
</script>
{% endblock %}