<!doctype html>
<html lang="en" xmlns:th="http://www.w3.org/1000/xhtml">
<head th:replace="common/header :: common-header"/>
<body>
<div th:replace="common/header :: navbar"/>
<div class="container">
<div class="row" style="margin-bottom: -100px;">
<div class="col-xs-8">
<h2 class="section-headline"><span>Featured books</span></h2>
</div>
<div class="col-xs-4">
<img src="/image/logo.jpeg" class="img-responsive"/>
</div>
</div>
<hr style="position:absolute; width: 88%; height: 6px; background-color: #333; z-index: -1; margin-top: -80px;"/>
s<img class="img-responsive" src="/image/wood.jpg" style="margin-top: -75px;"/>
<div class="row" style="margin-top: 60px;">
<div class="col-xs-offset-3">
<!-- Nav Tabs-->
<ul class="nav nav-tabs">
<li><a href="#tab-1" data-toggle="tab"><span style="color:red;">Create new Account</span></a></li>
<li><a href="#tab-2" data-toggle="tab"><span style="color:red;">Login</span></a></li>
<li><a href="#tab-3" data-toggle="tab"><span style="color:red;">Forget Password</span></a></li>
</ul>
<!-- Tab panels-->
<div class="tab-content">
<!-- Creating new user account-->
<div class="tab-pane fade" id="tab-1">
<div class="panel-group">
<div class="panel panel-default" style="border:none;">
<div class="panel-body" style="background-color: #ededed; margin-top: 20px;">
<form>
<div class="form-group">
<label for="newUsername">User name*</label>
<input required="required" type="text" class="form-control" id="newUsername" name="username"/>
<p style="color:#828282">Enter your user name</p>
</div>
<div class="form-group">
<label for="email">Email Address*</label>
<input required="required" type="email" class="form-control" id="email" name="email"/>
<p style="color:#828282">Enter your valid email<br>It will be used only for password reset
or for certain notifications
</p>
</div>
<button type="submit" class="btn-primary">Create new Account</button>
</form>
</div>
</div>
</div>
</div>
<!-- Login-->
<div class="tab-pane fade" id="tab-2">
<div class="panel-group">
<div class="panel panel-default" style="border:none;">
<div class="panel-body" style="background-color: #ededed; margin-top: 20px;">
<form>
<div class="form-group">
<label for="newUsername">User name*</label>
<input required="required" type="text" class="form-control" id="newUsername" name="username"/>
<p style="color:#828282">Enter your user name</p>
</div>
<div class="form-group">
<label for="password">Password*</label>
<input required="required" type="password" class="form-control" id="password" name="password"/>
<p style="color:#828282">Enter your password
</p>
</div>
<button type="submit" class="btn-primary">Login</button>
</form>
</div>
</div>
</div>
</div>
<!--Forget Password-->
<div class="tab-pane fade" id="tab-3">
<div class="panel-group">
<div class="panel panel-default" style="border:none;">
<div class="panel-body" style="background-color: #ededed; margin-top: 20px;">
<form>
<div class="form-group">
<label for="recoveryEmail">Email Address*</label>
<input required="required" type="email" class="form-control" id="recoveryEmail" name="email"/>
<p style="color:#828282">Enter your registered Email
</p>
</div>
<button type="submit" class="btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
<!-- Finish-->
</div>
</div>
</div>
<!--end of container-->
<div th:replace="common/header :: body-bottom-scripts"/>
</body>
</html>
Comments
Post a Comment