Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <%@page contentType="text/html" pageEncoding="UTF-8"%>
- <%@taglib uri="/struts-tags" prefix="s"%>
- <html>
- <head>
- <title>HVH's Store</title>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.2/js/swiper.min.js"></script>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.2/css/swiper.min.css">
- <style>
- html, body {
- position: relative;
- }
- ul.navbar-hungdtq > li {
- font-weight: bold;
- text-align: center;
- }
- .navbar{
- margin-bottom: 0;
- }
- .navbar-footer > li {
- font-weight: bold;
- text-align: center;
- }
- .login-form{
- padding: 10px;
- }
- .swiper-container {
- width: 100%;
- height: 100%;
- }
- .swiper-slide {
- text-align: center;
- font-size: 18px;
- background: #fff;
- /* Center slide text vertically */
- display: -webkit-box;
- display: -ms-flexbox;
- display: -webkit-flex;
- display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- -webkit-justify-content: center;
- justify-content: center;
- -webkit-box-align: center;
- -ms-flex-align: center;
- -webkit-align-items: center;
- align-items: center;
- }
- div.swiper-slide > img {
- width: 600px;
- height: 800px;
- }
- .container-hungdtq{
- background: white;
- padding: 1%;
- width: 100%;
- height: 10vh;
- }
- .main-hungdtq{
- background: white;
- padding-top: 1%;
- }
- .mega-menu {
- position: absolute;
- padding: 10px 0px;
- width: 110vh;
- height: 82vh;
- border-radius: 0;
- margin-top: 0px;
- }
- .mega-menu li {
- display: inline-block;
- float: left;
- font-size: 0.94rem;
- padding: 3px 0px;
- }
- .mega-menu li.mega-menu-column {
- margin-right: 20px;
- width: 20vh;
- }
- .mega-menu .nav-header {
- padding: 0 !important;
- margin-bottom: 10px;
- display: inline-block;
- width: 100%;
- border-bottom: 1px solid #ddd;
- }
- li.mega-menu-column > ul > li > a{
- color: #777;
- }
- li.mega-menu-column > ul {
- display: inline-block;
- }
- li.mega-menu-column > ul > li {
- font-size: 1.5vh;
- }
- .well{
- padding: 8vh 0vh;
- }
- h4 {
- font-size: 8vh;
- }
- /* Profile container */
- .profile {
- margin: 20px 0;
- }
- /* Profile sidebar */
- .profile-sidebar {
- padding: 20px 0 10px 0;
- background: #fff;
- }
- .profile-userpic img {
- float: none;
- margin: 0 auto;
- width: 50%;
- height: 50%;
- -webkit-border-radius: 50% !important;
- -moz-border-radius: 50% !important;
- border-radius: 50% !important;
- }
- .profile-usertitle {
- text-align: center;
- margin-top: 20px;
- }
- .profile-usertitle-name {
- color: #5a7391;
- font-size: 16px;
- font-weight: 600;
- margin-bottom: 7px;
- }
- .profile-usertitle-job {
- text-transform: uppercase;
- color: #5b9bd1;
- font-size: 12px;
- font-weight: 600;
- margin-bottom: 15px;
- }
- .profile-userbuttons {
- text-align: center;
- margin-top: 10px;
- }
- .profile-userbuttons .btn {
- text-transform: uppercase;
- font-size: 11px;
- font-weight: 600;
- padding: 6px 15px;
- margin-right: 5px;
- }
- .profile-userbuttons .btn:last-child {
- margin-right: 0px;
- }
- .profile-usermenu {
- margin-top: 30px;
- }
- .profile-usermenu ul li {
- border-bottom: 1px solid #f0f4f7;
- }
- .profile-usermenu ul li:last-child {
- border-bottom: none;
- }
- .profile-usermenu ul li a {
- color: #93a3b5;
- font-size: 14px;
- font-weight: 400;
- }
- .profile-usermenu ul li a i {
- margin-right: 8px;
- font-size: 14px;
- }
- .profile-usermenu ul li a:hover {
- background-color: #fafcfd;
- color: #5b9bd1;
- }
- .profile-usermenu ul li.active {
- border-bottom: none;
- }
- .profile-usermenu ul li.active a {
- color: #5b9bd1;
- background-color: #f6f9fb;
- border-left: 2px solid #5b9bd1;
- margin-left: -2px;
- }
- /* Profile Content */
- .profile-content {
- padding: 20px;
- background: #fff;
- min-height: 460px;
- }
- input.hidden {
- position: absolute;
- left: -9999px;
- }
- #profile-image1 {
- cursor: pointer;
- width: 100px;
- height: 100px;
- border:2px solid #03b1ce ;}
- .tital{ font-size:16px; font-weight:500;}
- .bot-border{ border-bottom:1px #f8f8f8 solid; margin:5px 0 5px 0}
- </style>
- <s:head/>
- </head>
- <body>
- <!--Tool bar-->
- <nav class="navbar navbar-default navbar-fixed-top main-hungdtq">
- <div class="container-hungdtq">
- <div class="col-md-1" >
- <a class="navbar-brand" rel="home" href="#">
- <img style="max-width: 100px; margin-top: -50px;" src="https://i.pinimg.com/736x/6f/55/e1/6f55e1ddd3d428846ab97062f9af3ad8--line-logo-design-logo-k.jpg">
- </a>
- </div>
- <div class="col-md-1">
- </div>
- <div class="col-md-5">
- <form action="SearchForBookAction">
- <div class="input-group">
- <input type="text" class="form-control" placeholder="Tìm kiếm" name="search">
- <div class="input-group-btn">
- <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
- </div>
- </div>
- </form>
- </div>
- <div class="col-md-1">
- </div>
- <s:set var="username" value="%{#session.USERNAME}"/>
- <s:set var="fail" value="%{#session.failed}"></s:set>
- <ul class="nav navbar-nav col-md-4">
- <s:if test="%{#username == null || #username == ''}">
- <li class="col-md-3"><a href="signup"><span class="glyphicon glyphicon-user"></span> Đăng ký</a></li>
- <!--Login-->
- <li class="col-md-3">
- <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span class="glyphicon glyphicon-user"></span>Đăng nhập</a>
- <div class="dropdown-menu login-form" style="padding: 15px; padding-bottom: 0px;">
- <form action="login" class="form-inline">
- <div class="form-group">
- <label>Username: </label>
- <input class="form-control" type="text" placeholder="Enter username" name="username">
- </div>
- <div>
- <label>Password: </label>
- <input class="form-control" type="password" placeholder="Enter password" name="password">
- </div>
- <input type="submit" value="Đăng nhập" class="btn btn-success" style="margin-top: 5px; margin-bottom: 5px; margin-left: 25%">
- </form>
- <script>
- <s:if test="%{#fail != null}">
- alert("Wrong username or password!");
- </s:if>
- </script>
- </div>
- </li>
- <!--End of Login-->
- </s:if>
- <s:if test="%{#username != null || #username == ''}">
- <li class="col-md-4"><a href="#"><span class="glyphicon glyphicon-log-in">Welcome, <s:property value="#username"/></span></a></li>
- <li class="col-md-4"><a href="<s:url action="RedirectToProfileAction"/>"><span claRedirectToProfileActionss="glyphicon glyphicon-log-in"></span> Tài khoản của tôi</a></li>
- <li class="col-md-2"><a href="#"><span class="glyphicon glyphicon-shopping-cart"></span></a></li>
- </s:if>
- </ul>
- </div>
- <!--Navigation bar-->
- <nav class="navbar navbar-default">
- <ul class="navbar-hungdtq nav navbar-nav row" style="width: 100%;">
- <li class="col-md-1"></li>
- <li class="col-md-2"><a href="#">SÁCH BÁN CHẠY</a></li>
- <li class="col-md-2"><a href="#">KHUYẾN MÃI HOT</a></li>
- <li class="dropdown col-md-2">
- <a class="dropdown" data-toggle="dropdown" href="#">KHO SÁCH<span class="caret"></span></a>
- <ul class="dropdown-menu mega-menu">
- <li class="mega-menu-column">
- <ul>
- <li class="nav-header">Khoa học kỹ thuật</li>
- <li><a href="#">Tin học</a></li>
- <li><a href="#">Y học</a></li>
- <li><a href="#">Điện - điện tử</a></li>
- <li><a href="#">Cơ khí</a></li>
- </ul>
- </li>
- <li class="mega-menu-column">
- <ul>
- <li class="nav-header">Kinh tế</li>
- <li><a href="#">Quản trị - Lãnh đạo</a></li>
- <li><a href="#">Nhân vật - Bài học kinh doanh</a></li>
- <li><a href="#">Khởi nghiệp - Làm giàu</a></li>
- <li><a href="#">Marketing - Bán hàng</a></li>
- <li><a href="#">Tài chính - Ngân hàng</a></li>
- </ul>
- </li>
- <li class="mega-menu-column">
- <ul>
- <li class="nav-header">Thiếu nhi</li>
- <li><a href="#">Truyện tranh</a></li>
- <li><a href="#">Truyện đọc</a></li>
- <li><a href="#">Tô màu - Luyện chữ</a></li>
- <li><a href="#">Kiến thức bách khoa</a></li>
- <li><a href="#">Manga</a></li>
- </ul>
- </li>
- <li class="mega-menu-column">
- <ul>
- <li class="nav-header">Văn học trong nước</li>
- <li><a href="#">Phóng sự - Ký sự</a></li>
- <li><a href="#">Nhân vật văn học</a></li>
- <li><a href="#">Thơ ca</a></li>
- <li><a href="#">Tiểu thuyết lịch sử</a></li>
- <li><a href="#">Tiểu thuyết lãng mạng</a></li>
- </ul>
- </li>
- <li class="mega-menu-column">
- <ul>
- <li class="nav-header">Văn học nước ngoài</li>
- <li><a href="#">Cổ tích - Thần thoại</a></li>
- <li><a href="#">Truyện lịch sử</a></li>
- <li><a href="#">Truyện ngắn</a></li>
- <li><a href="#">Truyện trinh thám</a></li>
- <li><a href="#">Vụ án</a></li>
- </ul>
- </li>
- </ul>
- </li>
- <li class="col-md-2"><a href="#">SỰ KIỆN SÁCH</a></li>
- <li class="col-md-2"><a href="#">KHO SÁCH CŨ</a></li>
- </ul>
- </nav>
- <!--End of Navigation bar-->
- </nav>
- <!--End of Tool bar-->
- <!--Body-->
- <div style="padding-top: 180px ">
- <div class="container">
- <s:form cssClass="well form-horizontal" action="register" method="get" id="contact_form" theme="simple">
- <center><h4>REGISTER</h4></center>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label">Tên của bạn:</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
- <s:textfield name="name" placeholder="" cssClass="form-control" type="text"/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label">Username</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
- <s:textfield name="username" placeholder="Tên tài khoản" cssClass="form-control" type="text"/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label" >Mật khẩu:</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
- <s:textfield name="password" placeholder="" cssClass="form-control" type="password"/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label" >Xác nhận:</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
- <s:textfield name="confirm "placeholder=" mật khẩu của bạn" cssClass="form-control" type="password"/>
- </div>
- </div>
- </div>
- <!-- Pick -->
- <div class="form-group">
- <label class="col-md-4 control-label">Giới tính</label>
- <div class="col-md-4 selectContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
- <s:combobox label="Hãy chọn giới tính của bạn" name="gender" cssClass="form-control selectpicker"
- list="{'1':'Nam', '2':'Nu'}
- "/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label">E-Mail</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
- <s:textfield name="email" placeholder="Địa chỉ E-Mail" cssClass="form-control" type="text"/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label">Địa chỉ</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
- <s:textfield name="address" placeholder="Địa chỉ của bạn" cssClass="form-control" type="text"/>
- </div>
- </div>
- </div>
- <!-- Text input-->
- <div class="form-group">
- <label class="col-md-4 control-label">Số điện thoại</label>
- <div class="col-md-4 inputGroupContainer">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
- <s:textfield name="phone" placeholder="(08)" cssClass="form-control" type="text"/>
- </div>
- </div>
- </div>
- <!-- Button -->
- <div class="form-group">
- <label class="col-md-4 control-label"></label>
- <div class="col-md-4"><br>
- <s:submit type="submit" cssClass="btn btn-warning" name="Đăng ký" /><span class="glyphicon glyphicon-send"></span>
- </div>
- </div>
- </s:form>
- </div>
- </div>
- <!--End of Body-->
- <!--Footer-->
- <footer class="footer">
- <nav class="navbar navbar-default">
- <ul class="navbar-footer nav navbar-nav row" style="width: 100%;">
- <li class="col-md-1"></li>
- <li class="col-md-2"><a href="#">VỀ CHÚNG TÔI</a></li>
- <li class="col-md-2"><a href="#">LIÊN HỆ</a></li>
- <li class="col-md-2"><a href="#">ĐỊA ĐIỂM</a></li>
- <li class="col-md-2"><a href="#">ĐÓNG GÓP Ý KIẾN</a></li>
- <li class="col-md-2"><a href="#">CHÍNH SÁCH</a></li>
- </ul>
- </nav>
- </footer>
- <!--End of Footer-->
- </body>
Add Comment
Please, Sign In to add comment