93 lines
3.5 KiB
PHP
93 lines
3.5 KiB
PHP
@extends('layout.master')
|
|
|
|
@section('body-class', 'page-product')
|
|
|
|
@section('content')
|
|
<div class="container">
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">Library</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<div class="row mb-5">
|
|
<div class="col-12 col-md-6">
|
|
<div class="product-image d-flex">
|
|
<div class="left">
|
|
@for ($i = 0; $i < 5; $i++)
|
|
<div class=""><img src="http://fpoimg.com/100x100?bg_color=f3f3f3" class="img-fluid"></div>
|
|
@endfor
|
|
</div>
|
|
<div class="right"><img src="http://fpoimg.com/560x560?bg_color=f3f3f3" class="img-fluid"></div>
|
|
</div>
|
|
</div>
|
|
<div class="ps-lg-5 col-xl-5 col-lg-6 order-lg-2">
|
|
<div class="peoduct-info">
|
|
<h1>Super Oversized T-Shirt With Raw Sleeves In Brown</h1>
|
|
<div class="rating-wrap d-flex">
|
|
<div class="rating">
|
|
@for ($i = 0; $i < 5; $i++)
|
|
<i class="iconfont"></i>
|
|
@endfor
|
|
</div>
|
|
<span class="text-muted">132 reviews</span>
|
|
</div>
|
|
<div class="price-wrap d-flex align-items-end">
|
|
<div class="new-price">$815.00</div>
|
|
<div class="old-price text-muted text-decoration-line-through">$1015.00</div>
|
|
</div>
|
|
<div class="attribute-wrap">
|
|
<table class="table table-striped table-borderless">
|
|
<tbody>
|
|
<tr>
|
|
<td>型号</td>
|
|
<td>product-222</td>
|
|
</tr>
|
|
<tr>
|
|
<td>型号</td>
|
|
<td>product-222</td>
|
|
</tr>
|
|
<tr>
|
|
<td>型号</td>
|
|
<td>product-222</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="quantity-wrap d-flex">
|
|
<div class="quantity-wrap">
|
|
<input class="form-control quantity-input" type="number" value="1">
|
|
</div>
|
|
<button class="btn btn-outline-secondary ms-3"><i class="bi bi-cart-fill me-1"></i>加入购物车</button>
|
|
<button class="btn btn-dark ms-3"><i class="bi bi-bag-fill me-1"></i>立即购买</button>
|
|
</div>
|
|
<div class="add-wishlist">
|
|
<button class="btn btn-link ps-0"><i class="bi bi-suit-heart-fill me-1"></i>加入收藏夹</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="product-description">
|
|
<div class="nav nav-tabs nav-overflow justify-content-start justify-content-md-center border-bottom">
|
|
<a class="nav-link active" data-bs-toggle="tab" href="#product-description">
|
|
Description
|
|
</a>
|
|
<a class="nav-link" data-bs-toggle="tab" href="#description-1">
|
|
Size & Fit
|
|
</a>
|
|
<a class="nav-link" data-bs-toggle="tab" href="#description-2">
|
|
Shipping & Return
|
|
</a>
|
|
</div>
|
|
<div class="tab-content">
|
|
<div class="tab-pane fade show active" id="product-description" role="tabpanel" aria-labelledby="pills-home-tab">111</div>
|
|
<div class="tab-pane fade" id="description-1" role="tabpanel" aria-labelledby="pills-profile-tab">222</div>
|
|
<div class="tab-pane fade" id="description-2" role="tabpanel" aria-labelledby="pills-contact-tab">333</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|