|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="utf-8"> |
|
|
<title>Seeker</title> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
<link rel="stylesheet" href="../css/lumen.css" media="screen"> |
|
|
<link rel="stylesheet" href="../vendor/font-awesome/css/font-awesome.min.css" media="screen"> |
|
|
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> |
|
|
<!--[if lt IE 9]> |
|
|
<script src="../bower_components/html5shiv/dist/html5shiv.js"></script> |
|
|
<script src="../bower_components/respond/dest/respond.min.js"></script> |
|
|
<![endif]--> |
|
|
<style> |
|
|
.placeholder img { |
|
|
display: inline-block; |
|
|
border-radius: 5%; |
|
|
} |
|
|
.navbar-default { |
|
|
background-color: rgba(248, 248, 248, 0.9); |
|
|
border-color: rgba(231, 231, 231, 0.9); |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="navbar navbar-default navbar-fixed-top"> |
|
|
<div class="container-fluid"> |
|
|
<div class="navbar-header"> |
|
|
<a href="../" class="navbar-brand">Seeker</a> |
|
|
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main"> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="navbar-collapse collapse navbar-responsive-collapse"> |
|
|
<ul class="nav navbar-nav"> |
|
|
<li class="active"><a href="#">Home</a></li> |
|
|
<li><a href="#"><i class="fa fa-heart-o"></i> Wish List</a></li> |
|
|
</ul> |
|
|
<form class="navbar-form navbar-left"> |
|
|
<input type="text" class="form-control col-lg-8" placeholder="Search"> |
|
|
</form> |
|
|
<ul class="nav navbar-nav navbar-right"> |
|
|
<li><a href="#"><i class="fa fa-shopping-cart"></i> Cart</a></li> |
|
|
<li class="dropdown"> |
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">You <b class="caret"></b></a> |
|
|
<ul class="dropdown-menu"> |
|
|
<li><a href="#">Account</a></li> |
|
|
<li><a href="#"><i class="fa fa-inbox"></i> Inbox</a></li> |
|
|
<li class="divider"></li> |
|
|
<li><a href="#">Logout</a></li> |
|
|
</ul> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="container"> |
|
|
<br/> |
|
|
<div class="page-header" id="banner"> |
|
|
<div class="row"> |
|
|
<div class="col-lg-8 col-md-7 col-sm-6"> |
|
|
<h1>Hot Items</h1> |
|
|
<p class="lead">เสื้อผ้า</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row placeholders"> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzBEOEZEQiIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojZmZmO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzM5REJBQyIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojMUUyOTJDO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzBEOEZEQiIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojZmZmO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzM5REJBQyIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojMUUyOTJDO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
</div> |
|
|
<br/> |
|
|
<div class="row"> |
|
|
<div class="col-lg-12 text-center"> |
|
|
<div class="btn-group"> |
|
|
<button type="button" class="btn btn-default"><i class="fa fa-2x fa-long-arrow-left"></i></button> |
|
|
<button type="button" class="btn btn-default"><i class="fa fa-2x fa-long-arrow-right"></i></button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<hr/> |
|
|
<div class="row"> |
|
|
<div class="col-lg-8 col-md-7 col-sm-6"> |
|
|
<p class="lead">โทรศัพท์</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row placeholders"> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzBEOEZEQiIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojZmZmO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzM5REJBQyIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojMUUyOTJDO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzBEOEZEQiIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojZmZmO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzM5REJBQyIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjEwMCIgeT0iMTAwIiBzdHlsZT0iZmlsbDojMUUyOTJDO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjEzcHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+MjAweDIwMDwvdGV4dD48L3N2Zz4=" data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<br/> |
|
|
<div class="row"> |
|
|
<div class="col-lg-12 text-center"> |
|
|
<div class="btn-group"> |
|
|
<button type="button" class="btn btn-default"><i class="fa fa-2x fa-long-arrow-left"></i></button> |
|
|
<button type="button" class="btn btn-default"><i class="fa fa-2x fa-long-arrow-right"></i></button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<hr/> |
|
|
|
|
|
<footer> |
|
|
<div class="row"> |
|
|
<div class="col-lg-12"> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
<script src="../vendor/jquery/dist/jquery.min.js"></script> |
|
|
<script src="../vendor/bootstrap/dist/js/bootstrap.min.js"></script> |
|
|
</body> |
|
|
</html>
|
|
|
|
