Untitled

<!DOCTYPE html>
<html lang="pl" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Ankietyzacja</title>
    <script type="text/javascript" src="../static/js/jquery.js" th:src="@{/js/jquery.js}"></script>
    <script type="text/javascript" src="../static/js/classie.js" th:src="@{/js/classie.js}"></script>
    <script type="text/javascript" src="../static/js/bootstrap.js" th:src="@{/js/bootstrap.js}"></script>
    <link rel="stylesheet" type="text/css" href="../static/style.css" th:href="@{/style.css}"/>
    <link  rel="stylesheet" href="../static/bootstrap.css" th:href="@{/bootstrap.css}" />
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"/>
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="home.html">System ankietyzacji PRz</a>
            </div>
            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <li>
                        <a href="login.html">Zaloguj</a>
                    </li>
                    <li>
                        <a href="register.html">Zarejestruj</a>
                    </li>
                    <li>
                        <a href="#">Kontakt</a>
                    </li>
                    <li>
                        <a><span th:text="${session.name}">Niezalogowany </span></a>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container -->
    </nav>
    <div class="centered">
    <div class="container">
        <div class="col-lg-4 col-xs-12">
            <h1 class="text-center main-title">System ankietyzacji PRz</h1>
        </div>
        <div class="content col-lg-8 col-xs-12">
            <form class="login-group" method="post" action="/user/login.try">
            <div class="login-group-container">
                <span class="input input--jiro">
                    <input class="input__field input__field--jiro" type="text" id="login" name="login" ></input>
                    <label class="input__label input__label--jiro" for="login">
                        <span class="input__label-content input__label-content--jiro">Login</span>
                    </label>
                </span>

                <span class="input input--jiro">
                    <input class="input__field input__field--jiro" type="password" id="password" name="password" ></input>
                    <label class="input__label input__label--jiro" for="password">
                        <span class="input__label-content input__label-content--jiro">Hasło</span>
                    </label>
                </span>

                <span class="input input--jiro">
                    <input class="btn btn-default btn-lg btn-block" type="submit" name="send" value="Zaloguj"></input>
                </span>
                </div>
            </form>
            <div class="below-form-options">
                <a href="#">Zapomniałeś hasła?</a>
                <a href="#">Nie posiadasz jeszcze konta?</a>
            </div>
        </div>
    </div>
    </div>
    <script>
        (function() {
                // trim polyfill : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim
                if (!String.prototype.trim) {
                    (function() {
                        // Make sure we trim BOM and NBSP
                        var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
                        String.prototype.trim = function() {
                            return this.replace(rtrim, '');
                        };
                    })();
                }

                [].slice.call( document.querySelectorAll( 'input.input__field' ) ).forEach( function( inputEl ) {
                    // in case the input is already filled..
                    if( inputEl.value.trim() !== '' ) {
                        classie.add( inputEl.parentNode, 'input--filled' );
                    }

                    // events:
                    inputEl.addEventListener( 'focus', onInputFocus );
                    inputEl.addEventListener( 'blur', onInputBlur );
                } );

                function onInputFocus( ev ) {
                    classie.add( ev.target.parentNode, 'input--filled' );
                }

                function onInputBlur( ev ) {
                    if( ev.target.value.trim() === '' ) {
                        classie.remove( ev.target.parentNode, 'input--filled' );
                    }
                }
            })();
    </script>
</body>
</html>