1556 lines
64 KiB
HTML
1556 lines
64 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="shortcut icon" href="/images/favicon_audio.png" type="image/x-icon" />
|
|
<title>DEMO AUDIO 3</title>
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"
|
|
rel="stylesheet" />
|
|
|
|
<link rel="stylesheet" href="/css/library.css" />
|
|
<link rel="stylesheet" href="/css/style_mobile.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<!-- HEADER -->
|
|
<header class="global-header mb-2">
|
|
<div class="container">
|
|
<!-- HEADER TOP -->
|
|
<div class="header-top">
|
|
<div class="row align-items-center">
|
|
<div class="col-2">
|
|
<a href="/" class="global-logo">
|
|
<i class="static-icons static-icon-menu-mb"></i>
|
|
</a>
|
|
</div>
|
|
<div class="col-4 offset-2">
|
|
<a href="/" class="global-logo">
|
|
<img src="/images/logo-audio-3.png" alt="logo" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="col-2 offset-2">
|
|
<a href="/cart" class="header-func header-cart">
|
|
<i class="static-icons static-icon-header-cart-mb p-relative">
|
|
<span class="header-cart-amount" id="js-header-cart-amount">1</span>
|
|
</i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- HEADER BOTTOM -->
|
|
<div class="header-bottom mt-1">
|
|
<div class="header-search">
|
|
<div class="search-bar">
|
|
<form method="get" action="/tim" enctype="multipart/form-data" name="searchForm">
|
|
<input type="text" id="js-search-box" name="q" class="search-bar-input" placeholder="Nhập từ khóa cần tìm"
|
|
value="" autocomplete="off" onclick="getSearchValue()" />
|
|
<button type="submit" id="js-search-button" class="search-bar-btn">
|
|
Tìm kiếm
|
|
</button>
|
|
</form>
|
|
|
|
<div class="search-results" style="display: none">
|
|
<div class="search-results-list"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- HOMEPAGE -->
|
|
<div class="homepage d-none">
|
|
<!-- SECTION HERO -->
|
|
<div class="section-hero mb-2">
|
|
<div class="container">
|
|
<div class="swiper swiper-section-hero">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-section-hero-1.png" alt="banner hero" class="d-flex w-100" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-section-hero-1.png" alt="banner hero" class="d-flex w-100" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="section-hero-features list my-2">
|
|
<li class="item">
|
|
<i class="static-icons static-icon-feature-cart"></i>
|
|
Sản phẩm đa dạng, mẫu mã phong phú
|
|
</li>
|
|
<li class="item">
|
|
<i class="static-icons static-icon-feature-money-pig"></i>
|
|
Sản phẩm đa dạng, mẫu mã phong phú
|
|
</li>
|
|
<li class="item">
|
|
<i class="static-icons static-icon-feature-fly-gift"></i>
|
|
Sản phẩm đa dạng, mẫu mã phong phú
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<!-- SECTION DEAL -->
|
|
<div class="section-deal mb-12px">
|
|
<!-- HEADING -->
|
|
<div class="heading pt-3 pb-2">
|
|
<div class="wrapper-heading">
|
|
<h2 class="title text-24 font-weight-600 color-red text-center">
|
|
Ưu đãi mới nhất cho tuần này
|
|
</h2>
|
|
<p class="text-16 font-weight-600 color-secondary text-center mt-2 mb-3">
|
|
Giảm giá lên tới 50%++
|
|
</p>
|
|
|
|
<div class="d-flex align-items-center justify-content-between">
|
|
<p class="global-deal-time-countdown">99 : 99 : 99 : 99</p>
|
|
<a href="" class="font-weight-600 color-secondary hover-primary">Xem tất cả +</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="line-block mb-2"></div>
|
|
|
|
<!-- DEAL LIST -->
|
|
<div class="product-list grid grid--2-cols">
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<div class="p-wrapper-deal p-relative mt-2">
|
|
<div class="deal-line total"></div>
|
|
<div class="deal-line remaining js-line-deal-left" style="width: 80%"></div>
|
|
</div>
|
|
<p class="p-quantity p-quantity-deal my-12px">
|
|
<span>Có sẵn <b class="deal-quantity deal-remaint">30</b></span>
|
|
<span>Đã bán <b class="deal-quantity deal-sold">20</b></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION BANNER -->
|
|
<div class="section-homepage-banner">
|
|
<div class="swiper swiper-section-homepage-banner">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-banner-homepage-1.png" alt="Banner" class="d-flex w-100" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-banner-homepage-2.png" alt="Banner" class="d-flex w-100" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION CATEGORY -->
|
|
<div class="section-category">
|
|
<div class="category-box my-12px">
|
|
<!-- HEADING -->
|
|
<div class="heading mb-12px">
|
|
<div class="d-flex align-items-center justify-content-between">
|
|
<a href="">
|
|
<h2 class="title">Thiết bị Hi-Fi</h2>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CONTENT -->
|
|
<div class="content">
|
|
<div class="product-list grid grid--2-cols">
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy
|
|
text used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<p class="p-quantity my-12px">
|
|
<i class="static-icons static-icon-green-box"></i>
|
|
Còn hàng
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy
|
|
text used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<p class="p-quantity my-12px">
|
|
<i class="static-icons static-icon-green-box"></i>
|
|
Còn hàng
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="view-more py-12px text-center">
|
|
<a href="" class="color-primary font-weight-600">Xem tất cả +</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION CUSTOMER -->
|
|
<div class="section-customer">
|
|
<div class="container">
|
|
<h2 class="heading">KHÁCH HÀNG ĐÃ MUA GẦN ĐÂY</h2>
|
|
<div class="row list pb-4">
|
|
<div class="col-6 item">
|
|
<div class="bg-image">
|
|
<img src="/images/static-image-section-customer-1.png" alt="customer" class="d-flex w-100" />
|
|
</div>
|
|
<div class="content">
|
|
<p class="text-center">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
</p>
|
|
<p class="line-clamp-3 text-13 text-center font-weight-600 mt-1 mb-2">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</p>
|
|
<div class="line-block"></div>
|
|
<div class="user text-12 d-flex align-items-center justify-content-between gap-8 mt-2">
|
|
<i class="static-icons static-icon-customer-avatar"></i>
|
|
<p class="user-info flex-1">
|
|
<b class="line-clamp-1">Nguyễn Thị Hồng Nhung</b>
|
|
0383100 ***
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 item">
|
|
<div class="bg-image">
|
|
<img src="/images/static-image-section-customer-1.png" alt="customer" class="d-flex w-100" />
|
|
</div>
|
|
<div class="content">
|
|
<p class="text-center">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
</p>
|
|
<p class="line-clamp-3 text-13 text-center font-weight-600 mt-1 mb-2">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</p>
|
|
<div class="line-block"></div>
|
|
<div class="user text-12 d-flex align-items-center justify-content-between gap-8 mt-2">
|
|
<i class="static-icons static-icon-customer-avatar"></i>
|
|
<p class="user-info flex-1">
|
|
<b class="line-clamp-1">Nguyễn Thị Hồng Nhung</b>
|
|
0383100 ***
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- BREADCRUMB -->
|
|
<section class="section-breadcrumb routing">
|
|
<div class="global-breadcrumb container">
|
|
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="list">
|
|
<li class="routing-link" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
|
|
<a href="/" itemprop="item" class="nopad-l">
|
|
<span itemprop="name">Trang chủ</span>
|
|
</a>
|
|
<meta itemprop="position" content="1" />
|
|
</li>
|
|
<li class="routing-link" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
|
|
<a href="/linh-kien-may-tinh" itemprop="item" class="nopad-l">
|
|
<span itemprop="name"> Linh kiện máy tính </span>
|
|
</a>
|
|
<meta itemprop="position" content="2" />
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CATEGORY PAGE -->
|
|
<div class="product-page d-none">
|
|
<div class="container">
|
|
<h1 class="text-20 font-weight-700 text-uppercase mb-12px">
|
|
THIẾT BỊ HI-FI
|
|
</h1>
|
|
|
|
<!-- CATEGORY CHILD -->
|
|
<div class="category-child mb-12px">
|
|
<ul class="list">
|
|
<li class="list-item">
|
|
<a href="" class="item">
|
|
<div class="image">
|
|
<img src="/images/static-image-cateogry-child-1.png" alt="Category" class="picture d-flex w-100" />
|
|
</div>
|
|
<p class="title text-16 font-weight-600 text-center mt-2">
|
|
Ampli tích hợp
|
|
</p>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- MAIN CONTENT -->
|
|
<div class="main-content pt-3">
|
|
<!-- SORT -->
|
|
<div class="sort d-flex align-items-center justify-content-between pt-2">
|
|
<!-- FILTER -->
|
|
<div class="wrapper-filter d-flex gap-8">
|
|
<div class="filter-popup">
|
|
<div class="filter-popup-btn" onclick="_openFilter();">
|
|
<i class="static-icons static-icon-filter-mb"></i>
|
|
Lọc
|
|
</div>
|
|
|
|
<!-- popup filter -->
|
|
<div class="popup-filter-group" style="display: none">
|
|
<div class="main-content">
|
|
<div class="popup-body">
|
|
<div class="js-filter-item brand-item">
|
|
<p class="title">Thương hiệu</p>
|
|
|
|
<div class="list-holder js-brand-list">
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-brand="6">
|
|
<span class="text-center">DaVinci</span>
|
|
</a>
|
|
</div>
|
|
|
|
<button class="btn btn-view-more-popup" onclick="showFilterMoreBtn(this)" style="display: none">
|
|
<p>
|
|
<span class="js-view-more-popup">Xem thêm</span>
|
|
<i class="fa fa-angle-double-down" aria-hidden="true"></i>
|
|
</p>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="js-filter-item brand-item">
|
|
<p class="title">Giá bán</p>
|
|
|
|
<div class="list-holder js-price-list">
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="50000000" data-min="0">
|
|
<span class="text-center">Dưới 50 triệu</span>
|
|
</a>
|
|
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="100000000"
|
|
data-min="50000000">
|
|
<span class="text-center">50 triệu - 100 triệu</span>
|
|
</a>
|
|
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="150000000"
|
|
data-min="100000000">
|
|
<span class="text-center">100 triệu - 150 triệu</span>
|
|
</a>
|
|
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="200000000"
|
|
data-min="150000000">
|
|
<span class="text-center">150 triệu - 200 triệu</span>
|
|
</a>
|
|
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="500000000"
|
|
data-min="200000000">
|
|
<span class="text-center">200 triệu - 500 triệu</span>
|
|
</a>
|
|
|
|
<a href="javascript:void(0)" class="js-filter-selected" data-max="0" data-min="500000000">
|
|
<span class="text-center">Trên 500 triệu</span>
|
|
</a>
|
|
</div>
|
|
<button class="btn btn-view-more-popup" onclick="showFilterMoreBtn(this)" style="display: none">
|
|
<p>
|
|
<span class="js-view-more-popup">Xem thêm</span>
|
|
<i class="fa fa-angle-double-down" aria-hidden="true"></i>
|
|
</p>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="popup-footer d-flex">
|
|
<a href="javascript:void(0)" onclick="_closeFilter()" class="btn-close-menu"><i
|
|
class="fa fa-times"></i> Đóng</a>
|
|
|
|
<a href="/am-thanh-hi-end" class="js-partName">Xóa bộ lọc</a>
|
|
|
|
<a href="javascript:void(0)" onclick="_getLink('/am-thanh-hi-end?')">Áp dụng</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="js-filter-block" style="display: none; height: 50px"></div>
|
|
<!-- end popup filter -->
|
|
</div>
|
|
|
|
<div class="sort-by-collection">
|
|
<select name="" id="">
|
|
<option value="">Sắp xếp theo</option>
|
|
<option value="">Giá giảm dần</option>
|
|
<option value="">Giá tăng dần</option>
|
|
<option value="">Mới nhất</option>
|
|
<option value="">Lượt xem</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="sort-by-display d-flex gap-8">
|
|
<a href="" class="d-flex"><i class="static-icons static-icon-list-style"></i></a>
|
|
<a href="" class="d-flex"><i class="static-icons static-icon-grid-style active"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PRODUCT LIST -->
|
|
<div class="product-list mt-12px grid grid--2-cols">
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<p class="p-quantity my-12px">
|
|
<i class="static-icons static-icon-green-box"></i>
|
|
Còn hàng
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PAGING -->
|
|
<div class="paging paging-category">
|
|
<a href="javascript:;" class="paging-link active">1</a>
|
|
<a href="javascript:;" class="paging-link">2</a>
|
|
<a href="javascript:;" class="paging-link">3</a>
|
|
<a href="javascript:;" class="paging-link">4</a>
|
|
<a href="javascript:;" class="paging-link">5</a>
|
|
</div>
|
|
|
|
<!-- CONTENT -->
|
|
<div class="description">
|
|
<div class="content static-html blur">
|
|
<h2>Hệ thống âm thanh Hi-Fi là gì?</h2>
|
|
<p>
|
|
Hi-Fi (viết tắt của Hi-Fidelity) có nghĩa là âm thanh có độ
|
|
trung thực cao, chuẩn gốc, không bị pha trộn tạp âm hay bị chỉnh
|
|
sửa. Thông thường, Hi-Fi thể hiện âm thanh có độ nhiễu (noise),
|
|
méo (distortion) được giảm thiểu và đáp tần chính xác. Chỉ số
|
|
Hi-Fi càng cao thì chất âm sẽ càng hay và càng tinh tế, sáng
|
|
tạo, độ méo âm thanh càng ít, thu hút được sự chú ý của người
|
|
nghe.
|
|
</p>
|
|
<img src="/images/static-image-category-description.png" alt="Category description" />
|
|
<h2>Hệ thống âm thanh Hi-Fi là gì?</h2>
|
|
<p>
|
|
Hi-Fi (viết tắt của Hi-Fidelity) có nghĩa là âm thanh có độ
|
|
trung thực cao, chuẩn gốc, không bị pha trộn tạp âm hay bị chỉnh
|
|
sửa. Thông thường, Hi-Fi thể hiện âm thanh có độ nhiễu (noise),
|
|
méo (distortion) được giảm thiểu và đáp tần chính xác. Chỉ số
|
|
Hi-Fi càng cao thì chất âm sẽ càng hay và càng tinh tế, sáng
|
|
tạo, độ méo âm thanh càng ít, thu hút được sự chú ý của người
|
|
nghe.
|
|
</p>
|
|
<h2>Hệ thống âm thanh Hi-Fi là gì?</h2>
|
|
<p>
|
|
Hi-Fi (viết tắt của Hi-Fidelity) có nghĩa là âm thanh có độ
|
|
trung thực cao, chuẩn gốc, không bị pha trộn tạp âm hay bị chỉnh
|
|
sửa. Thông thường, Hi-Fi thể hiện âm thanh có độ nhiễu (noise),
|
|
méo (distortion) được giảm thiểu và đáp tần chính xác. Chỉ số
|
|
Hi-Fi càng cao thì chất âm sẽ càng hay và càng tinh tế, sáng
|
|
tạo, độ méo âm thanh càng ít, thu hút được sự chú ý của người
|
|
nghe.
|
|
</p>
|
|
</div>
|
|
<a href="javascript:void(0)" onclick="viewMoreContent('.description')"
|
|
class="view-more-content-btn js-view-more-content">
|
|
Xem thêm +
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- DETAIL PAGE -->
|
|
<div class="product-detail-page d-none">
|
|
<div class="container">
|
|
<!-- SECTION PRODUCT -->
|
|
<div class="section-product mb-32px">
|
|
<div class="">
|
|
<!-- CENTER -->
|
|
<div class="product-thumbs">
|
|
<div class="swiper gallery-top mb-3">
|
|
<div class="swiper-wrapper">
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<a data-fancybox="gallery" title="Click để phóng to" href="/images/static-image-product-1.png">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<a data-fancybox="gallery" title="Click để phóng to" href="/images/static-image-product-1.png">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<a data-fancybox="gallery" title="Click để phóng to" href="/images/static-image-product-1.png">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<a data-fancybox="gallery" title="Click để phóng to" href="/images/static-image-product-1.png">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper gallery-thumbs" thumbsSlider="">
|
|
<div class="swiper-wrapper">
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</div>
|
|
<!-- SLIDE -->
|
|
<div class="swiper-slide">
|
|
<img src="/images/static-image-product-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- RIGHT -->
|
|
<div class="product-info mt-3">
|
|
<!-- -->
|
|
<h1 class="pro-name">
|
|
Dàn Mini Hifi Yamaha MCR - B370 (Ampli MCR-B370 + Loa NS-BP102)
|
|
</h1>
|
|
<!-- -->
|
|
<div class="pro-sub-info text-12 mt-2">
|
|
<div class="wrapper-sub-info d-flex flex-wrap align-items-center gap-24 mb-2">
|
|
<p>
|
|
Thương hiệu:
|
|
<span class="color-primary font-weight-500">Yamaha</span>
|
|
</p>
|
|
<p>
|
|
SKU:
|
|
<span class="color-primary font-weight-500">STAGEPAS 1K</span>
|
|
</p>
|
|
</div>
|
|
<p>
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span>1 bình luận</span>
|
|
</p>
|
|
</div>
|
|
<div class="line-gray-block my-12px"></div>
|
|
|
|
<!-- -->
|
|
<div class="pro-deal">
|
|
<div class="section-deal">
|
|
<div class="pro-deal-time-left d-flex align-items-center gap-8">
|
|
<p class="title text-13 color-white">Thời gian còn lại</p>
|
|
<div class="global-deal-time-countdown">
|
|
99 : 99 : 99 : 99
|
|
</div>
|
|
</div>
|
|
<div class="pro-deal-quantity p-item w-100 mt-12px">
|
|
<div class="p-wrapper-deal p-relative mt-2">
|
|
<div class="deal-line total"></div>
|
|
<div class="deal-line remaining js-line-deal-left" style="width: 80%"></div>
|
|
</div>
|
|
<p class="p-quantity p-quantity-deal my-2">
|
|
<span>Có sẵn
|
|
<b class="deal-quantity deal-remaint">30</b></span>
|
|
<span>Đã bán <b class="deal-quantity deal-sold">20</b></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="pro-price my-3">
|
|
<p class="pro-price-sale">72.880.000₫</p>
|
|
<div class="pro-price-wrapper d-flex align-items-center gap-16 my-2">
|
|
<p class="pro-price-stock">
|
|
Giá niêm yết:
|
|
<del class="color-gray font-weight-500">82.880.000₫</del>
|
|
</p>
|
|
<p class="pro-price-sale-off">-20%</p>
|
|
</div>
|
|
|
|
<p class="mt-2">
|
|
Tiết kiệm
|
|
<span class="color-red font-weight-600">1.000.000₫</span> so
|
|
với thị trường
|
|
</p>
|
|
</div>
|
|
<!-- -->
|
|
<div class="pro-status d-flex align-items-center gap-8">
|
|
<i class="static-icons static-icon-green-box"></i>
|
|
Còn hàng
|
|
</div>
|
|
<!-- -->
|
|
<div class="pro-special-offer">
|
|
<p class="title">
|
|
<i class="static-icons static-icon-gift"></i> Khuyến mãi đặc
|
|
biệt
|
|
</p>
|
|
<ul class="list-w">
|
|
<li>
|
|
Giao hàng nhanh nhất, miễn phí giao hàng trong nội thành
|
|
</li>
|
|
<li>Bảo hành chính hãng từ nhà cung cấp</li>
|
|
<li>Đổi mới trong 1 tháng khi lỗi kỹ thuật</li>
|
|
<li>Miễn phí công lắp đặt trị giá 500.000đ</li>
|
|
</ul>
|
|
</div>
|
|
<!-- -->
|
|
<div class="pro-cart my-12px">
|
|
<p class="">
|
|
Số lượng:
|
|
<input type="number" name="product quantity" class="pro-cart-quantity ml-2 text-center" value="1"
|
|
min="1" />
|
|
</p>
|
|
<a href="javascript:;" class="pro-cart-btn buy-now my-2">
|
|
<b class="text text-18 text-uppercase">Mua ngay</b>
|
|
<span class="des text-12">Thanh toán online hoặc ship COD</span>
|
|
</a>
|
|
<a href="javascript:;" class="pro-cart-btn installment">
|
|
<b class="text text-18 text-uppercase">Mua trả góp</b>
|
|
<span class="des text-12">Visa, Mastercard, JCB, Amex</span>
|
|
</a>
|
|
</div>
|
|
<!-- -->
|
|
<div class="pro-social-share d-flex align-items-center gap-16 mb-2">
|
|
Chia sẻ ngay:
|
|
<img src="/images/static-image-social-share.png" alt="Social share" class="d-flex w-100"
|
|
style="max-width: 220px" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- LEFT -->
|
|
<div class="product-features">
|
|
<!-- -->
|
|
<div class="product-policy box mb-3 pb-1">
|
|
<h2 class="title text-20 font-weight-700 text-uppercase">
|
|
CHÍNH SÁCH
|
|
</h2>
|
|
<ul class="list">
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-delivery"></i>
|
|
<p class="">
|
|
<b class="d-block">Miễn phí</b>
|
|
<span>Giao hàng toàn quốc</span>
|
|
</p>
|
|
</li>
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-reward"></i>
|
|
<p class="">
|
|
<b class="d-block">Đảm bảo</b>
|
|
<span>Chất lượng đã kiểm định</span>
|
|
</p>
|
|
</li>
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-support"></i>
|
|
<p class="">
|
|
<b class="d-block">Hỗ trợ 24/7</b>
|
|
<span>Chăm sóc khách hàng uy tín</span>
|
|
</p>
|
|
</li>
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-support-2"></i>
|
|
<p class="">
|
|
<b class="d-block">Tư vấn bán hàng</b>
|
|
<span>19006755</span>
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="product-support box">
|
|
<h2 class="title bg-secondary color-white text-20 font-weight-700 text-uppercase">
|
|
HỖ TRỢ MUA HÀNG
|
|
</h2>
|
|
|
|
<ul class="list">
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-phone"></i>
|
|
<a href="tel:19006755" class="d-block">
|
|
<b class="d-block text-20 color-primary">1900 6755</b>
|
|
<span>Tư vấn viên: Mr. Tuấn</span>
|
|
</a>
|
|
</li>
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-phone"></i>
|
|
<a href="tel:19006755" class="d-block">
|
|
<b class="d-block text-20 color-primary">1900 6755</b>
|
|
<span>Tư vấn viên: Ms. Nhung</span>
|
|
</a>
|
|
</li>
|
|
<li class="item d-flex gap-12">
|
|
<i class="static-icons static-icon-feature-mail"></i>
|
|
<a href="mailto:Support@Hurasoft.vn" class="d-block">
|
|
<span>Support@Hurasoft.vn</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION PRODUCT RELATIVE -->
|
|
<div class="section-product-relative mb-32px">
|
|
<h2 class="heading text-20 font-weight-700 text-uppercase">
|
|
Sản phẩm liên quan
|
|
</h2>
|
|
<div class="line-gray-block mt-2 mb-3"></div>
|
|
|
|
<div class="product-list grid grid--2-cols">
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<p class="p-quantity my-12px">
|
|
<i class="static-icons static-icon-green-box"></i>
|
|
Còn hàng
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION PRODUCT ATTR -->
|
|
<div class="section-product-attr">
|
|
<!-- NAME -->
|
|
<div class="attr-list-name">
|
|
<ul class="list d-flex align-items-center gap-24">
|
|
<li class="item">
|
|
<h2 class="title active" onclick="toggleAttr('.pro-des', this)">
|
|
Mô tả
|
|
</h2>
|
|
</li>
|
|
<li class="item">
|
|
<h2 class="title" onclick="toggleAttr('.pro-spec', this)">
|
|
Thông số kỹ thuật
|
|
</h2>
|
|
</li>
|
|
<li class="item">
|
|
<h2 class="title" onclick="toggleAttr('.pro-video', this)">
|
|
Video
|
|
</h2>
|
|
</li>
|
|
<li class="item">
|
|
<h2 class="title" onclick="toggleAttr('.pro-review', this)">
|
|
Đánh giá
|
|
</h2>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="line-gray-block mt-2 mb-3"></div>
|
|
|
|
<!-- CONTENT -->
|
|
<div class="attr-list-content">
|
|
<!-- DES -->
|
|
<div class="pro-des" data-type="attr-item-content">
|
|
<div class="content-des static-html max-height-none">
|
|
<h2>Bộ Dàn Mini Hifi Yamaha MCR - B370</h2>
|
|
<p>
|
|
Dàn Mini Hifi Yamaha MCR - B370 sở hữu bề ngoài sang trọng,
|
|
thanh lịch, cuốn hút phù hợp với mọi không gian. Bên cạnh đó
|
|
với chất lượng âm thanh đỉnh cao đến từ thương hiệu Yamaha bộ
|
|
dàn này sẽ giúp bạn trải nghiệm những giây phút giải trí tại
|
|
gia tuyệt vời nhất. Cấu hình của bộ dàn bao gồm: - Amply
|
|
Yamaha CRX - B370 (Bạc/Black) - Loa Yamaha NS - BP102 Black Về
|
|
thiết kế, Amply Yamaha CRX - B370 duy trì hình ảnh thiết kế
|
|
của các thành phần Hi-Fi của Yamaha - thể hiện hình dáng cực
|
|
kỳ cao cấp và tinh xảo.
|
|
</p>
|
|
<img src="/images/static-image-detail-des-1.png" alt="Mô tả" />
|
|
<h2>Bộ Dàn Mini Hifi Yamaha MCR - B370</h2>
|
|
<p>
|
|
Dàn Mini Hifi Yamaha MCR - B370 sở hữu bề ngoài sang trọng,
|
|
thanh lịch, cuốn hút phù hợp với mọi không gian. Bên cạnh đó
|
|
với chất lượng âm thanh đỉnh cao đến từ thương hiệu Yamaha bộ
|
|
dàn này sẽ giúp bạn trải nghiệm những giây phút giải trí tại
|
|
gia tuyệt vời nhất. Cấu hình của bộ dàn bao gồm: - Amply
|
|
Yamaha CRX - B370 (Bạc/Black) - Loa Yamaha NS - BP102 Black Về
|
|
thiết kế, Amply Yamaha CRX - B370 duy trì hình ảnh thiết kế
|
|
của các thành phần Hi-Fi của Yamaha - thể hiện hình dáng cực
|
|
kỳ cao cấp và tinh xảo.
|
|
</p>
|
|
<h2>Bộ Dàn Mini Hifi Yamaha MCR - B370</h2>
|
|
<p>
|
|
Dàn Mini Hifi Yamaha MCR - B370 sở hữu bề ngoài sang trọng,
|
|
thanh lịch, cuốn hút phù hợp với mọi không gian. Bên cạnh đó
|
|
với chất lượng âm thanh đỉnh cao đến từ thương hiệu Yamaha bộ
|
|
dàn này sẽ giúp bạn trải nghiệm những giây phút giải trí tại
|
|
gia tuyệt vời nhất. Cấu hình của bộ dàn bao gồm: - Amply
|
|
Yamaha CRX - B370 (Bạc/Black) - Loa Yamaha NS - BP102 Black Về
|
|
thiết kế, Amply Yamaha CRX - B370 duy trì hình ảnh thiết kế
|
|
của các thành phần Hi-Fi của Yamaha - thể hiện hình dáng cực
|
|
kỳ cao cấp và tinh xảo.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- TECH -->
|
|
<div class="pro-spec d-none" data-type="attr-item-content">
|
|
<div class="content-spec">
|
|
<table class="attributes">
|
|
<tbody>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>CPU</strong></td>
|
|
<td>
|
|
<div class="wordWrap">Intel Core i7 12700H</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>RAM</strong></td>
|
|
<td>
|
|
<div class="wordWrap">16GB DDR5</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>Ổ cứng</strong></td>
|
|
<td>
|
|
<div class="wordWrap">1TB SSD </div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>Màn hình</strong></td>
|
|
<td>
|
|
<div class="wordWrap">16 Inch QHD+</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>Card đồ họa</strong></td>
|
|
<td>
|
|
<div class="wordWrap">Nvidia RTX3060</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>Hệ điều hành</strong></td>
|
|
<td>
|
|
<div class="wordWrap">Win 11</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="option-item">
|
|
<td class="op_name"><strong>Màu sắc</strong></td>
|
|
<td>
|
|
<div class="wordWrap">Đen</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- VIDEO -->
|
|
<div class="pro-video d-none" data-type="attr-item-content">
|
|
<div class="content-video"></div>
|
|
</div>
|
|
|
|
<!-- REVIEW -->
|
|
<div class="pro-review d-none" data-type="attr-item-content"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- DEAL PAGE -->
|
|
<div class="deal-page d-none">
|
|
<div class="container">
|
|
<!-- SECTION DEAL -->
|
|
<div class="section-deal">
|
|
<!-- HEADING -->
|
|
<div class="heading pt-3 pb-12px">
|
|
<div class="wrapper-heading text-center">
|
|
<h2 class="title text-24 font-weight-600 color-red">
|
|
Ưu đãi mới nhất cho tuần này
|
|
</h2>
|
|
<p class="text-16 font-weight-600 color-secondary mt-2 mb-12px">
|
|
Giảm giá lên tới 50%++
|
|
</p>
|
|
<p class="global-deal-time-countdown">99 : 99 : 99 : 99</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="line-block mb-12px"></div>
|
|
|
|
<!-- DEAL LIST -->
|
|
<div class="product-list grid grid--2-cols">
|
|
<div class="p-item">
|
|
<div class="p-thumbs">
|
|
<div class="swiper swiper-product-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<a href="" class="p-image">
|
|
<img src="/images/static-image-product-1.png" alt="Product image" class="d-flex w-100" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
<span class="p-price-sale-off">-20%</span>
|
|
</div>
|
|
|
|
<div class="p-info">
|
|
<h3 class="p-name line-clamp-2 mt-12px">
|
|
Lorem ipsum, or lipsum as it is sometimes known, is dummy text
|
|
used in laying out print
|
|
</h3>
|
|
<p class="p-rating d-flex align-items-center gap-8 my-12px">
|
|
<i class="static-icons static-icon-5-stars"></i>
|
|
<span class="text-13 font-weight-500 mt-1">1 bình luận</span>
|
|
</p>
|
|
<p class="p-price">
|
|
<span class="p-price-sale">72.880.000₫</span>
|
|
<del class="p-price-stock">82.880.000₫</del>
|
|
</p>
|
|
<div class="p-wrapper-deal p-relative mt-2">
|
|
<div class="deal-line total"></div>
|
|
<div class="deal-line remaining js-line-deal-left" style="width: 80%"></div>
|
|
</div>
|
|
<p class="p-quantity p-quantity-deal my-12px">
|
|
<span>Có sẵn <b class="deal-quantity deal-remaint">30</b></span>
|
|
<span>Đã bán <b class="deal-quantity deal-sold">20</b></span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PAGING -->
|
|
<div class="paging paging-category">
|
|
<a href="javascript:;" class="paging-link active">1</a>
|
|
<a href="javascript:;" class="paging-link">2</a>
|
|
<a href="javascript:;" class="paging-link">3</a>
|
|
<a href="javascript:;" class="paging-link">4</a>
|
|
<a href="javascript:;" class="paging-link">5</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CART PAGE -->
|
|
<div class="cart-page mb-4">
|
|
<div class="container">
|
|
<form method="post" enctype="multipart/form-data" action="/send-cart" onsubmit="return check_field();">
|
|
<!-- SECTION PRODUCT -->
|
|
<div class="section-product">
|
|
<!-- CART LIST -->
|
|
<div class="cart-list">
|
|
<div class="c-item">
|
|
<div class="row align-items-center">
|
|
<div class="c-image col-4">
|
|
<a href="" class="c-img">
|
|
<img src="/images/static-image-product-1.png" alt="Product" class="d-flex w-100" />
|
|
</a>
|
|
<p class="text-center mt-12px">
|
|
<i class="static-icons static-icon-gray-close-mb c-delete"></i>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="col-8 c-info">
|
|
<a href="">
|
|
<h3 class="c-name text-13 font-weight-500">
|
|
Dàn Mini Hifi Yamaha MCR - B370 (Ampli MCR-B370 + Loa
|
|
NS-BP102)
|
|
</h3>
|
|
</a>
|
|
<p class="c-price my-2">72.880.000₫</p>
|
|
<p class="">
|
|
Số lượng
|
|
<input type="number" class="c-quantity" value="1" min="1" />
|
|
</p>
|
|
<!-- <p class="c-total-price font-weight-700">72.880.000₫</p> -->
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- VOUCHER -->
|
|
<div class="voucher px-12px">
|
|
<input type="text" class="form-input voucher-input" placeholder="Mã giảm giá" />
|
|
<button class="form-btn voucher-btn bg-secondary">Áp dụng</button>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<p class="cart-total-price-note text-13 text-right mt-3 mx-12px">
|
|
Tạm tính: <b>72.880.000₫</b>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="line-blue-block my-3"></div>
|
|
|
|
<!-- SECTION LOGIN -->
|
|
<div class="section-login">
|
|
<p class="title text-13 text-uppercase">
|
|
Để tiếp tục đặt hàng, quý khách xin vui lòng
|
|
<a href="javascript:;" class="font-weight-700 color-primary hover-secondary"
|
|
onclick="toggleDisplay('.login-form')">
|
|
Đăng nhập
|
|
</a>
|
|
hoặc nhập thông tin bên dưới
|
|
</p>
|
|
|
|
<div class="login-form mb-4 d-none">
|
|
<input type="text" name="info[email]" id="login-email" class="form-input my-3" placeholder="Họ và tên" />
|
|
<input type="password" name="info[password]" id="login-password" class="form-input mb-3"
|
|
placeholder="Mật khẩu" />
|
|
<button class="form-btn login-btn bg-primary">
|
|
Đăng nhập
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SECTION CART SEND -->
|
|
<div class="mt-4">
|
|
<!-- CUSTOMER -->
|
|
<div class="col-left customer">
|
|
<h2 class="text-20 mb-3">Thông tin giao hàng</h2>
|
|
|
|
<div class="customer-form">
|
|
<input type="text" name="user_info[name]" id="buyer_name" class="form-input" placeholder="Họ và tên"
|
|
value="" />
|
|
|
|
<input type="email" name="user_info[email]" id="buyer_email" class="form-input" placeholder="Email"
|
|
value="" />
|
|
|
|
<input type="text" name="user_info[tel]" id="buyer_tel" class="form-input" placeholder="Số điện thoại"
|
|
value="" />
|
|
|
|
<input type="text" name="user_info[address]" id="buyer_address" class="form-input" placeholder="Địa chỉ"
|
|
value="" />
|
|
|
|
<select name="user_info[province]" id="buyer_province" class="form-input"
|
|
onchange="getProvince(this.value);">
|
|
<option value="">Chọn Tỉnh thành</option>
|
|
<option value="1" data-name="Hà Nội">Hà Nội</option>
|
|
</select>
|
|
|
|
<select name="user_info[district]" id="buyer_district" class="form-input">
|
|
<option value="">Chọn Quận/ Huyện</option>
|
|
<option value="">Chưa chọn Tỉnh thành</option>
|
|
</select>
|
|
|
|
<select name="user_info[ward]" id="buyer_ward" class="form-input">
|
|
<option value="">Chọn Phương/ Xã</option>
|
|
<option value="">Chưa chọn Quận/ Huyện</option>
|
|
</select>
|
|
|
|
<textarea name="user_info[note]" id="buyer_note" cols="30" rows="10" class="form-input"
|
|
placeholder="Ghi chú"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- METHOD -->
|
|
<div class="col-right mt-2">
|
|
<!-- -->
|
|
<div class="payment mb-4">
|
|
<h2 class="text-20 mb-3">Phương thức thanh toán</h2>
|
|
|
|
<ul class="list list-radio">
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="pay_method_1" name="pay_method" value="1" checked="" />
|
|
<label for="pay_method_1"
|
|
title="Thanh toán tiền mặt khi nhận hàng (tiền mặt/quẹt thẻ ATM, Visa, Master)">
|
|
Thanh toán tiền mặt khi nhận hàng
|
|
</label>
|
|
</li>
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="pay_method_2" name="pay_method" value="2" />
|
|
<label for="pay_method_2" title="Thanh toán qua chuyển khoản qua tài khoản ngân hàng(khuyên dùng)">
|
|
Thanh toán qua chuyển khoản ngân hàng
|
|
</label>
|
|
</li>
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="pay_method_3" name="pay_method" value="3" />
|
|
<label for="pay_method_3" title="Thanh toán qua Ngân Lượng (ATM nội địa, Visa, Master)">
|
|
Thanh toán qua Ngân Lượng
|
|
</label>
|
|
</li>
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="pay_method_4" name="pay_method" value="4" />
|
|
<label for="pay_method_4" title="Trả góp Alepay (Ngân Lượng)">
|
|
Trả góp Alepay
|
|
</label>
|
|
</li>
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="pay_method_5" name="pay_method" value="5" />
|
|
<label for="pay_method_5" title="Thanh toán trực tuyến (Bằng thẻ ATM/Visa/Master qua cổng VnPay)">
|
|
Thanh toán trực tuyến
|
|
</label>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="shipping mb-4">
|
|
<h2 class="text-20 mb-3">Phương thức vận chuyển</h2>
|
|
|
|
<ul class="list list-radio">
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="shipping_method_1" name="ship_method" value="1" checked="" />
|
|
<label for="shipping_method_1" title="">Giao hàng nhanh trong 2 giờ (Nội thành Hà Nội
|
|
+HCM)</label>
|
|
</li>
|
|
<li class="item">
|
|
<input class="d-none" type="radio" id="shipping_method_2" name="ship_method" value="2" />
|
|
<label for="shipping_method_2" title="">Giao hàng tiêu chuẩn</label>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- CART SEND -->
|
|
<div class="cart-send mb-3">
|
|
<p class="cart-send-item discount-price">
|
|
Giảm giá:
|
|
<span>1.000.000₫</span>
|
|
</p>
|
|
|
|
<p class="cart-send-item shipping-price">
|
|
Phí vận chuyển:
|
|
<span>Miễn phí</span>
|
|
</p>
|
|
|
|
<p class="cart-send-item total-price font-weight-700">
|
|
Tổng tiền:
|
|
<span>72.880.000₫</span>
|
|
</p>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="card-send-btn text-center">
|
|
<button class="form-btn cart-send-submit-btn bg-primary">
|
|
Hoàn tất đơn hàng
|
|
</button>
|
|
<a href="/" class="d-block text-16 font-weight-500 color-primary my-3">Tiếp tục mua sắm</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- FOOTER -->
|
|
<footer class="global-footer mt-4">
|
|
<!-- FOOTER TOP -->
|
|
<div class="footer-top">
|
|
<div class="container">
|
|
<div class="">
|
|
<div class="global-socials">
|
|
<ul class="list">
|
|
<li class="item">
|
|
<a href="" class="link">
|
|
<i class="static-icons static-icon-social-fb"></i>
|
|
</a>
|
|
</li>
|
|
<li class="item">
|
|
<a href="" class="link">
|
|
<i class="static-icons static-icon-social-twitter"></i>
|
|
</a>
|
|
</li>
|
|
<li class="item">
|
|
<a href="" class="link">
|
|
<i class="static-icons static-icon-social-gg-news"></i>
|
|
</a>
|
|
</li>
|
|
<li class="item">
|
|
<a href="" class="link">
|
|
<i class="static-icons static-icon-social-instagram"></i>
|
|
</a>
|
|
</li>
|
|
<li class="item">
|
|
<a href="" class="link">
|
|
<i class="static-icons static-icon-social-youtube"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div class="line-white-block"></div>
|
|
</div>
|
|
|
|
<h4 class="text-15 color-white text-center my-12px">
|
|
NHẬN THÔNG TIN KHUYẾN MÃI TỪ CHÚNG TÔI
|
|
</h4>
|
|
|
|
<div class="newsletter p-relative pb-12px">
|
|
<input type="email" id="js-newsletter" name="newsletter" class="newsletter-input"
|
|
placeholder="Nhập email của bạn" value="" autocomplete="off" onclick="" />
|
|
<button type="submit" id="js-search-button" class="newsletter-btn">
|
|
Gửi
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- FOOTER BOTTOM -->
|
|
<div class="footer-bottom my-4">
|
|
<div class="container">
|
|
<div class="col-info mb-12px">
|
|
<a href="/" class="global-logo">
|
|
<img src="/images/logo-audio-3.png" alt="logo" class="d-flex w-100" />
|
|
</a>
|
|
<p class="my-3">
|
|
Condimentum adipiscing vel neque dis nam parturient orci at
|
|
scelerisque neque dis nam parturient.
|
|
</p>
|
|
<ul class="list col-list">
|
|
<li>
|
|
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
|
<i class="static-icons static-icon-location"></i>
|
|
<span>XX Tràng Thi - Hoàn Kiếm - Hà Nội</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="tel:02438524524" class="d-flex align-items-center gap-12">
|
|
<i class="static-icons static-icon-phone-shake"></i>
|
|
<span>Hotline: 0243.8.524.524</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="tel:0988034960" class="d-flex align-items-center gap-12">
|
|
<i class="static-icons static-icon-phone-shake"></i>
|
|
<span>Điện thoại: 0988.034.960</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div class="sosical mt-3">
|
|
<i class="static-icons static-icon-social-fb-logo"></i>
|
|
<i class="static-icons static-icon-social-youtube-logo"></i>
|
|
<i class="static-icons static-icon-social-instagram-logo"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col-company">
|
|
<h3 class="col-title accordion">THÔNG TIN HỮU ÍCH</h3>
|
|
<ul class="list col-list accordion-content">
|
|
<li>
|
|
<a href="/gioi-thieu" class="d-flex align-items-center gap-12">
|
|
<span>Giới thiệu</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/tuyen-dung" class="d-flex align-items-center gap-12">
|
|
<span>Tuyển dụng</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/tin-tuc" class="d-flex align-items-center gap-12">
|
|
<span>Tin tức</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/y-kien-khach-hang" class="d-flex align-items-center gap-12">
|
|
<span>Ý kiến khách hàng</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/chinh-sach-bao-mat-thong-tin" class="d-flex align-items-center gap-12">
|
|
<span>Chính sách bảo mật thông tin</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/lien-he" class="d-flex align-items-center gap-12">
|
|
<span>Liên hệ</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-support">
|
|
<h3 class="col-title accordion">HỖ TRỢ MUA HÀNG</h3>
|
|
<ul class="list col-list accordion-content">
|
|
<li>
|
|
<a href="/huong-dan-mua-hang-truc-tuyen" class="d-flex align-items-center gap-12">
|
|
<span>Hướng dẫn mua hàng trực tuyến</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/hinh-thuc-thanh-toan" class="d-flex align-items-center gap-12">
|
|
<span>Các hình thức thanh toán</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/mua-hang-online" class="d-flex align-items-center gap-12">
|
|
<span>Tại sao chọn mua hàng online</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/hinh-thuc-mua-hang" class="d-flex align-items-center gap-12">
|
|
<span>Các hình thức mua hàng</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/chinh-sach-van-chuyen" class="d-flex align-items-center gap-12">
|
|
<span>Chính sách vận chuyển</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/chinh-sach-bao-hanh" class="d-flex align-items-center gap-12">
|
|
<span>Chính sách bảo trì, bảo hành</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/chinh-sach-doi-tra" class="d-flex align-items-center gap-12">
|
|
<span>Chính sách đổi trả hàng</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-sale">
|
|
<h3 class="col-title accordion">THÔNG TIN KHUYẾN MẠI</h3>
|
|
<ul class="list col-list accordion-content">
|
|
<li>
|
|
<a href="/tin-khuyen-mai" class="d-flex align-items-center gap-12">
|
|
<span>Thông tin khuyến mại</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/san-pham-khuyen-mai" class="d-flex align-items-center gap-12">
|
|
<span>Sản phẩm khuyến mại</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/san-pham-hot" class="d-flex align-items-center gap-12">
|
|
<span>Sản phẩm bán chạy</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/san-pham-moi" class="d-flex align-items-center gap-12">
|
|
<span>Sản phẩm mới</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-payment">
|
|
<h3 class="col-title">PHƯƠNG THỨC THANH TOÁN</h3>
|
|
<div class="payment mb-12px" style="max-width: 280px">
|
|
<img src="/images/static-icon-accept-payments.png" alt="Phương thức thanh toán" class="d-flex w-100" />
|
|
</div>
|
|
<div class="ministry-of-industry-and-trade" style="max-width: 145px">
|
|
<img src="/images/static-image-bct.png" alt="Bộ công thương" class="d-flex w-100" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- COPYRIGHT -->
|
|
<div class="copy-right">
|
|
<div class="container">
|
|
<h5 class="text-13 text-center font-weight-300 py-2">
|
|
Bản quyền thuộc về Best Audio | Thiết kế website bởi Hurasoft
|
|
</h5>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>
|
|
<script src="/js/library.js"></script>
|
|
<script src="/js/main_mobile.js"></script>
|
|
</body>
|
|
|
|
</html> |