<div class="container">
    <progress-spinner ng:show="!ready"></progress-spinner>
    <div class="row" id="login-form" ng:show="ready">
        <div class="col-sm-4">
        </div>
        <div class="col-sm-4" ng:show="!serial_ok">
            <div class="alert alert-danger">
                <i class="fa fa-warning"></i>
                <span>
                    <b translate>The used link is not valid or expired.</b>
                </span>
            </div>
        </div>
        <div class="col-sm-4" ng:show="serial_ok">
            <div ng:if="customization.plugins.core.bigLogoURL" class="text-center">
                <img ng:src="{{customization.plugins.core.bigLogoURL}}" />
            </div>
            <h1 class="text-center" style="perspective: 75px">
                <i class="fas fa-user-edit"></i>
            </h1>
            <div>
                <span translate>Please enter the new password</span>
                <input ng:model="password1" placeholder="{{'New password'|translate}}" type="password" class="form-control" />
            </div>
            <div>
                <span translate>Please confirm the new password</span>
                <input ng:model="password2" ng:enter="reset_password()" placeholder="{{'Reenter the new password'|translate}}" type="password" class="form-control" />
            </div>
            <div>
                <span ng:show="password1 && password1!=password2" style="color:red;" translate>
                    <small>The two entered passwords differ</small>
                </span>
                <a ng:click="save_password()" ng:disabled="!password1 || !password2 || password1!=password2" class="btn btn-primary btn-block">
                    <span translate>Reset password</span>
                </a>
            </div>
        </div>
        <div class="col-sm-4">
        </div>
    </div>
</div>
