{{> flash_msg}}
<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div class="well">   
                <h5 class="sidebar-title">Create An User</h5>
                <p>Lorem ipsum dolor sit amet, <strong>consectetur adipiscing</strong> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum <em>dolore eu fugiat nulla pariatur.</em></p>
            </div>
        </div>

        <div class="col-md-9">
            <h1>Create user</h1>
            <form action="/admin/users/create" id="article-user" method="post" enctype="multipart/form-data">
                {{! Field - Firstname }}
                <div class="form-group">
                    <label for="firstname">First name:</label>
                    <input autocomplete="off" class="form-control" id="firstname" name="firstname" placeholder="First name..." required type="text" value="" />
                </div>

                {{! Field - Lastname }}
                <div class="form-group">
                    <label for="lastname">Last name:</label>
                    <input autocomplete="off" class="form-control" id="lastname" name="lastname" placeholder="Last name..." required type="text" value="" />
                </div>

                {{! Field - Email }}
                <div class="form-group">
                    <label for="email">Email address:</label>
                    <input autocomplete="off" class="form-control" id="email" name="email" placeholder="Enter a valid email address name..." required type="email" value="" />
                </div>

                {{! Field - Password }}
                <div class="form-group">
                    <label for="password">Password:</label>
                    <input autocomplete="off" class="form-control" id="password" name="password" required type="password" value="" />
                </div>

                {{! Field - Roles }}
                {{> users/roles}}

                {{! Field - Bio }}
                <div class="form-group">
                    <label for="bio">Bio:</label>
                    <textarea class="form-control" id="bio" name="bio"></textarea>

                    <label for="bio_twitter">Twitter:</label>
                    <input autocomplete="off" class="form-control" id="bio_twitter" name="bio_twitter" placeholder="Twitter @handle" type="text" value="" />

                    <label for="bio_facebook">Facebook URL:</label>
                    <input autocomplete="off" class="form-control" id="bio_facebook" name="bio_facebook" placeholder="Facebook URL: https://www.facebook.com/billy.bob" type="text" value="" />

                    <label for="bio_linkedin">LinkedIn URL:</label>
                    <input autocomplete="off" class="form-control" id="bio_linkedin" name="bio_linkedin" placeholder="LinkedIn URL: https://uk.linkedin.com/in/billy.bob" required type="text" value="" />
                </div>

                {{! Field - Avatar }}
                <div class="form-group">
                    <label for="avatar">Avatar Image:</label>
                    <input class="form-control" id="avatar" name="avatar" type="file"/>
                </div>

                <div class="form-group">
                    <div class="well">
                        {{! Field - Author Style }}
                        <input id="author" type="checkbox" name="author" value="1">
                        <label for="author"><span></span>Is Author?</label>

                        {{! SUBMIT Button }}
                        <button type="submit" class="btn btn-lg btn-success">Create User</button>
                    </div>
                </div>
            </form>
        </div>
    </div>  
</div>