|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="utf-8"> |
|
|
<title>Product A | 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"> |
|
|
<link rel="stylesheet" href="../css/sb-admin.css"> |
|
|
<!-- 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); |
|
|
} |
|
|
img.thumbnail { |
|
|
float:left; |
|
|
margin-right: 1em; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="navbar navbar-default navbar-fixed-top"> |
|
|
<div class="container-fluid"> |
|
|
<div class="navbar-header"> |
|
|
<a href="index.html" 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="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"> |
|
|
<div class="page-header" id="banner"> |
|
|
<div class="row"> |
|
|
<div class="col-lg-12"> |
|
|
<h1><i class="fa fa-shield fa-rotate-270"></i> Lego</h1> |
|
|
<ul class="list-inline text-right"> |
|
|
<li><a href="wishlist.html"><i class="fa fa-heart"></i> add to wish list</a></li> |
|
|
<li><a href="#"><i class="fa fa-envelope"></i> mail</a></li> |
|
|
<li><a href="#"><i class="fa fa-print"></i> print</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div class="col-lg-5"> |
|
|
<img src="../vendor/holderjs/holder.js/400x400" class="img-responsive" > |
|
|
<ul class="list-inline"> |
|
|
<li><img src="../vendor/holderjs/holder.js/100x100" class="img-responsive" alt="100x100"></li> |
|
|
<li><img src="../vendor/holderjs/holder.js/100x100" class="img-responsive" alt="100x100"></li> |
|
|
<li><img src="../vendor/holderjs/holder.js/100x100" class="img-responsive" alt="100x100"></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="col-lg-7"> |
|
|
<h2>Lego minifigures</h2> |
|
|
<p class="text-info">Maecenas sed diam eget risus varius blandit sit amet non magna.</p> |
|
|
<div class="row"> |
|
|
<div class="col-lg-7"> |
|
|
<h1>$12</h1> |
|
|
<label>Qty: <input class="form-control" type="text" value="1"></label> |
|
|
<br/> |
|
|
<a href="cart.html" class="btn btn-lg btn-success">Add to cart</a> |
|
|
|
|
|
<hr/> |
|
|
<p>Savings Available::</p> |
|
|
<ul class="list-bullet"> |
|
|
<li>Buy with another Lego: 5% off</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="col-lg-5"> |
|
|
<div class="panel panel-info"> |
|
|
<div class="panel-heading"><h3 class="panel-title">Seller</h3></div> |
|
|
<div class="panel-body"> |
|
|
<a href="#">Minion Corp. <i class="fa fa-check-circle text-info"></i></a> |
|
|
<p><span class="label label-success">99.99%</i></span> Positive Feedback</p> |
|
|
<a href="store.html"><i class="fa fa-building-o"></i> Store</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div class="col-lg-8"> |
|
|
<div class="bs-component"> |
|
|
<ul class="nav nav-tabs" style="margin-bottom: 15px;"> |
|
|
<li class="active"><a href="#overview" data-toggle="tab">Overview</a></li> |
|
|
<li><a href="#spec" data-toggle="tab">Specification</a></li> |
|
|
<li><a href="#box" data-toggle="tab">In the Box</a></li> |
|
|
<li><a href="#review" data-toggle="tab">Customer Review</a></li> |
|
|
<li><a href="#accessories" data-toggle="tab">Accessories</a></li> |
|
|
</ul> |
|
|
<div id="myTabContent" class="tab-content"> |
|
|
<div class="tab-pane fade active in" id="overview"> |
|
|
|
|
|
<h3>Product Description</h3> |
|
|
<div class="safetyWarningDiv"><label>Safety Warnings:</label> CHOKING HAZARD - Toy contains a small ball. Not for children under 3 yrs.</div> |
|
|
<br> |
|
|
|
|
|
Prepare for the ultimate battle with evil Lord Business! Join creative forces with Master Builder Emmet to make this massive Mech. Open up the cockpit and place Emmet in the driver's seat. Knock over anything that gets in your way with the swinging wrecking balls. Grab a Skeletron in the Mech's excavator bucket or rotate the roller to iron out the opposition. But hurry before Lord Business glues the whole world together! Includes 3 minifigures with accessories: Emmet and 2 Skeletrons, plus an Anry Kitty figure. |
|
|
|
|
|
|
|
|
</div> |
|
|
<div class="tab-pane fade" id="spec"> |
|
|
<p class="upc"><label>UPC/EAN/ISBN:</label> <span class="value">673419210225</span></p> |
|
|
<p><label>Shipping Weight:</label> 0</p> |
|
|
<p><label>Product Weight:</label>2.4 pounds</p> |
|
|
<p><label>Product Dimensions (in inches):</label>14.7 x 13.8 x 2.6</p> |
|
|
</div> |
|
|
<div class="tab-pane fade" id="box"> |
|
|
<p>one LEGO® minifigure</p> |
|
|
</div> |
|
|
<div class="tab-pane fade" id="review"> |
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/64x64" alt="64x64"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">ของดีจัดๆ</h4> |
|
|
<p> |
|
|
<i class="fa fa-star"></i> <i class="fa fa-star"></i> |
|
|
<i class="fa fa-star"></i> <i class="fa fa-star"></i> |
|
|
<i class="fa fa-star"></i> |
|
|
</p> |
|
|
<p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/64x64" alt="64x64"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">ด้านบนแม่มมั่ว</h4> |
|
|
<p> |
|
|
<i class="fa fa-star"></i> <i class="fa fa-star-o"></i> |
|
|
<i class="fa fa-star-o"></i> <i class="fa fa-star-o"></i> |
|
|
<i class="fa fa-star-o"></i> |
|
|
</p> |
|
|
<p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="tab-pane fade" id="accessories"> |
|
|
<ul> |
|
|
<li>แผนรอง LEGO</li> |
|
|
<li>น้ำยาทำความสะอาด</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="col-lg-4 well"> |
|
|
<h4>Related Products:</h4> |
|
|
|
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/48x48" alt="48x48"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">LEGO A set</h4> |
|
|
<p>$29.99</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/48x48" alt="48x48"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">LEGO B set</h4> |
|
|
<p>$39.99</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/48x48" alt="48x48"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">LEGO C set</h4> |
|
|
<p>$99.99</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="media"> |
|
|
<a class="pull-left" href="#"> |
|
|
<img src="../vendor/holderjs/holder.js/48x48" alt="48x48"> |
|
|
</a> |
|
|
<div class="media-body"> |
|
|
<h4 class="media-heading">LEGO D set</h4> |
|
|
<p>$19.99</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
<hr/> |
|
|
<footer> |
|
|
<div class="row"> |
|
|
<div class="col-lg-12"> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
<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>
|
|
|
|
