<div class="container-fluid" style="padding: 20px;" >
    <h2 class="featurette-heading"><span class="">Control Panel Protection</span></h2>
    <hr>
    <h4 class="featurette-heading"><span class="text-muted">The control panel will be protected and a login be requested</span></h4>
    <br><br>
    <div class="featurette" style="background: transparent !important;">
        {% if flash['credentials_msg'] %}
            <div class="alert alert-info alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <strong>{{ flash['credentials_msg']|raw }}</strong> 
            </div>
        {% endif %}
            <form id="credential_admin" class="form-horizontal" method="POST" action="raptor/newcredentials/config">
                <div class="row">
                    <div class="col-md-4">
                        <label class="control-label" for="username">Admin Username</label>
                        <div class="controls">
                            <input class="form-control" name="username" type="text" id="username" placeholder="" value="{{ username }}">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <label class="control-label" for="password">Password</label>
                        <div class="controls">
                            <input name="password" class="form-control" type="password" id="password" placeholder="" value="">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <label class="control-label" for="repassword">Password Repeat</label>
                        <div class="controls">
                            <input name="repassword" class="form-control" type="password" id="repassword" placeholder="" value="">
                        </div>
                    </div>
                </div>
                <div class="row pull-left" style="margin-top: 40px;margin-bottom: 40px;">
                    <div class="col-md-4">
                        <button type="submit" id="btn-config" class="btn btn-success"><i class="glyphicon glyphicon-ok" style=""></i> Save</button>
                    </div>
                </div>
            </form>
            <br><br>
            <p class="lead">
            </p>
        </div>
    </div>
{{ validation|raw }}
    <script type="text/javascript">
        $(document.body).ready(function() {
            $('#credential_admin').submit(function(e){
                
                if(e.originalEvent.defaultPrevented!==true)
                    UIR.load.show('registering new credentials...');
            })
        });
        </script>
 
  |