|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="utf-8"> |
|
|
<title>Home | Seeker</title> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
<link rel="stylesheet" href="../css/lumen.min.css" media="screen"> |
|
|
<link rel="stylesheet" href="../vendor/font-awesome/css/font-awesome.min.css" media="screen"> |
|
|
<link rel="stylesheet" href="../css/dashboard.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); |
|
|
} |
|
|
body { |
|
|
color: #4FB0AE; |
|
|
} |
|
|
.container a:hover { text-decoration: none; } |
|
|
.image-wrapper { |
|
|
display: block; |
|
|
margin-bottom: 8px; |
|
|
} |
|
|
.image-wrapper { |
|
|
position: relative; |
|
|
overflow: hidden; |
|
|
float: left; |
|
|
display: inline; |
|
|
} |
|
|
.kink .headline-wrapper { |
|
|
float: left; |
|
|
position: relative; |
|
|
display: block; |
|
|
width: 180px; |
|
|
min-height: 40px; |
|
|
margin: -55px 144px 0px 0px; |
|
|
padding: 5px; |
|
|
background-color: rgba(255, 255, 255, 0.8); |
|
|
font-size:2em; |
|
|
color: black; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation"> |
|
|
<div class="container-fluid"> |
|
|
<div class="navbar-header"> |
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> |
|
|
<span class="sr-only">Toggle navigation</span> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
</button> |
|
|
<a class="navbar-brand" href="index.html">Seeker</a> |
|
|
</div> |
|
|
<div class="navbar-collapse collapse navbar-responsive-collapse"> |
|
|
<ul class="nav navbar-nav"> |
|
|
<li class="active"><a href="index.html">Home</a></li> |
|
|
<li><a href="wishlist.html"><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="cart.html"><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-fluid"> |
|
|
<div class="row"> |
|
|
<div class="col-sm-3 col-md-2 sidebar"> |
|
|
|
|
|
<div class="kink" href="#"> |
|
|
<span class="image-wrapper"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/#c9ede2:#a0bdb4" |
|
|
class="img-responsive" alt=""> |
|
|
</span> |
|
|
<span class="headline-wrapper">Minion Corp.</span> |
|
|
</div> |
|
|
<div class="clearfix"></div> |
|
|
|
|
|
<ul class="nav nav-sidebar"> |
|
|
<li class="active"><a href="#">เสื้อผ้า</a></li> |
|
|
<li><a href="#">ของเล่น</a></li> |
|
|
<li><a href="#">เฟอร์นิเจอร์</a></li> |
|
|
<li><a href="#">คอมพิวเตอร์</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main"> |
|
|
<h1 class="page-header"><i class="fa fa-building"></i> ร้านของ Minion Corp.</h1> |
|
|
|
|
|
<div class="row placeholders"> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>LEGO® minifigures</h4> |
|
|
<span class="text-muted">Who doesn't love LEGO®</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row placeholders"> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>LEGO® minifigures</h4> |
|
|
<span class="text-muted">Who doesn't love LEGO®</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/sky" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</div> |
|
|
<div class="col-xs-6 col-sm-3 placeholder"> |
|
|
<a href="product.html"> |
|
|
<img src="../vendor/holderjs/holder.js/200x200/auto/vine" class="img-responsive" alt="200x200"> |
|
|
<h4>Label</h4> |
|
|
<span class="text-muted">Something else</span> |
|
|
</a> |
|
|
</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> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- Bootstrap core JavaScript |
|
|
================================================== --> |
|
|
<!-- Placed at the end of the document so the pages load faster --> |
|
|
<script src="../vendor/holderjs/holder.js"></script> |
|
|
<script src="../vendor/jquery/dist/jquery.min.js"></script> |
|
|
<script src="../vendor/bootstrap/dist/js/bootstrap.min.js"></script> |
|
|
</body> |
|
|
</html>
|
|
|
|
