1564 lines
67 KiB
HTML
1564 lines
67 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 2</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_pc.css">
|
||
|
||
</head>
|
||
|
||
<body>
|
||
<!-- HEADER -->
|
||
<header class="global-header">
|
||
<!-- HEADER TOP -->
|
||
<div class="header-top bg-secondary">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-3">
|
||
<div class="wrapper d-flex align-items-center">
|
||
<i class="static-icons static-icons-static-icon-header-delivery"></i>
|
||
<span class="text-14 color-white ml-2">Freeship cho đơn hàng từ 1.000.000đ</span>
|
||
</div>
|
||
</div>
|
||
<div class="col-3 offset-5">
|
||
<div class="wrapper d-flex align-items-center">
|
||
<i class="static-icons static-icons-static-icon-header-phone"></i>
|
||
<span class="text-14 color-white ml-2">
|
||
Hotline 24/7:
|
||
<a href="tel:1900xxxx" class="font-weight-700">1900 XXXX</a></span>
|
||
</div>
|
||
</div>
|
||
<div class="col-1">
|
||
<div class="wrapper d-flex align-items-center">
|
||
<i class="static-icons static-icons-static-icon-header-user"></i>
|
||
<span class="text-14 color-white">Tài khoản</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- HEADER BOTTOM -->
|
||
<div class="header-bottom">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-2">
|
||
<a href="/" class="logo">
|
||
<img src="/images/audio-logo-demo-2.png" alt="Logo" class="d-flex w-100">
|
||
</a>
|
||
</div>
|
||
<div class="col-9 category">
|
||
<ul class="list d-flex align-items-center justify-content-around">
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-1.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-2.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-3.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-4.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-5.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;">
|
||
<div class="image mb-2">
|
||
<img src="/images/static-category-icon-6.png" alt="category icon" class="d-flex h-100 m-auto">
|
||
</div>
|
||
<p class="text text-14 text-uppercase">Hi-end</p>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-1 function">
|
||
<a href="javascript:;" class="icon p-relative">
|
||
<i class="static-icons static-icons-static-icon-header-search"></i>
|
||
</a>
|
||
<a href="/cart" class="icon">
|
||
<i class="static-icons static-icons-static-icon-header-cart"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- HOMEPAGE -->
|
||
<div class="homepage">
|
||
<!-- SECTION HERO -->
|
||
<div class="section-hero">
|
||
<div class="swiper swiper-section-hero">
|
||
<div class="swiper-wrapper">
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-banner-hero-img-1.png" alt="Banner" class="d-flex w-100">
|
||
<div class="wrapper-content text-center color-white">
|
||
<h4 class="title">MUSIC IS YOUR TIME MACHINE</h4>
|
||
<p class="text">
|
||
We hold our notes longer, better, and higher. We put the mental in instrumental and the cool in
|
||
musicool.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-banner-hero-img-1.png" alt="Banner" class="d-flex w-100">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="swiper-pagination"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<!-- SECTION BRAND -->
|
||
<div class="section-brand bg-secondary mt-12px">
|
||
<div class="swiper swiper-section-banner">
|
||
<div class="swiper-wrapper">
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-1.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-2.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-3.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-4.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-5.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-brand-img-6.png" alt="Brand" class="d-flex w-100">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SECTION DEAL -->
|
||
<div class="section-deal mt-12px">
|
||
<!-- HEADING -->
|
||
<div class="heading-deal row align-items-center">
|
||
<div class="col-4">
|
||
<div class="wrapper-title d-flex align-items-center gap-8">
|
||
<i class="title">Flash Sale</i>
|
||
<i class="static-icons static-icons-static-icon-thunder"></i>
|
||
<i class="time">15.02</i>
|
||
</div>
|
||
</div>
|
||
<div class="col-6 d-flex align-items-center gap-8">
|
||
<span>Kết thúc trong</span>
|
||
<div class="global-time-deal d-flex align-items-center font-weight-700 color-white">
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-2 text-right">
|
||
<a href="javascript:;" class="view-more">Xem tất cả +</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- PRODUCT -->
|
||
<div class="product-deal row">
|
||
<div class="col-8">
|
||
<div class="p-deal-featured grid grid--2-cols align-items-end">
|
||
<div class="p-info text-right">
|
||
<a href="">
|
||
<h3 class="p-name text-24 font-weight-600 mb-4">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
|
||
<p class="p-price-sale text-32 font-weight-700 color-primary mb-1">72.880.000₫</p>
|
||
|
||
<p class="p-price-stock text-24 font-weight-500 color-gray-2 text-line-through">82.880.000₫</p>
|
||
|
||
<p class="p-summary font-weight-300 my-4">
|
||
<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
|
||
labore et dolore magna aliqua. Ut enim ad minim veniam ...</span>
|
||
</p>
|
||
|
||
<div class="wrapper-deal p-relative mb-4">
|
||
<div class="deal-line total"></div>
|
||
<div class="deal-line remaining"></div>
|
||
<i class="static-icons static-icons-static-icon-fire"></i>
|
||
<p class="sold text-12 color-white">Đã bán 30</p>
|
||
</div>
|
||
|
||
<a href="" class="p-cart d-flex align-items-center justify-content-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro-big"></i>
|
||
<span class="text-20 font-weight-500 color-primary text-uppercase">Cho vào giỏ hàng</span>
|
||
</a>
|
||
|
||
</div>
|
||
<div class="p-image">
|
||
<a href="">
|
||
<img src="/images/static-image-pro-1.png" alt="Deal" class="d-flex w-100">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-4">
|
||
<div class="p-deal-other">
|
||
<div class="swiper swiper-deal-list">
|
||
<div class="swiper-wrapper">
|
||
<!-- SWIPER SLIDE -->
|
||
<div class="swiper-slide">
|
||
<div class="p-item d-flex gap-16">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Deal" class="p-img d-flex w-100">
|
||
</a>
|
||
<div class="p-info">
|
||
<a href="">
|
||
<h3 class="p-name mt-1">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<p class="p-price">
|
||
<span class="p-price-sale">72.880.000₫</span>
|
||
<span class="p-price-stock">82.880.000₫</span>
|
||
</p>
|
||
<div class="wrapper d-flex align-items-end gap-32 mt-2">
|
||
<div class="wrapper-deal p-relative flex-1 mb-2">
|
||
<div class="deal-line total"></div>
|
||
<div class="deal-line remaining"></div>
|
||
<i class="static-icons static-icons-static-icon-fire"></i>
|
||
<p class="sold text-12 color-white">Đã bán 30</p>
|
||
</div>
|
||
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- SWIPER SLIDE -->
|
||
<div class="swiper-slide">
|
||
<div class="p-item d-flex gap-16">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Deal" class="p-img d-flex w-100">
|
||
</a>
|
||
<div class="p-info">
|
||
<a href="">
|
||
<h3 class="p-name mt-1">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<p class="p-price">
|
||
<span class="p-price-sale">72.880.000₫</span>
|
||
<span class="p-price-stock">82.880.000₫</span>
|
||
</p>
|
||
<div class="wrapper d-flex align-items-end gap-32 mt-2">
|
||
<div class="wrapper-deal p-relative flex-1 mb-2">
|
||
<div class="deal-line total"></div>
|
||
<div class="deal-line remaining"></div>
|
||
<i class="static-icons static-icons-static-icon-fire"></i>
|
||
<p class="sold text-12 color-white">Đã bán 30</p>
|
||
</div>
|
||
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- SWIPER SLIDE -->
|
||
<div class="swiper-slide">
|
||
<div class="p-item d-flex gap-16">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Deal" class="p-img d-flex w-100">
|
||
</a>
|
||
<div class="p-info">
|
||
<a href="">
|
||
<h3 class="p-name mt-1">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<p class="p-price">
|
||
<span class="p-price-sale">72.880.000₫</span>
|
||
<span class="p-price-stock">82.880.000₫</span>
|
||
</p>
|
||
<div class="wrapper d-flex align-items-end gap-32 mt-2">
|
||
<div class="wrapper-deal p-relative flex-1 mb-2">
|
||
<div class="deal-line total"></div>
|
||
<div class="deal-line remaining"></div>
|
||
<i class="static-icons static-icons-static-icon-fire"></i>
|
||
<p class="sold text-12 color-white">Đã bán 30</p>
|
||
</div>
|
||
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BANNER -->
|
||
<div class="banner-deal mt-4">
|
||
<div class="row">
|
||
<div class="col-4">
|
||
<a href="javascript:;" class="banner-deal-image">
|
||
<img src="/images/static-banner-sale-img-1.png" alt="Deal" class="d-flex w-100">
|
||
<div class="overlay"></div>
|
||
<div class="wrapper-content">
|
||
<p class="title mb-2">Save Up To 30%</p>
|
||
<span class="text">Lorem ipsum dolor sit amet, consectetur</span>
|
||
<p class="btn text-20 font-weight-500 mt-3 bg-primary">MUA NGAY</p>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-4">
|
||
<a href="javascript:;" class="banner-deal-image">
|
||
<img src="/images/static-banner-sale-img-2.png" alt="Deal" class="d-flex w-100">
|
||
<div class="overlay"></div>
|
||
<div class="wrapper-content">
|
||
<p class="title mb-2">Save Up To 30%</p>
|
||
<span class="text">Lorem ipsum dolor sit amet, consectetur</span>
|
||
<p class="btn text-20 font-weight-500 mt-3 bg-primary">MUA NGAY</p>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<div class="col-4">
|
||
<a href="javascript:;" class="banner-deal-image">
|
||
<img src="/images/static-banner-sale-img-3.png" alt="Deal" class="d-flex w-100">
|
||
<div class="overlay"></div>
|
||
<div class="wrapper-content">
|
||
<p class="title mb-2">Save Up To 30%</p>
|
||
<span class="text">Lorem ipsum dolor sit amet, consectetur</span>
|
||
<p class="btn text-20 font-weight-500 mt-3 bg-primary">MUA NGAY</p>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- SECTION CATEGORY -->
|
||
<div class="section-category mt-12px pb-4">
|
||
<div class="category-box">
|
||
<div class="heading-primary d-flex align-items-center gap-24">
|
||
<h2 class="title">Âm Thanh Hi-End</h2>
|
||
<div class="offsite-wrapper">
|
||
<a href="javascript:;" class="view-more">Xem tất cả +</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="category-child mb-3">
|
||
<ul class="list d-flex align-items-center justify-content-center text-18 color-gray-2">
|
||
<li class="item hover-primary selected">Đầu phát Hi-end</li>
|
||
<li class="item hover-primary">DAC, Clock, Upsampler...</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="category-product grid grid--4-cols">
|
||
<div class="p-item">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Product" class="p-img d-flex w-100">
|
||
</a>
|
||
<a href="">
|
||
<h3 class="p-name">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<div class="p-price d-flex">
|
||
<div class="p-price-sale">72.880.000₫</div>
|
||
<div class="p-price-stock">82.880.000₫</div>
|
||
</div>
|
||
<div class="p-wrapper d-flex align-items-center justify-content-between mt-2">
|
||
<div class="p-summary">
|
||
<span class="ws-pre-line">+ Giá tốt nhất khi liên hệ ngay
|
||
+ Hỗ trợ kỹ thuật 24/7
|
||
+ Bảo hành chính hãng</span>
|
||
</div>
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SECTION CUSTOMER -->
|
||
<div class="section-customer">
|
||
<div class="heading-primary d-flex align-items-center gap-24">
|
||
<h2 class="title">Khách hàng đã mua gần đây</h2>
|
||
<div class="offsite-wrapper">
|
||
<a href="javascript:;" class="view-more">Xem tất cả +</a>
|
||
</div>
|
||
</div>
|
||
|
||
<ul class="list row">
|
||
<li class="item col-4">
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<img src="/images/static-banner-review-img-1.png" alt="Review"
|
||
class="customer-product-image d-flex w-100">
|
||
</div>
|
||
<div class="col-6">
|
||
<div class="customer-product-review">
|
||
<div class="star py-2">
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
</div>
|
||
<div class="review text-14 mb-2">
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||
et dolore magna aliqua. Ut enim ad minim veniam ...
|
||
</div>
|
||
<div class="basic-info d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-review-user"></i>
|
||
<p class="text-12">
|
||
<b class="d-block">Nguyễn Thị Hồng Nhung</b>
|
||
0383100 ***
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="item col-4">
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<img src="/images/static-banner-review-img-1.png" alt="Review"
|
||
class="customer-product-image d-flex w-100">
|
||
</div>
|
||
<div class="col-6">
|
||
<div class="customer-product-review">
|
||
<div class="star py-2">
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
</div>
|
||
<div class="review text-14 mb-2">
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||
et dolore magna aliqua. Ut enim ad minim veniam ...
|
||
</div>
|
||
<div class="basic-info d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-review-user"></i>
|
||
<p class="text-12">
|
||
<b class="d-block">Nguyễn Thị Hồng Nhung</b>
|
||
0383100 ***
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="item col-4">
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<img src="/images/static-banner-review-img-1.png" alt="Review"
|
||
class="customer-product-image d-flex w-100">
|
||
</div>
|
||
<div class="col-6">
|
||
<div class="customer-product-review">
|
||
<div class="star py-2">
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
<i class="static-icons static-icons-static-icon-star-orange"></i>
|
||
</div>
|
||
<div class="review text-14 mb-2">
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||
et dolore magna aliqua. Ut enim ad minim veniam ...
|
||
</div>
|
||
<div class="basic-info d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-review-user"></i>
|
||
<p class="text-12">
|
||
<b class="d-block">Nguyễn Thị Hồng Nhung</b>
|
||
0383100 ***
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BREADCRUMB -->
|
||
<section class="section-breadcrumb routing py-12px">
|
||
<div class="global-breadcrumb container">
|
||
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="list-style-none d-flex">
|
||
<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">
|
||
<!-- BANNER -->
|
||
<div class="banner p-relative mb-3">
|
||
<img src="/images/static-banner-category-img-1.png" alt="Banner" class="d-flex w-100">
|
||
<h1 class="overlay d-flex align-items-center justify-content-center">Hi-end</h1>
|
||
</div>
|
||
|
||
<!-- MAIN CONTENT -->
|
||
<div class="main-content row">
|
||
<div class="col-9">
|
||
<!-- SORT -->
|
||
<div class="sort d-flex align-items-center justify-content-between pb-2">
|
||
<div class="wrapper-sort d-flex align-items-center gap-16">
|
||
<div class="sort-by-display d-flex gap-8">
|
||
<a href="" class="d-flex"><i class="static-icons static-icons-static-icon-category-grid"></i></a>
|
||
<a href="" class="d-flex"><i class="static-icons static-icons-static-icon-category-list"></i></a>
|
||
</div>
|
||
<p class="total-product">Tổng 865 sản phẩm</p>
|
||
</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>
|
||
|
||
<!-- PRODUCT LIST -->
|
||
<div class="product-list mt-3 pt-1 grid grid--3-cols">
|
||
<div class="p-item">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Product" class="p-img d-flex w-100">
|
||
</a>
|
||
<a href="">
|
||
<h3 class="p-name">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<div class="p-price d-flex">
|
||
<div class="p-price-sale">72.880.000₫</div>
|
||
<div class="p-price-stock">82.880.000₫</div>
|
||
</div>
|
||
<div class="p-wrapper d-flex align-items-center justify-content-between mt-2">
|
||
<div class="p-summary">
|
||
<span class="ws-pre-line">+ Giá tốt nhất khi liên hệ ngay
|
||
+ Hỗ trợ kỹ thuật 24/7
|
||
+ Bảo hành chính hãng</span>
|
||
</div>
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<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>
|
||
|
||
<!-- FILTER -->
|
||
<div class="col-3">
|
||
<div class="filter">
|
||
<h2 class="title text-20 text-uppercase font-weight-700">Tìm kiếm theo</h2>
|
||
|
||
<!-- FILTER LIST -->
|
||
<ol class="filter-list list">
|
||
<!-- FILTER ITEM -->
|
||
<li class="filter-item mt-12px">
|
||
<h4 class="filter-name text-16 text-uppercase font-weight-700 mb-2">Theo hãng</h4>
|
||
|
||
<ul class="list">
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
|
||
<!-- FILTER ITEM -->
|
||
<li class="filter-item mt-12px">
|
||
<h4 class="filter-name text-16 text-uppercase font-weight-700 mb-2">Theo hãng</h4>
|
||
|
||
<ul class="list">
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
<li class="item">
|
||
<a href="javascript:;" class="d-flex align-items-center gap-8 mb-1">
|
||
<i class="check-box"></i>
|
||
<span>Accuphase (33)</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- DETAIL PAGE -->
|
||
<div class="product-detail-page d-none">
|
||
<div class="container">
|
||
<!-- SECTION PRODUCT -->
|
||
<div class="section-product row">
|
||
<!-- IMAGE THUMB -->
|
||
<div class="col-5">
|
||
<div class="pro-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-pro-1.png">
|
||
<img src="/images/static-image-pro-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-pro-1.png">
|
||
<img src="/images/static-image-pro-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-pro-1.png">
|
||
<img src="/images/static-image-pro-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div thumbsSlider="" class="swiper gallery-thumbs product-images-slider">
|
||
<div class="swiper-wrapper">
|
||
<!-- SLIDE -->
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-image-pro-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
||
</div>
|
||
<!-- SLIDE -->
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-image-pro-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
||
</div>
|
||
<!-- SLIDE -->
|
||
<div class="swiper-slide">
|
||
<img src="/images/static-image-pro-1.png" alt="Sản phẩm" class="d-flex w-100" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- INFO -->
|
||
<div class="col-6 offset-1">
|
||
<!-- -->
|
||
<h1 class="pro-name">Loa đứng Loa Cột Floor Standing Hi-end</h1>
|
||
<!-- -->
|
||
<p class="pro-sub-title text-16 font-weight-300">
|
||
Thương hiệu: <span class="color-primary">Fischer - Fischer</span>
|
||
<span class="ml-4">Star</span>
|
||
<span class="text-14 font-weight-400 color-blue ml-1">1 đánh giá</span>
|
||
</p>
|
||
<div class="gray-line mb-12px"></div>
|
||
<!-- -->
|
||
<div class="pro-price">
|
||
<p class="pro-price-sale mb-2">
|
||
<b class="title">Giá bán:</b>
|
||
<span class="text-28 font-weight-700 color-primary">189.900.000₫</span>
|
||
</p>
|
||
<p class="pro-price-stock mb-2">
|
||
<b class="title">Giá cũ:</b>
|
||
<del class="text-20 color-gray-2">189.900.000₫</del>
|
||
</p>
|
||
<p class="pro-price-saleoff mb-2">
|
||
<b class="title">Tiết kiệm:</b>
|
||
<span class="text-20">10.900.000₫</span>
|
||
<span class="text-16 color-primary ml-1">(-10%)</span>
|
||
</p>
|
||
</div>
|
||
<!-- -->
|
||
<div class="pro-status font-weight-300 my-3">
|
||
<span class="pro-status-item mr-1">Bảo hành: <b class="font-weight-600">12 tháng</b></span>
|
||
<span class="pro-status-item color-green font-weight-600">Còn hàng</span>
|
||
</div>
|
||
<!-- -->
|
||
<div class="pro-gift">
|
||
<p class="title mb-2">
|
||
<i class="static-icons static-icons-static-icon-red-gift mr-1"></i>
|
||
Quà khuyến mại
|
||
</p>
|
||
|
||
<ol class="list">
|
||
<li class="item">
|
||
<span class="marker">1</span>
|
||
Lì xì 1.000.000đ
|
||
</li>
|
||
<li class="item">
|
||
<span class="marker">2</span>
|
||
Miễn phí công lắp đặt
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
<!-- -->
|
||
<div class="pro-cart d-flex align-items-center justify-content-between my-3">
|
||
<input type="number" name="product quantity" class="pro-cart-quantity" value="1" min="1">
|
||
<a href="javascript:;" class="pro-cart-btn bg-primary color-white">Mua ngay</a>
|
||
<a href="javascript:;" class="pro-cart-btn color-primary" onclick="toggleModal('#js-modal-ct')">
|
||
<i class="static-icons static-icons-static-icon-phone-ct-orange mr-2"></i>
|
||
Liên hệ ngay
|
||
</a>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
<!-- -->
|
||
<div class="pro-social d-flex align-items-center gap-16">
|
||
<p class="text-16 font-weight-300">Chia sẻ:</p>
|
||
<ul class="list d-flex align-items-center gap-8">
|
||
<li>
|
||
<a href="javascript:;">
|
||
<i class="static-icons static-icons-static-icon-social-fb-orange"></i>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;">
|
||
<i class="static-icons static-icons-static-icon-social-gg-news-orange"></i>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;">
|
||
<i class="static-icons static-icons-static-icon-social-instagram-orange"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- -->
|
||
<div class="pro-features my-3">
|
||
<ul class="list text-13 row">
|
||
<li class="col-6 d-flex align-items-center gap-12">
|
||
<i class="static-icons static-icons-static-icon-feature-delivery-orange"></i>
|
||
<p class="wrapper">
|
||
<b class="d-block text-uppercase mb-1">Miễn phí vận chuyển</b>
|
||
<span class="font-weight-300">Tất cả các đơn hàng trên 1.000.000đ</span>
|
||
</p>
|
||
</li>
|
||
<li class="col-6 d-flex align-items-center gap-12">
|
||
<i class="static-icons static-icons-static-icon-feature-delivery-orange"></i>
|
||
<p class="wrapper">
|
||
<b class="d-block text-uppercase mb-1">Đổi trả dễ dàng</b>
|
||
<span class="font-weight-300">1 đổi 1 trong 15 ngày</span>
|
||
</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
|
||
<!-- SECTION PRODUCT SAME CATEOGRY -->
|
||
<div class="section-product-same-category">
|
||
<h2 class="text-20 font-weight-700 text-uppercase my-4">Sản phẩm thường được mua cùng</h2>
|
||
<div class="product-list mb-5">
|
||
<div class="swiper swiper-relative-product">
|
||
<div class="swiper-wrapper grid grid--4-cols" id="js-product-same-category-list">
|
||
<div class="p-item">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Product" class="p-img d-flex w-100">
|
||
</a>
|
||
<a href="">
|
||
<h3 class="p-name">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<div class="p-price d-flex">
|
||
<div class="p-price-sale">72.880.000₫</div>
|
||
<div class="p-price-stock">82.880.000₫</div>
|
||
</div>
|
||
<div class="p-wrapper d-flex align-items-center justify-content-between mt-2">
|
||
<div class="p-summary">
|
||
<span class="ws-pre-line">+ Giá tốt nhất khi liên hệ ngay
|
||
+ Hỗ trợ kỹ thuật 24/7
|
||
+ Bảo hành chính hãng</span>
|
||
</div>
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
|
||
<!-- SECTION PRODUCT SAME PRICE -->
|
||
<div class="section-product-same-price">
|
||
<h2 class="text-20 font-weight-700 text-uppercase my-4">Sản phẩm tương tự</h2>
|
||
<div class="product-list mb-5">
|
||
<div class="swiper swiper-relative-product">
|
||
<div class="swiper-wrapper grid grid--4-cols" id="js-product-same-price-list">
|
||
<div class="p-item">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Product" class="p-img d-flex w-100">
|
||
</a>
|
||
<a href="">
|
||
<h3 class="p-name">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<div class="p-price d-flex">
|
||
<div class="p-price-sale">72.880.000₫</div>
|
||
<div class="p-price-stock">82.880.000₫</div>
|
||
</div>
|
||
<div class="p-wrapper d-flex align-items-center justify-content-between mt-2">
|
||
<div class="p-summary">
|
||
<span class="ws-pre-line">+ Giá tốt nhất khi liên hệ ngay
|
||
+ Hỗ trợ kỹ thuật 24/7
|
||
+ Bảo hành chính hãng</span>
|
||
</div>
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
|
||
<!-- SECTION DESCRIPTION -->
|
||
<div class="section-description my-3 row">
|
||
<div class="col-2">
|
||
<h2 class="text-16 font-weight-400 text-uppercase">Mô tả</h2>
|
||
</div>
|
||
<div class="col-10">
|
||
<div class="content static-html">
|
||
Loa Gauder Akustik Darc 140 | Audio Hoàng Hải.
|
||
|
||
Loa Gauder Akustik Darc 140 là loại loa đứng âm bass phản xạ 3 đường tiếng. Hệ thống loa âm bass được mở
|
||
rộng, loa tầm trung bằng gốm và loa tweeter bằng gốm hoặc kim cương. Đế Darc 140 bằng nhôm cực kỳ chắc chắn,
|
||
có thể điều chỉnh linh hoạt thông qua các chi tiết thiết kế ở phía dưới đế loa.
|
||
|
||
Người nghe sẽ bị ấn tượng ngay từ cái nhìn đầu tiên bởi âm lượng từ cặp loa này phát ra cực kỳ lớn, rất dễ
|
||
dàng lấp đầy cả căn phòng rộng hơn 50m2. Dải trung của hệ thống lại sở hữu chất âm trong, rõ hơn hẳn so với
|
||
dải trầm, đồng thời thể hiện sự đồng nhất rõ rệt giữa khoảng trên và khoảng dưới, khiến cho việc thể hiện
|
||
các nhạc cụ bộ dây cũng như giọng vocal cực kỳ xuất sắc. Quãng âm cao cũng được thể hiện rất mượt mà, rất
|
||
tốt nhưng không để lại được nhiều ấn tượng giống như âm trung.
|
||
|
||
Gauder Akustik Darc 140 có bộ lọc chéo siêu mỏng (> 60 dB / octave).Cầu loa BiWiring với các giắc đấu nối
|
||
WBT-Nextgen nổi tiếng, đã làm nên tên tuổi của Gauder Akustik. Hệ thống cân bằng 6 lần ở mức thấp và mức
|
||
cao. Bộ phân tần được trang bị độc quyền với các thành phần của Mundorf.
|
||
|
||
Thùng loa vẫn sử dụng cùng nguyên lý xếp chồng (Rib-Construction) các khung xương bằng nhôm dày 1,57 inch
|
||
xen kẽn với lớp vật liệu hấp thu rung động. DARC 140 dùng đến 4 củ loa bass, trong đó 2 được bố trí phía
|
||
trên, 2 ở phía dưới; Phần củ loa mid và treb được đặt ở giữa thân loa, ngang tầm tai. Toàn bộ các củ loa này
|
||
đều do Accuton chế tạo theo yêu cầu kỹ thuật riêng từ chủ hãng – Tiến sĩ vật lý Roland Gauder - mọi thứ đều
|
||
được Sản xuất tại Đức.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
|
||
<!-- SECTION SPEC -->
|
||
<div class="section-spec my-3 row">
|
||
<div class="col-2">
|
||
<h2 class="text-16 font-weight-400 text-uppercase">Thông số kỹ thuật</h2>
|
||
</div>
|
||
<div class="col-10">
|
||
<div class="content static-html">
|
||
<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>
|
||
</div>
|
||
<div class="gray-line mb-12px"></div>
|
||
|
||
<!-- SECTION REVIEW -->
|
||
<div class="section-review row">
|
||
<div class="col-2">
|
||
<h2 class="text-16 font-weight-400 text-uppercase">Thảo luận (0)</h2>
|
||
</div>
|
||
<div class="col-10">
|
||
<h4 class="text-16 font-weight-700 mb-2">Chia sẻ suy nghĩ của bạn! Cho chúng tôi biết bạn nghĩ gì...</h4>
|
||
<a href="javascript:;" class="d-block mb-4">Để lại một đánh giá</a>
|
||
|
||
<div class="review-form">
|
||
<div class="review-star mb-3">
|
||
<p class="text-16 font-weight-700">Bạn đánh giá về sản phẩm này thế nào? *</p>
|
||
</div>
|
||
|
||
<div class="review-content">
|
||
<div class="review-form-item">
|
||
<label for="r-review" class="d-block mb-2 text-14 font-weight-700">Review *</label>
|
||
<textarea name="review" id="r-review" cols="30" rows="10" class="r-input"
|
||
placeholder="Hãy nói cho chúng tôi biết suy nghĩ của bạn về sản phẩm này"></textarea>
|
||
</div>
|
||
|
||
<div class="review-form-item">
|
||
<label for="r-name" class="d-block mb-2 text-14 font-weight-700">Họ Tên *</label>
|
||
<input type="text" name="name" id="r-name" class="r-input">
|
||
</div>
|
||
|
||
<div class="review-form-item">
|
||
<label for="r-email" class="d-block mb-2 text-14 font-weight-700">Email *</label>
|
||
<input type="email" name="email" id="r-email" class="r-input">
|
||
</div>
|
||
</div>
|
||
|
||
<a href="" class="review-btn">Lưu đánh giá</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- DEATAIL CONTACT POPUP -->
|
||
<div class="modal-global modal-player d-none" id="js-modal-ct">
|
||
<div class="contact-box game-policy">
|
||
<!-- PLAYER -->
|
||
<div class="contact-form" id="play-game-inside">
|
||
<div action="" class="form play-container">
|
||
<h4 class="form-title text-16 font-weight-700 text-uppercase color-secondary pb-12px mb-3 text-center">
|
||
Thông tin khách hàng</h4>
|
||
|
||
<div class="form-list px-3" id="js-user-info">
|
||
<input type="email" placeholder="Email*" id="js-ct-email" class="form-input" value="">
|
||
<input type="text" placeholder="Họ tên*" id="js-ct-name" class="form-input" value="">
|
||
<input type="text" placeholder="Số điện thoại*" id="js-ct-tel" class="form-input" value="">
|
||
|
||
<p class="text-13 text-center my-3">
|
||
Liên hệ ngay
|
||
<a href="tel:0828826688" class="font-weight-600 color-primary">0828826688</a>
|
||
hoặc
|
||
<a href="tel:0828826688" class="font-weight-600 color-primary">0828826688</a>
|
||
để được tư vấn
|
||
</p>
|
||
<a href="javascript:;" type="submit"
|
||
class="form-btn bg-primary d-flex align-items-center justify-content-center color-white text-uppercase font-weight-600"
|
||
onclick="_submitContact()">Nhận báo giá tốt nhất hôm nay</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="btn-close" onclick="toggleModal('#js-modal-ct')">
|
||
<span class="text-24 font-weight-500 color-white">X</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- DEAL PAGE -->
|
||
<div class="deal-page d-none">
|
||
<div class="container homepage">
|
||
<!-- SECTION DEAL -->
|
||
<div class="section-deal mt-12px">
|
||
<!-- HEADING -->
|
||
<div class="heading-deal row align-items-center justify-content-center gap-24">
|
||
<div class="">
|
||
<div class="wrapper-title d-flex align-items-center gap-8">
|
||
<i class="title">Flash Sale</i>
|
||
<i class="static-icons static-icons-static-icon-thunder"></i>
|
||
<i class="time">15.02</i>
|
||
</div>
|
||
</div>
|
||
<div class="d-flex align-items-center gap-8">
|
||
<span>Kết thúc trong</span>
|
||
<div class="global-time-deal d-flex align-items-center font-weight-700 color-white">
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
<span>:</span>
|
||
<p>9</p>
|
||
<p>9</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- PRODUCT -->
|
||
<div class="product-deal p-deal-other grid grid--4-cols">
|
||
<div class="p-item">
|
||
<a href="" class="p-image">
|
||
<img src="/images/static-image-pro-1.png" alt="Product" class="p-img d-flex w-100">
|
||
</a>
|
||
<a href="">
|
||
<h3 class="p-name">Lorem ipsum is placeholder text commonly used</h3>
|
||
</a>
|
||
<div class="p-price d-flex">
|
||
<div class="p-price-sale">72.880.000₫</div>
|
||
<div class="p-price-stock">82.880.000₫</div>
|
||
</div>
|
||
<div class="p-wrapper d-flex align-items-center justify-content-between mt-2">
|
||
<div class="p-summary">
|
||
<span class="ws-pre-line">+ Giá tốt nhất khi liên hệ ngay
|
||
+ Hỗ trợ kỹ thuật 24/7
|
||
+ Bảo hành chính hãng</span>
|
||
</div>
|
||
<a href="javascript:;" class="p-cart">
|
||
<i class="static-icons static-icons-static-icon-header-cart-pro"></i>
|
||
</a>
|
||
</div>
|
||
<div class="wrapper-deal p-relative mt-4">
|
||
<div class="deal-line total"></div>
|
||
<div class="deal-line remaining"></div>
|
||
<i class="static-icons static-icons-static-icon-fire"></i>
|
||
<p class="sold text-12 color-white">Đã bán 30</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CART PAGE -->
|
||
<div class="cart-page d-none">
|
||
<div class="container">
|
||
<form class="row">
|
||
<div class="col-4">
|
||
<div class="cart-box customer-info">
|
||
<div class="heading bg-primary color-white d-flex gap-12 p-12px">
|
||
<img src="/images/static-icon-cart-location.png" alt="icon cart" class="cart-icon d-flex">
|
||
<h2 class="text-16 text-uppercase font-weight-700">Thông tin giao hàng</h2>
|
||
</div>
|
||
|
||
<div class="content">
|
||
<p class="text-13 mb-12px">
|
||
Để tiếp tục đặt hàng, quý khách xin vui lòng
|
||
<a href="/taikhoan" class="color-primary text-under-line">Đăng nhập</a>
|
||
hoặc nhập thông tin bên dưới
|
||
</p>
|
||
|
||
<input type="text" name="" id="" class="input-w" placeholder="Họ và tên">
|
||
<input type="text" name="" id="" class="input-w" placeholder="Email">
|
||
<input type="text" name="" id="" class="input-w" placeholder="Số điện thoại">
|
||
<div class="d-flex gap-12">
|
||
<select name="" id="" class="input-w">
|
||
<option value="">Chọn Tỉnh thành</option>
|
||
</select>
|
||
<select name="" id="" class="input-w">
|
||
<option value="">Chọn Quận/ Huyện</option>
|
||
</select>
|
||
</div>
|
||
<input type="text" name="" id="" class="input-w" placeholder="Địa chỉ">
|
||
<textarea name="" id="" cols="30" rows="10" class="input-w" placeholder="Ghi chú"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-4">
|
||
<div class="cart-box payment mb-12px">
|
||
<div class="heading bg-primary color-white d-flex gap-12 p-12px">
|
||
<img src="/images/static-icon-cart-card.png" alt="icon cart" class="cart-icon d-flex">
|
||
<h2 class="text-16 text-uppercase font-weight-700">Phương thức thanh toán</h2>
|
||
</div>
|
||
|
||
<div class="content">
|
||
<ul class="list list-radio">
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-payment-1" name="payment" checked>
|
||
<label for="check-payment-1">Thanh toán tiền mặt khi nhận hàng (tiền mặt/quẹt thẻ
|
||
ATM,Visa,Master)</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-payment-2" name="payment">
|
||
<label for="check-payment-2">Thanh toán qua chuyển khoản qua tài khoản ngân hàng(khuyên dùng)</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-payment-3" name="payment">
|
||
<label for="check-payment-3">Thanh toán qua Ngân Lượng (ATM nội địa, Visa,Master)</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-payment-4" name="payment">
|
||
<label for="check-payment-4">Trả góp Alepay (Ngân Lượng)</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-payment-5" name="payment">
|
||
<label for="check-payment-5">Thanh toán trực tuyến (Bằng thẻ ATM/Visa/Master qua cổng VnPay)</label>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="cart-box delivery">
|
||
<div class="heading bg-primary color-white d-flex gap-12 p-12px">
|
||
<img src="/images/static-icon-cart-truck.png" alt="icon cart" class="cart-icon d-flex">
|
||
<h2 class="text-16 text-uppercase font-weight-700">Phương thức vận chuyển</h2>
|
||
</div>
|
||
|
||
<div class="content">
|
||
<ul class="list list-radio">
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-delivery-1" name="delivery" checked>
|
||
<label for="check-delivery-1">Giao hàng trong 48h: 0đ</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-delivery-2" name="delivery">
|
||
<label for="check-delivery-2">[NowFree] Giao hàng nhanh trong 2 giờ: 9,000 đ Đơn hàng không đủ điều
|
||
kiện giao nhanh 2 giờ (xem
|
||
thêm)
|
||
</label>
|
||
</li>
|
||
<li class="item">
|
||
<input class="d-none" type="radio" id="check-delivery-3" name="delivery">
|
||
<label for="check-delivery-3">[Nhanh] Nhận hàng vào 11 Th03 - 17 Th03: 16,000 đ</label>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-4">
|
||
<div class="cart-box cart-container mb-12px">
|
||
<div class="heading d-flex align-items-center gap-12 p-12px">
|
||
<h2 class="text-16 text-uppercase font-weight-700">Giỏ hàng</h2>
|
||
<span>1 sản phẩm</span>
|
||
</div>
|
||
|
||
<div class="content-w">
|
||
<!-- CART LIST -->
|
||
<div class="cart-list">
|
||
<div class="c-item">
|
||
<div class="c-left">
|
||
<img src="/images/static-image-pro-1.png" alt="cart-item" class="c-img d-flex w-100"
|
||
class="d-flex w-100">
|
||
<a href="javascript:;" class="c-delete">Xóa</a>
|
||
</div>
|
||
<div class="c-right flex-1">
|
||
<h3 class="c-name line-clamp-2">Loa đứng Loa Cột Floor Standing Hi-end</h3>
|
||
<p class="c-price">72.880.000₫</p>
|
||
<p class="d-flex align-items-center gap-12">
|
||
<span>Số lượng</span>
|
||
<input class="c-quantity" type="number" value="1" min="1">
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CART VOUCHER -->
|
||
<div class="cart-voucher d-flex gap-8 pb-3 px-12px">
|
||
<input class="cart-voucher-input" type="text" name="" id="" placeholder="Nhập mã ưu đãi">
|
||
<a class="cart-btn">Áp dụng</a>
|
||
</div>
|
||
|
||
<!-- CART SEND -->
|
||
<div class="cart-send p-12px text-14">
|
||
<div class="d-flex align-items-center justify-content-between pb-3">
|
||
<p>Phí vận chuyển:</p>
|
||
<p>Miễn phí</p>
|
||
</div>
|
||
<div class="d-flex align-items-center justify-content-between pb-3 font-weight-700">
|
||
<p>Tổng tiền:</p>
|
||
<p>72.880.000₫</p>
|
||
</div>
|
||
|
||
<a class="cart-btn">Hoàn tất đơn hàng</a>
|
||
<a href="/" class="d-block text-16 text-center font-weight-500 color-primary pt-3 pb-2">Tiếp tục mua
|
||
sắm</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SCROLL TOP -->
|
||
<a href="javascript:window.scrollTo({ top: 0, behavior: 'smooth' });" class="scroll-top-btn"
|
||
title="Di chuyển lên đầu trang!" style="display: flex">
|
||
<i class="fa fa-arrow-up" aria-hidden="true"></i>
|
||
</a>
|
||
|
||
<!--SUCCESS -->
|
||
<div class="success-form hide">
|
||
<div class="cart-success">
|
||
<svg class="success-form-svg" viewBox="0 0 26 26" xmlns="http://www.w3.org/2000/svg">
|
||
<g stroke="currentColor" stroke-width="2" fill="none" fill-rule="evenodd" stroke-linecap="round"
|
||
stroke-linejoin="round">
|
||
<path class="circle"
|
||
d="M13 1C6.372583 1 1 6.372583 1 13s5.372583 12 12 12 12-5.372583 12-12S19.627417 1 13 1z" />
|
||
<path class="tick" d="M6.5 13.5L10 17 l8.808621-8.308621" />
|
||
</g>
|
||
</svg>
|
||
<p class="text-cart-success">
|
||
Thêm sản phẩm vào giỏ hàng thành công!
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- FOOTER -->
|
||
<footer class="global-footer mt-4">
|
||
<!-- FOOTER TOP -->
|
||
<div class="footer-top">
|
||
<div class="container">
|
||
<ul class="features row list d-flex align-items-center">
|
||
<li class="col-3">
|
||
<p class="item d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-feature-delivery"></i>
|
||
<span class="text-13">
|
||
<b class="d-block font-weight-700">Miễn phí vận chuyển</b>
|
||
Tất cả các đơn hàng trên 1.000.000đ
|
||
</span>
|
||
</p>
|
||
</li>
|
||
<li class="col-3">
|
||
<p class="item d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-feature-calendar"></i>
|
||
<span class="text-13">
|
||
<b class="d-block font-weight-700">Đổi trả dễ dàng</b>
|
||
1 đổi 1 trong 15 ngày
|
||
</span>
|
||
</p>
|
||
</li>
|
||
<li class="col-3">
|
||
<p class="item d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-feature-wallet"></i>
|
||
<span class="text-13">
|
||
<b class="d-block font-weight-700">Thanh toán tiện lợi</b>
|
||
Trả tiền mặt, CK, trả góp 0%
|
||
</span>
|
||
</p>
|
||
</li>
|
||
<li class="col-3">
|
||
<p class="item d-flex align-items-center gap-8">
|
||
<i class="static-icons static-icons-static-icon-feature-phone"></i>
|
||
<span class="text-13">
|
||
<b class="d-block font-weight-700">Hỗ trợ nhiệt tình</b>
|
||
Tư vấn, giải đáp mọi thắc mắc
|
||
</span>
|
||
</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- FOOTER MID -->
|
||
<div class="footer-mid">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-2">
|
||
<a href="/" class="logo">
|
||
<img src="/images/audio-logo-demo-2.png" alt="Logo" class="d-flex w-100">
|
||
</a>
|
||
</div>
|
||
<div class="col-6">
|
||
<p class="text-13">
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
||
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
|
||
ea commodo consequat.</p>
|
||
</div>
|
||
<div class="col-3 offset-1">
|
||
<div class="wrapper d-flex align-items-center justify-content-between">
|
||
<a href="javascript:;" class="d-flex">
|
||
<i class="static-icons static-icons-static-icon-social-fb"></i>
|
||
</a>
|
||
<a href="javascript:;" class="d-flex">
|
||
<i class="static-icons static-icons-static-icon-social-gg-news"></i>
|
||
</a>
|
||
<a href="javascript:;" class="d-flex">
|
||
<i class="static-icons static-icons-static-icon-social-youtube"></i>
|
||
</a>
|
||
<a href="javascript:;" class="d-flex">
|
||
<i class="static-icons static-icons-static-icon-social-twitter"></i>
|
||
</a>
|
||
<a href="javascript:;" class="d-flex">
|
||
<i class="static-icons static-icons-static-icon-social-instagram"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- FOOTER BOTTOM -->
|
||
<div class="footer-bottom bg-secondary text-13 color-white">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-3">
|
||
<h3 class="text-13 font-weight-700 text-uppercase mb-12px">Liên hệ</h3>
|
||
<ul class="list">
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<i class="static-icons 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:02438524.524" class="d-flex align-items-center gap-12">
|
||
<i class="static-icons static-icons-static-icon-phone-ct"></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-icons-static-icon-phone-ct"></i>
|
||
<span>Điện thoại: 0988.034.960</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<div class="ministry-of-industry-and-trade">
|
||
<img src="/images/static-image-bct.png" alt="Bộ công thương" class="d-flex w-100">
|
||
</div>
|
||
</div>
|
||
<div class="col-3">
|
||
<h3 class="text-13 font-weight-700 text-uppercase mb-12px">THÔNG TIN HỮU ÍCH</h3>
|
||
<ul class="list">
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Giới thiệu</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Tuyển dụng</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Tin tức</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Ý kiến khách hàng</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" 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="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Liên hệ</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-3">
|
||
<h3 class="text-13 font-weight-700 text-uppercase mb-12px">HỖ TRỢ MUA HÀNG</h3>
|
||
<ul class="list">
|
||
<li>
|
||
<a href="javascript:;" 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="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Các hình thức thanh toán</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Tại sao chọn mua hàng online</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Các hình thức mua hàng</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Chính sách vận chuyển</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" 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="javascript:;" 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-3">
|
||
<h3 class="text-13 font-weight-700 text-uppercase mb-12px">THÔNG TIN KHUYẾN MẠI</h3>
|
||
<ul class="list">
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Thông tin khuyến mại</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Sản phẩm khuyến mại</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Sản phẩm bán chạy</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="javascript:;" class="d-flex align-items-center gap-12">
|
||
<span>Sản phẩm mới</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- COPYRIGHT -->
|
||
<div class="copy-right bg-secondary color-white">
|
||
<div class="container">
|
||
<h5 class="text-13 text-center font-weight-300 py-3">
|
||
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_pc.js"></script>
|
||
|
||
</body>
|
||
|
||
</html> |