update
This commit is contained in:
@@ -1,495 +1,475 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="vi">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Chi Tiết Sản Phẩm - MIQ</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;800&family=Inter:wght@400;600;800&display=swap" rel="stylesheet" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;800&family=Inter:wght@400;600;800&display=swap"
|
||||
rel="stylesheet" />
|
||||
<style>
|
||||
body { font-family: "Roboto", sans-serif; margin: 0; }
|
||||
.font-inter { font-family: "Inter", sans-serif; }
|
||||
.star-row { display: grid; grid-template-columns: 10px 12px 232px 36px; align-items: center; column-gap: 9px; }
|
||||
.star-bar { height: 6px; border-radius: 9999px; background: #e6e6e6; overflow: hidden; }
|
||||
.star-bar > span { display: block; height: 100%; background: #0084ff; }
|
||||
body {
|
||||
font-family: "Roboto", sans-serif;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.font-inter {
|
||||
font-family: "Inter", sans-serif;
|
||||
}
|
||||
|
||||
.star-row {
|
||||
display: grid;
|
||||
grid-template-columns: 10px 12px 232px 36px;
|
||||
align-items: center;
|
||||
column-gap: 9px;
|
||||
}
|
||||
|
||||
.star-bar {
|
||||
height: 6px;
|
||||
border-radius: 9999px;
|
||||
background: #e6e6e6;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.star-bar>span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
background: #0084ff;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="bg-[#f4f4f4] min-w-[1440px]">
|
||||
|
||||
<header class="w-full flex flex-col items-center bg-white" style="min-width:1440px">
|
||||
<div class="w-full relative h-8 flex items-center px-[120px] overflow-hidden" style="background:#c00060">
|
||||
<img src="image/header_slogan_bg.png" alt="" class="absolute inset-0 w-full h-full object-cover pointer-events-none" />
|
||||
<div class="relative flex items-center justify-between w-[1200px] mx-auto">
|
||||
<div class="flex items-center gap-[22px]">
|
||||
<div class="flex items-center gap-1">
|
||||
<img src="image/icon_certificate.svg" alt="" class="w-5 h-5" />
|
||||
<span class="text-white text-xs font-semibold tracking-tight">Sản phẩm <strong>Chính hãng - xuất VAT</strong> đầy đủ</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<img src="image/icon_delivery_truck.svg" alt="" class="w-5 h-5" />
|
||||
<span class="text-white text-xs font-semibold tracking-tight">Giao nhanh - Miễn phí</span>
|
||||
</div>
|
||||
|
||||
<main class="w-full px-[120px] pt-[20px] pb-[27px]" style="min-width:1440px">
|
||||
<div class="w-[1200px] mx-auto flex flex-col gap-3">
|
||||
<div class="flex items-center gap-2 text-[13px] text-black">
|
||||
<a href="#" class="hover:text-[#e4057c]">Tủ lạnh</a>
|
||||
<img src="image/icon_arrow_next.svg" alt="" class="w-[10px] h-[10px]" />
|
||||
<a href="#" class="hover:text-[#e4057c]">Tủ lạnh Toshiba</a>
|
||||
</div>
|
||||
<div class="flex items-center gap-[5px]">
|
||||
<img src="image/icon_customer_support.svg" alt="" class="w-5 h-5" />
|
||||
<span class="text-white text-xs font-semibold font-inter tracking-tight">Hotline: <strong>0967641641</strong></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full bg-[#e4057c] h-[68px] flex items-center px-[120px]">
|
||||
<div class="flex items-center gap-9 w-[1200px] mx-auto">
|
||||
<div class="h-[54px] w-[79px] relative shrink-0">
|
||||
<img src="image/logo_miq.png" alt="MIQ Logo" class="absolute inset-0 w-full h-full object-contain" />
|
||||
</div>
|
||||
<div class="flex items-center gap-[10px] cursor-pointer">
|
||||
<img src="image/icon_menu.svg" alt="" class="w-6 h-6" />
|
||||
<span class="text-white text-sm font-semibold">Danh mục</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-[35px] flex-1">
|
||||
<div class="relative w-[465px] h-9">
|
||||
<div class="absolute inset-0 bg-white rounded-full"></div>
|
||||
<img src="image/icon_search.svg" alt="" class="absolute left-[15px] top-[8px] w-5 h-5" />
|
||||
<input type="text" placeholder="Tivi Samsung giá sốc" class="absolute inset-0 bg-transparent rounded-full pl-[44px] pr-4 text-[13px] text-[#e4057c] outline-none w-full" />
|
||||
</div>
|
||||
<div class="flex items-center gap-[10px] cursor-pointer">
|
||||
<img src="image/icon_login.svg" alt="" class="h-[18px]" />
|
||||
<span class="text-white text-sm font-semibold">Đăng nhập</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-[10px] cursor-pointer">
|
||||
<img src="image/icon_cart.svg" alt="" class="w-[23px] h-[23px]" />
|
||||
<span class="text-white text-sm font-semibold">Giỏ hàng</span>
|
||||
</div>
|
||||
<div class="bg-[#b70061] h-8 rounded-full flex items-center justify-between px-3 w-[199px] cursor-pointer">
|
||||
<div class="flex items-center gap-[10px]">
|
||||
<img src="image/icon_map.svg" alt="" class="w-5 h-5" />
|
||||
<span class="text-white text-[13px]">Showroom</span>
|
||||
</div>
|
||||
<img src="image/icon_arrow_next.svg" alt="" class="w-3 h-3" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full bg-[#ebecf0] h-8 flex items-center justify-center">
|
||||
<div class="flex items-center gap-[20px] text-[#90004b] text-[13px] font-normal tracking-tight">
|
||||
<a href="#" class="hover:underline">máy lạnh</a>
|
||||
<a href="#" class="hover:underline">tủ lạnh</a>
|
||||
<a href="#" class="hover:underline">máy lọc nước</a>
|
||||
<a href="#" class="hover:underline">quạt sưởi</a>
|
||||
<a href="#" class="hover:underline">nồi chiên</a>
|
||||
<a href="#" class="hover:underline">smart tivi</a>
|
||||
<a href="#" class="hover:underline">loa</a>
|
||||
<a href="#" class="hover:underline">nồi cơm điện</a>
|
||||
<a href="#" class="hover:underline">màn hình máy tính</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="w-full px-[120px] pt-[20px] pb-[27px]" style="min-width:1440px">
|
||||
<div class="w-[1200px] mx-auto flex flex-col gap-3">
|
||||
<div class="flex items-center gap-2 text-[13px] text-black">
|
||||
<a href="#" class="hover:text-[#e4057c]">Tủ lạnh</a>
|
||||
<img src="image/icon_arrow_next.svg" alt="" class="w-[10px] h-[10px]" />
|
||||
<a href="#" class="hover:text-[#e4057c]">Tủ lạnh Toshiba</a>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="flex items-center gap-3">
|
||||
<h1 class="text-[20px] font-bold tracking-[-0.4px] text-black leading-none">Tủ lạnh Toshiba Inverter 711 lít Side By Side GR-RS910WI-PMV(06)-MG</h1>
|
||||
<span class="h-5 rounded-[4px] bg-[#fff3f3] text-[#e40000] text-[12px] px-[11px] leading-5">Mẫu mới</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-3 text-[14px] tracking-[-0.28px]">
|
||||
<span class="text-[#959595]">Đã bán 2.3k</span>
|
||||
<span class="text-[#959595] flex items-center gap-1">
|
||||
<img src="image/icon_rating_star.svg" alt="" class="w-[13px] h-[13px]" />
|
||||
4.9
|
||||
</span>
|
||||
<a href="#" class="text-[#0084ff] flex items-center gap-1">
|
||||
<span class="inline-flex items-center justify-center w-5 h-5 rounded-full border border-[#0084ff] text-[11px]">i</span>
|
||||
Thông số
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-start gap-3">
|
||||
<section class="w-[796px] flex flex-col gap-3">
|
||||
<div class="bg-white rounded-[8px] px-3 py-[10px] flex flex-col gap-2">
|
||||
<div class="w-[392px] h-[392px] mx-auto rounded-[8px] overflow-hidden">
|
||||
<img src="image/product_sale_image.png" alt="Tủ lạnh Toshiba" class="w-full h-full object-cover" />
|
||||
</div>
|
||||
<div class="grid grid-cols-[repeat(13,52px)] gap-2">
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden border border-[#57aeff]"><img src="image/product_history_1.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-2 flex flex-col gap-3">
|
||||
<h2 class="font-inter text-[16px] font-bold tracking-[-0.32px]">MIQ cam kết</h2>
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<div class="grid grid-cols-2 gap-x-[126px] gap-y-3 text-[13px] text-black tracking-[-0.26px]">
|
||||
<p class="flex items-start gap-2"><img src="image/icon_double_next_small.svg" alt="" class="w-7 h-7 mt-[-2px]" />Hư gì đổi nấy 12 tháng tận nhà (miễn phí tháng đầu) <a href="#" class="underline">Xem chi tiết</a></p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_certificate.svg" alt="" class="w-7 h-7 mt-[-2px]" />Bảo hành chính hãng 2 năm, có người đến tận nhà <a href="#" class="underline">Xem chi tiết bảo hành</a></p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_certificate.svg" alt="" class="w-7 h-7 mt-[-2px]" />Bảo hành máy nén 10 năm (sản phẩm mua từ ngày 01/07/2024)</p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_customer_support.svg" alt="" class="w-7 h-7 mt-[-2px]" />Nếu dùng cho hoạt động kinh doanh (nhà máy, khách sạn, giặt ủi...) thì không được bảo hành.</p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_double_next_small.svg" alt="" class="w-7 h-7 mt-[-2px]" />Lắp đặt miễn phí lúc giao hàng</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] p-3 flex flex-col gap-3">
|
||||
<h3 class="text-[16px] font-bold tracking-[-0.32px]">Tham khảo thêm sản phẩm cũ, trưng bày</h3>
|
||||
<div class="h-[98px] rounded-[8px] border border-[#ebebeb] flex items-center gap-3 px-3 py-[9px]">
|
||||
<img src="image/product_history_1.png" alt="" class="w-20 h-20 rounded-[2px] object-cover" />
|
||||
<div class="w-[472px] flex flex-col gap-1">
|
||||
<p class="text-[14px] font-semibold leading-6 tracking-[-0.28px]">Tủ lạnh Toshiba Inverter 711 lít Side By Side GR-RS910WI-PMV(06)-MG</p>
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="text-[13px]">Giá từ:</p>
|
||||
<p class="text-[15px] font-bold text-[#cd0000]">11.590.000₫</p>
|
||||
<span class="h-5 rounded-[4px] bg-[#ce0000] text-white text-[11px] px-1 leading-5">-50%</span>
|
||||
</div>
|
||||
<p class="text-[13px] leading-6 tracking-[-0.26px]">Bảo hành Chính hãng đến 15/08/2027</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-[15px] flex flex-col gap-2">
|
||||
<h3 class="text-[16px] font-bold tracking-[-0.32px]">Đặc điểm nổi bật</h3>
|
||||
<ul class="list-disc ps-5 text-[13px] leading-[22px] tracking-[-0.26px]">
|
||||
<li>Dung tích sử dụng 711 lít phù hợp nhu cầu sử dụng gia đình có 5 thành viên trở lên.</li>
|
||||
<li>Tiết kiệm điện hiệu quả, tránh lãng phí điện năng nhờ công nghệ Origin Inverter.</li>
|
||||
<li>Luồng khí lạnh đa chiều Multi Air Flow giúp thực phẩm luôn tươi ngon.</li>
|
||||
<li>Công nghệ PureAir Turbo giảm thiểu mùi khó chịu trong tủ lạnh.</li>
|
||||
<li>Kết nối, điều khiển từ xa tiện lợi thông qua ứng dụng TSmartLife.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-[22px] flex flex-col gap-4">
|
||||
<div class="flex items-center justify-center gap-3">
|
||||
<button class="w-[205px] h-10 rounded-[4px] border border-[#0084ff] bg-[#edf7ff] text-[16px] text-[#0084ff] font-bold tracking-[-0.32px]">Thông số kỹ thuật</button>
|
||||
<button class="w-[205px] h-10 rounded-[4px] border border-[#e6e6e6] bg-white text-[16px] text-black font-bold tracking-[-0.32px]">Thông tin sản phẩm</button>
|
||||
</div>
|
||||
<div class="h-10 rounded-[4px] bg-[#f2f4f7] flex items-center justify-between px-2">
|
||||
<p class="font-inter font-semibold text-[13px] tracking-[-0.26px]">Tổng quan</p>
|
||||
<img src="image/icon_arrow_next.svg" alt="" class="w-5 h-5 rotate-90" />
|
||||
</div>
|
||||
<div class="grid grid-cols-[196px_1fr] gap-x-[88px] gap-y-[24px] px-3 text-[13px] tracking-[-0.26px]">
|
||||
<p>Kiểu tủ</p><p>Tủ lớn - Side by Side - 2 cánh</p>
|
||||
<p>Dung tích tổng:</p><p>768 lít</p>
|
||||
<p>Dung tích sử dụng:</p><p>711 lít - Trên 5 người</p>
|
||||
<p>Dung tích ngăn đá:</p><p>273 lít</p>
|
||||
<p>Dung tích ngăn lạnh:</p><p>438 lít</p>
|
||||
<p>Chất liệu khay ngăn lạnh:</p><p>Kính chịu lực</p>
|
||||
<p>Chất liệu ống dẫn gas, dàn lạnh:</p><p>Ống dẫn gas bằng Sắt và Đồng - Lá tản nhiệt bằng Nhôm</p>
|
||||
<p>Năm ra mắt:</p><p>2025</p>
|
||||
<p>Năm ra mắt: 2025 Sản xuất tại:</p><p>Trung Quốc</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] px-3 py-4 flex flex-col gap-5">
|
||||
<h3 class="text-[18px] font-semibold tracking-[-0.36px]">Đánh giá Tủ lạnh Toshiba Inverter 711 lít Side By Side GR-RS910WI-PMV(06)-MG</h3>
|
||||
<div class="flex items-center justify-center gap-5">
|
||||
<div class="w-[112px] flex flex-col items-center gap-1">
|
||||
<p class="text-[32px] font-extrabold font-inter tracking-[-0.64px]">4.9<span class="text-[13px] text-[#9d9d9d] font-normal">/5</span></p>
|
||||
<p class="text-[13px] font-inter">1,7k khách hài lòng</p>
|
||||
<p class="text-[13px] text-[#9d9d9d] font-inter">5 đánh giá</p>
|
||||
</div>
|
||||
<div class="w-[315px] flex flex-col gap-2 text-[13px]">
|
||||
<div class="star-row"><span>5</span><span>★</span><div class="star-bar"><span style="width:98.2%"></span></div><span>98.2%</span></div>
|
||||
<div class="star-row"><span>4</span><span>★</span><div class="star-bar"></div><span>0</span></div>
|
||||
<div class="star-row"><span>3</span><span>★</span><div class="star-bar"></div><span>0</span></div>
|
||||
<div class="star-row"><span>2</span><span>★</span><div class="star-bar"></div><span>0</span></div>
|
||||
<div class="star-row"><span>1</span><span>★</span><div class="star-bar"></div><span>0</span></div>
|
||||
</div>
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
</div>
|
||||
|
||||
<div class="w-[754px] grid gap-2 text-[13px] tracking-[-0.26px]">
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="font-bold">Nguyễn Lê Tuấn</p>
|
||||
<span class="text-[#35b327]">●</span>
|
||||
<p class="text-[#35b327] font-medium">Đã mua tại MIQ</p>
|
||||
</div>
|
||||
<p>★★★★★ <span class="mx-2 text-[#9d9d9d]">|</span> ❤ Sẽ giới thiệu cho bạn bè, người thân</p>
|
||||
<p>Tủ lạnh có ngăn chứa rất rộng rãi để được nhiều thực phẩm, có app theo dõi rất tiện lợi, mua được ngay dịp sale giá rẻ, có dịp mình sẽ ủng hộ nữa</p>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#e8e8e8] w-[772px]"></div>
|
||||
|
||||
<div class="w-[754px] grid gap-2 text-[13px] tracking-[-0.26px]">
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="font-bold">Nguyễn Lê Tuấn</p>
|
||||
<span class="text-[#35b327]">●</span>
|
||||
<p class="text-[#35b327] font-medium">Đã mua tại MIQ</p>
|
||||
</div>
|
||||
<p>★★★★★ <span class="mx-2 text-[#9d9d9d]">|</span> ❤ Sẽ giới thiệu cho bạn bè, người thân</p>
|
||||
<p>Tủ lạnh có ngăn chứa rất rộng rãi để được nhiều thực phẩm, có app theo dõi rất tiện lợi, mua được ngay dịp sale giá rẻ, có dịp mình sẽ ủng hộ nữa</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<button class="w-[231px] h-10 rounded-[4px] border border-[#8c8c8c] text-[#6b6b6b] text-[13px] font-medium">Xem 5 đánh giá</button>
|
||||
<button class="w-[231px] h-10 rounded-[4px] bg-[#0084ff] text-white text-[13px] font-medium">Viết đánh giá</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<aside class="w-[392px] flex flex-col gap-3">
|
||||
<div class="bg-white rounded-[8px] px-3 py-[14px] flex flex-col gap-[11px]">
|
||||
<img src="image/category_qc_lg.png" alt="" class="w-[367px] h-[144px] rounded-[8px] object-cover" />
|
||||
<img src="image/category_qc_samsung.png" alt="" class="w-[367px] h-[144px] rounded-[8px] object-cover" />
|
||||
<div class="flex items-center gap-2">
|
||||
<button class="w-14 h-7 rounded-[4px] border border-[#50aaff] text-[#0084ff] text-[13px] font-medium">150L</button>
|
||||
<button class="w-14 h-7 rounded-[4px] border border-[#e8e8e8] text-black text-[13px] font-medium">350L</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-[8px] p-[4px] bg-gradient-to-b from-[#6b1440] via-[#e4057c] to-[#6b1440]">
|
||||
<div class="bg-white rounded-[6px] p-[11px] flex flex-col gap-3">
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Loại dịch vụ lắp đặt</p>
|
||||
<div class="h-[65px] rounded-[8px] border border-[#e4057c] bg-[#fff6f6] p-[13px] grid grid-cols-2 gap-x-[22px] gap-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="w-3 h-3 rounded-full border border-[#a9a9a9]"></span>
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Gói dịch vụ 1</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="text-[11px] text-[#868686] line-through">23.510.000đ</p>
|
||||
<p class="text-[14px] font-bold text-[#e40000]">17.000.000đ</p>
|
||||
</div>
|
||||
<div class="col-span-2 flex items-center gap-1 ps-5">
|
||||
<span class="text-[#35b327]">◉</span>
|
||||
<p class="text-[12px]">Gói tiêu chuẩn</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-[65px] rounded-[8px] border border-[#e2e2e2] p-[13px] grid grid-cols-2 gap-x-[8px] gap-y-1">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="w-3 h-3 rounded-full border border-[#a9a9a9]"></span>
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Gói dịch vụ 2</p>
|
||||
</div>
|
||||
<p class="text-right text-[14px] font-bold text-[#e40000]">18.000.000đ</p>
|
||||
<p class="col-span-2 text-[12px] text-[#ff7300] tracking-[-0.24px]">♛ Bảo hành 4 năm (2 năm chính hãng, 2 năm MIQ)</p>
|
||||
</div>
|
||||
|
||||
<div class="rounded-[8px] border border-[#e2e2e2] overflow-hidden">
|
||||
<div class="h-[43px] bg-[#f9fafb] px-2 flex items-center">
|
||||
<p class="text-[14px] font-semibold tracking-[-0.28px]">Khuyến mãi</p>
|
||||
</div>
|
||||
<div class="p-[10px] flex flex-col gap-3">
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">1</span>Máy xay sinh tố đa năng AVA trị giá 500.000đ (Áp dụng tùy sản phẩm)</p>
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">2</span>Phiếu mua hàng máy lọc nước trị giá 300.000đ</p>
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">3</span>Miễn phí công lắp đặt</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<p class="text-[13px] font-medium tracking-[-0.26px]">Hình ảnh quà khuyến mãi</p>
|
||||
<div class="flex items-center gap-2">
|
||||
<div class="w-[128px] h-12 rounded-[4px] border border-[#ebebeb] p-[6px] flex items-center gap-1">
|
||||
<img src="image/product_history_2.png" alt="" class="w-9 h-9 rounded-[4px] object-cover" />
|
||||
<p class="text-[10px] font-medium leading-[14px]">Máy xay sinh tố đa năng AVA...</p>
|
||||
</div>
|
||||
<div class="w-[128px] h-12 rounded-[4px] border border-[#ebebeb] p-[6px] flex items-center gap-1">
|
||||
<img src="image/product_history_2.png" alt="" class="w-9 h-9 rounded-[4px] object-cover" />
|
||||
<p class="text-[10px] font-medium leading-[14px]">Máy xay sinh tố đa năng AVA...</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<div class="flex items-center gap-3">
|
||||
<button class="w-[166px] h-12 rounded-[4px] border border-[#0084ff] text-[#0084ff] text-[25px] leading-4 pb-1">⍟<span class="block text-[13px] leading-4">Thêm vào giỏ</span></button>
|
||||
<button class="w-[166px] h-12 rounded-[4px] bg-[#fc7600] text-white text-[20px] font-semibold">Mua ngay</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] p-3 flex flex-col gap-2">
|
||||
<p class="text-[14px] font-semibold leading-6 tracking-[-0.28px]">Sản phẩm đã xem</p>
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<div class="h-[76px] rounded-[4px] border border-[#d9d9d9] p-2 flex items-center gap-2">
|
||||
<img src="image/product_history_1.png" alt="" class="w-[60px] h-[60px] rounded-[4px] object-cover" />
|
||||
<div class="flex-1">
|
||||
<p class="text-[11px] leading-4">Toshiba Inverter 711 lít GR...</p>
|
||||
<p class="text-[13px] leading-6 font-semibold text-[#d90000]">17.000.000đ</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h-[76px] rounded-[4px] border border-[#d9d9d9] p-2 flex items-center gap-2">
|
||||
<img src="image/product_history_1.png" alt="" class="w-[60px] h-[60px] rounded-[4px] object-cover" />
|
||||
<div class="flex-1">
|
||||
<p class="text-[11px] leading-4">Toshiba Inverter 711 lít GR...</p>
|
||||
<p class="text-[13px] leading-6 font-semibold text-[#d90000]">17.000.000đ</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] h-[431px] overflow-hidden flex gap-3 px-3 py-4">
|
||||
<div class="flex flex-col gap-3 w-[885px] shrink-0 h-[399px]">
|
||||
<h2 class="text-[28px] font-bold text-black tracking-tight">TIN KHUYẾN MẠI</h2>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[481px] shrink-0">
|
||||
<div class="w-[481px] h-[300px] rounded-[4px] overflow-hidden">
|
||||
<img src="image/article_main_image.png" alt="" class="w-full h-full object-cover" />
|
||||
</div>
|
||||
<p class="mt-2 text-[20px] font-bold text-black tracking-tight">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex flex-col gap-3 flex-1">
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_1.png" alt="" class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_2.png" alt="" class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_3.png" alt="" class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-3 flex-1 h-[356px]">
|
||||
<h2 class="text-[28px] font-bold text-black tracking-tight">VIDEO REVIEW</h2>
|
||||
<div class="flex flex-col gap-3">
|
||||
<div class="w-full h-[159px] rounded-[4px] overflow-hidden relative">
|
||||
<img src="image/video_main.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[107px] h-[64px] rounded-[4px] overflow-hidden relative shrink-0">
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[107px] h-[64px] rounded-[4px] overflow-hidden relative shrink-0">
|
||||
<img src="image/video_thumb_2.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Duy nhất 17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] h-[231px] overflow-hidden flex flex-col gap-3 px-3 py-4">
|
||||
<h2 class="text-[24px] leading-[28px] font-bold text-black tracking-tight">Mọi người cũng tìm kiếm</h2>
|
||||
<div class="bg-[#f3f4f7] rounded-[12px] h-[156px] overflow-hidden px-3 py-4 flex flex-wrap gap-5 text-[12px] text-black">
|
||||
<span>hút mùi hafele</span>
|
||||
<span>bếp từ cheft</span>
|
||||
<span>nồi cơm điện Tiger</span>
|
||||
<span>máy cạo râu Enchen</span>
|
||||
<span>mũ bảo hiểm</span>
|
||||
<span>nồi cơm điện Cuckoo</span>
|
||||
<span>iPhone 15</span>
|
||||
<span>chảo chống dính Elmich</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>điều hòa Samsung</span>
|
||||
<span>máy lọc nước Korihome Kangen K8</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>tông đơ cắt tóc</span>
|
||||
<span>điều hoà Hisense</span>
|
||||
<span>Máy chạy bộ</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>điều hòa Nagakawa</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="w-full bg-white mt-1" style="min-width:1440px">
|
||||
<div class="flex gap-[95px] px-[120px] py-4 h-[212px] overflow-hidden items-start">
|
||||
<div class="flex flex-col gap-1 w-[267px] shrink-0">
|
||||
<p class="text-[14px] font-bold text-black leading-[27px]">Tổng đài hỗ trợ</p>
|
||||
<div class="text-[13px] text-black leading-[30px]">
|
||||
<p>Gọi mua: <a href="tel:0971490000" class="font-bold text-[#0084ff]">0971.49.0000</a> <span>(8h00-18h00)</span></p>
|
||||
<p>Hỗ trợ kỹ thuật : <a href="tel:0987762444" class="font-bold">0987.762.444</a> <span>(8h00-18h00)</span></p>
|
||||
<p>Góp ý - Khiếu nại: <a href="tel:0824184444" class="font-bold">082.418.4444</a> <span>(8h00-18h00)</span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1 w-[148px] shrink-0">
|
||||
<p class="text-[14px] font-bold text-black leading-[27px]">Về công ty</p>
|
||||
<div class="text-[13px] text-black leading-[30px]">
|
||||
<p>Giới thiệu về công ty</p>
|
||||
<p>Tuyển dụng</p>
|
||||
<p>Gửi góp ý, khiếu nại</p>
|
||||
<p>Tìm siêu thị (215 shop)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1 w-[209px] shrink-0">
|
||||
<p class="text-[14px] font-bold text-black leading-[27px]">Chính sách chung</p>
|
||||
<div class="text-[13px] text-black leading-[30px]">
|
||||
<p>Quy định truy cập Website</p>
|
||||
<p>Chính sách bảo mật thông tin</p>
|
||||
<p>Chính sách vận chuyển, giao nhận</p>
|
||||
<p>Chính sách cho doanh nghiệp</p>
|
||||
<p>Chính sách bảo hành, đổi trả</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-2 w-[291px] shrink-0">
|
||||
<p class="text-[14px] font-bold text-black leading-[27px]">Kết nối với chúng tôi</p>
|
||||
<div class="flex flex-col gap-3">
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="flex items-center gap-1">
|
||||
<div class="w-5 h-5">
|
||||
<img src="image/icon_facebook.svg" alt="Facebook" class="w-full h-full" />
|
||||
<h1 class="text-[20px] font-bold tracking-[-0.4px] text-black leading-none">Tủ lạnh Toshiba Inverter 711 lít
|
||||
Side By Side GR-RS910WI-PMV(06)-MG</h1>
|
||||
<span class="h-5 rounded-[4px] bg-[#fff3f3] text-[#e40000] text-[12px] px-[11px] leading-5">Mẫu mới</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-3 text-[14px] tracking-[-0.28px]">
|
||||
<span class="text-[#959595]">Đã bán 2.3k</span>
|
||||
<span class="text-[#959595] flex items-center gap-1">
|
||||
<img src="image/icon_rating_star.svg" alt="" class="w-[13px] h-[13px]" />
|
||||
4.9
|
||||
</span>
|
||||
<a href="#" class="text-[#0084ff] flex items-center gap-1">
|
||||
<span
|
||||
class="inline-flex items-center justify-center w-5 h-5 rounded-full border border-[#0084ff] text-[11px]">i</span>
|
||||
Thông số
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-start gap-3">
|
||||
<section class="w-[796px] flex flex-col gap-3">
|
||||
<div class="bg-white rounded-[8px] px-3 py-[10px] flex flex-col gap-2">
|
||||
<div class="w-[392px] h-[392px] mx-auto rounded-[8px] overflow-hidden">
|
||||
<img src="image/product_sale_image.png" alt="Tủ lạnh Toshiba" class="w-full h-full object-cover" />
|
||||
</div>
|
||||
<div class="grid grid-cols-[repeat(13,52px)] gap-2">
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden border border-[#57aeff]"><img
|
||||
src="image/product_history_1.png" alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_2.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_4.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_1.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
<button class="w-[52px] h-[52px] rounded-[2px] overflow-hidden"><img src="image/product_history_3.png"
|
||||
alt="" class="w-full h-full object-cover" /></button>
|
||||
</div>
|
||||
<span class="text-[11px] text-[#0084ff]">12.8k lượt thích</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<img src="image/icon_youtube.svg" alt="YouTube" class="w-[28px] h-5 object-contain" />
|
||||
<span class="text-[11px] text-[#0084ff]">2.2T Đăng ký</span>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-2 flex flex-col gap-3">
|
||||
<h2 class="font-inter text-[16px] font-bold tracking-[-0.32px]">MIQ cam kết</h2>
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<div class="grid grid-cols-2 gap-x-[126px] gap-y-3 text-[13px] text-black tracking-[-0.26px]">
|
||||
<p class="flex items-start gap-2"><img src="image/icon_double_next_small.svg" alt=""
|
||||
class="w-7 h-7 mt-[-2px]" />Hư gì đổi nấy 12 tháng tận nhà (miễn phí tháng đầu) <a href="#"
|
||||
class="underline">Xem chi tiết</a></p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_certificate.svg" alt=""
|
||||
class="w-7 h-7 mt-[-2px]" />Bảo hành chính hãng 2 năm, có người đến tận nhà <a href="#"
|
||||
class="underline">Xem chi tiết bảo hành</a></p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_certificate.svg" alt=""
|
||||
class="w-7 h-7 mt-[-2px]" />Bảo hành máy nén 10 năm (sản phẩm mua từ ngày 01/07/2024)</p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_customer_support.svg" alt=""
|
||||
class="w-7 h-7 mt-[-2px]" />Nếu dùng cho hoạt động kinh doanh (nhà máy, khách sạn, giặt ủi...) thì
|
||||
không được bảo hành.</p>
|
||||
<p class="flex items-start gap-2"><img src="image/icon_double_next_small.svg" alt=""
|
||||
class="w-7 h-7 mt-[-2px]" />Lắp đặt miễn phí lúc giao hàng</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<img src="image/icon_zalo.png" alt="Zalo" class="w-5 h-5 object-contain" />
|
||||
<span class="text-[11px] text-[#0084ff]">Zalo MIQ</span>
|
||||
|
||||
<div class="bg-white rounded-[8px] p-3 flex flex-col gap-3">
|
||||
<h3 class="text-[16px] font-bold tracking-[-0.32px]">Tham khảo thêm sản phẩm cũ, trưng bày</h3>
|
||||
<div class="h-[98px] rounded-[8px] border border-[#ebebeb] flex items-center gap-3 px-3 py-[9px]">
|
||||
<img src="image/product_history_1.png" alt="" class="w-20 h-20 rounded-[2px] object-cover" />
|
||||
<div class="w-[472px] flex flex-col gap-1">
|
||||
<p class="text-[14px] font-semibold leading-6 tracking-[-0.28px]">Tủ lạnh Toshiba Inverter 711 lít Side
|
||||
By Side GR-RS910WI-PMV(06)-MG</p>
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="text-[13px]">Giá từ:</p>
|
||||
<p class="text-[15px] font-bold text-[#cd0000]">11.590.000₫</p>
|
||||
<span class="h-5 rounded-[4px] bg-[#ce0000] text-white text-[11px] px-1 leading-5">-50%</span>
|
||||
</div>
|
||||
<p class="text-[13px] leading-6 tracking-[-0.26px]">Bảo hành Chính hãng đến 15/08/2027</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-[15px] flex flex-col gap-2">
|
||||
<h3 class="text-[16px] font-bold tracking-[-0.32px]">Đặc điểm nổi bật</h3>
|
||||
<ul class="list-disc ps-5 text-[13px] leading-[22px] tracking-[-0.26px]">
|
||||
<li>Dung tích sử dụng 711 lít phù hợp nhu cầu sử dụng gia đình có 5 thành viên trở lên.</li>
|
||||
<li>Tiết kiệm điện hiệu quả, tránh lãng phí điện năng nhờ công nghệ Origin Inverter.</li>
|
||||
<li>Luồng khí lạnh đa chiều Multi Air Flow giúp thực phẩm luôn tươi ngon.</li>
|
||||
<li>Công nghệ PureAir Turbo giảm thiểu mùi khó chịu trong tủ lạnh.</li>
|
||||
<li>Kết nối, điều khiển từ xa tiện lợi thông qua ứng dụng TSmartLife.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] px-3 py-[22px] flex flex-col gap-4">
|
||||
<div class="flex items-center justify-center gap-3">
|
||||
<button
|
||||
class="w-[205px] h-10 rounded-[4px] border border-[#0084ff] bg-[#edf7ff] text-[16px] text-[#0084ff] font-bold tracking-[-0.32px]">Thông
|
||||
số kỹ thuật</button>
|
||||
<button
|
||||
class="w-[205px] h-10 rounded-[4px] border border-[#e6e6e6] bg-white text-[16px] text-black font-bold tracking-[-0.32px]">Thông
|
||||
tin sản phẩm</button>
|
||||
</div>
|
||||
<div class="h-10 rounded-[4px] bg-[#f2f4f7] flex items-center justify-between px-2">
|
||||
<p class="font-inter font-semibold text-[13px] tracking-[-0.26px]">Tổng quan</p>
|
||||
<img src="image/icon_arrow_next.svg" alt="" class="w-5 h-5 rotate-90" />
|
||||
</div>
|
||||
<div class="grid grid-cols-[196px_1fr] gap-x-[88px] gap-y-[24px] px-3 text-[13px] tracking-[-0.26px]">
|
||||
<p>Kiểu tủ</p>
|
||||
<p>Tủ lớn - Side by Side - 2 cánh</p>
|
||||
<p>Dung tích tổng:</p>
|
||||
<p>768 lít</p>
|
||||
<p>Dung tích sử dụng:</p>
|
||||
<p>711 lít - Trên 5 người</p>
|
||||
<p>Dung tích ngăn đá:</p>
|
||||
<p>273 lít</p>
|
||||
<p>Dung tích ngăn lạnh:</p>
|
||||
<p>438 lít</p>
|
||||
<p>Chất liệu khay ngăn lạnh:</p>
|
||||
<p>Kính chịu lực</p>
|
||||
<p>Chất liệu ống dẫn gas, dàn lạnh:</p>
|
||||
<p>Ống dẫn gas bằng Sắt và Đồng - Lá tản nhiệt bằng Nhôm</p>
|
||||
<p>Năm ra mắt:</p>
|
||||
<p>2025</p>
|
||||
<p>Năm ra mắt: 2025 Sản xuất tại:</p>
|
||||
<p>Trung Quốc</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] px-3 py-4 flex flex-col gap-5">
|
||||
<h3 class="text-[18px] font-semibold tracking-[-0.36px]">Đánh giá Tủ lạnh Toshiba Inverter 711 lít Side By
|
||||
Side GR-RS910WI-PMV(06)-MG</h3>
|
||||
<div class="flex items-center justify-center gap-5">
|
||||
<div class="w-[112px] flex flex-col items-center gap-1">
|
||||
<p class="text-[32px] font-extrabold font-inter tracking-[-0.64px]">4.9<span
|
||||
class="text-[13px] text-[#9d9d9d] font-normal">/5</span></p>
|
||||
<p class="text-[13px] font-inter">1,7k khách hài lòng</p>
|
||||
<p class="text-[13px] text-[#9d9d9d] font-inter">5 đánh giá</p>
|
||||
</div>
|
||||
<div class="w-[315px] flex flex-col gap-2 text-[13px]">
|
||||
<div class="star-row"><span>5</span><span>★</span>
|
||||
<div class="star-bar"><span style="width:98.2%"></span></div><span>98.2%</span>
|
||||
</div>
|
||||
<div class="star-row"><span>4</span><span>★</span>
|
||||
<div class="star-bar"></div><span>0</span>
|
||||
</div>
|
||||
<div class="star-row"><span>3</span><span>★</span>
|
||||
<div class="star-bar"></div><span>0</span>
|
||||
</div>
|
||||
<div class="star-row"><span>2</span><span>★</span>
|
||||
<div class="star-bar"></div><span>0</span>
|
||||
</div>
|
||||
<div class="star-row"><span>1</span><span>★</span>
|
||||
<div class="star-bar"></div><span>0</span>
|
||||
</div>
|
||||
</div>
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-20 h-20 rounded-[4px] object-cover" />
|
||||
</div>
|
||||
|
||||
<div class="w-[754px] grid gap-2 text-[13px] tracking-[-0.26px]">
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="font-bold">Nguyễn Lê Tuấn</p>
|
||||
<span class="text-[#35b327]">●</span>
|
||||
<p class="text-[#35b327] font-medium">Đã mua tại MIQ</p>
|
||||
</div>
|
||||
<p>★★★★★ <span class="mx-2 text-[#9d9d9d]">|</span> ❤ Sẽ giới thiệu cho bạn bè, người thân</p>
|
||||
<p>Tủ lạnh có ngăn chứa rất rộng rãi để được nhiều thực phẩm, có app theo dõi rất tiện lợi, mua được ngay
|
||||
dịp sale giá rẻ, có dịp mình sẽ ủng hộ nữa</p>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#e8e8e8] w-[772px]"></div>
|
||||
|
||||
<div class="w-[754px] grid gap-2 text-[13px] tracking-[-0.26px]">
|
||||
<div class="flex items-center gap-1">
|
||||
<p class="font-bold">Nguyễn Lê Tuấn</p>
|
||||
<span class="text-[#35b327]">●</span>
|
||||
<p class="text-[#35b327] font-medium">Đã mua tại MIQ</p>
|
||||
</div>
|
||||
<p>★★★★★ <span class="mx-2 text-[#9d9d9d]">|</span> ❤ Sẽ giới thiệu cho bạn bè, người thân</p>
|
||||
<p>Tủ lạnh có ngăn chứa rất rộng rãi để được nhiều thực phẩm, có app theo dõi rất tiện lợi, mua được ngay
|
||||
dịp sale giá rẻ, có dịp mình sẽ ủng hộ nữa</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<button
|
||||
class="w-[231px] h-10 rounded-[4px] border border-[#8c8c8c] text-[#6b6b6b] text-[13px] font-medium">Xem
|
||||
5 đánh giá</button>
|
||||
<button class="w-[231px] h-10 rounded-[4px] bg-[#0084ff] text-white text-[13px] font-medium">Viết đánh
|
||||
giá</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<aside class="w-[392px] flex flex-col gap-3">
|
||||
<div class="bg-white rounded-[8px] px-3 py-[14px] flex flex-col gap-[11px]">
|
||||
<img src="image/category_qc_lg.png" alt="" class="w-[367px] h-[144px] rounded-[8px] object-cover" />
|
||||
<img src="image/category_qc_samsung.png" alt="" class="w-[367px] h-[144px] rounded-[8px] object-cover" />
|
||||
<div class="flex items-center gap-2">
|
||||
<button
|
||||
class="w-14 h-7 rounded-[4px] border border-[#50aaff] text-[#0084ff] text-[13px] font-medium">150L</button>
|
||||
<button
|
||||
class="w-14 h-7 rounded-[4px] border border-[#e8e8e8] text-black text-[13px] font-medium">350L</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-[8px] p-[4px] bg-gradient-to-b from-[#6b1440] via-[#e4057c] to-[#6b1440]">
|
||||
<div class="bg-white rounded-[6px] p-[11px] flex flex-col gap-3">
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Loại dịch vụ lắp đặt</p>
|
||||
<div
|
||||
class="h-[65px] rounded-[8px] border border-[#e4057c] bg-[#fff6f6] p-[13px] grid grid-cols-2 gap-x-[22px] gap-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="w-3 h-3 rounded-full border border-[#a9a9a9]"></span>
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Gói dịch vụ 1</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="text-[11px] text-[#868686] line-through">23.510.000đ</p>
|
||||
<p class="text-[14px] font-bold text-[#e40000]">17.000.000đ</p>
|
||||
</div>
|
||||
<div class="col-span-2 flex items-center gap-1 ps-5">
|
||||
<span class="text-[#35b327]">◉</span>
|
||||
<p class="text-[12px]">Gói tiêu chuẩn</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-[65px] rounded-[8px] border border-[#e2e2e2] p-[13px] grid grid-cols-2 gap-x-[8px] gap-y-1">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="w-3 h-3 rounded-full border border-[#a9a9a9]"></span>
|
||||
<p class="text-[13px] font-semibold tracking-[-0.26px]">Gói dịch vụ 2</p>
|
||||
</div>
|
||||
<p class="text-right text-[14px] font-bold text-[#e40000]">18.000.000đ</p>
|
||||
<p class="col-span-2 text-[12px] text-[#ff7300] tracking-[-0.24px]">♛ Bảo hành 4 năm (2 năm chính hãng,
|
||||
2 năm MIQ)</p>
|
||||
</div>
|
||||
|
||||
<div class="rounded-[8px] border border-[#e2e2e2] overflow-hidden">
|
||||
<div class="h-[43px] bg-[#f9fafb] px-2 flex items-center">
|
||||
<p class="text-[14px] font-semibold tracking-[-0.28px]">Khuyến mãi</p>
|
||||
</div>
|
||||
<div class="p-[10px] flex flex-col gap-3">
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span
|
||||
class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">1</span>Máy
|
||||
xay sinh tố đa năng AVA trị giá 500.000đ (Áp dụng tùy sản phẩm)</p>
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span
|
||||
class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">2</span>Phiếu
|
||||
mua hàng máy lọc nước trị giá 300.000đ</p>
|
||||
<p class="text-[13px] tracking-[-0.26px]"><span
|
||||
class="inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#a0045c] text-white text-[13px] me-2">3</span>Miễn
|
||||
phí công lắp đặt</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<p class="text-[13px] font-medium tracking-[-0.26px]">Hình ảnh quà khuyến mãi</p>
|
||||
<div class="flex items-center gap-2">
|
||||
<div class="w-[128px] h-12 rounded-[4px] border border-[#ebebeb] p-[6px] flex items-center gap-1">
|
||||
<img src="image/product_history_2.png" alt="" class="w-9 h-9 rounded-[4px] object-cover" />
|
||||
<p class="text-[10px] font-medium leading-[14px]">Máy xay sinh tố đa năng AVA...</p>
|
||||
</div>
|
||||
<div class="w-[128px] h-12 rounded-[4px] border border-[#ebebeb] p-[6px] flex items-center gap-1">
|
||||
<img src="image/product_history_2.png" alt="" class="w-9 h-9 rounded-[4px] object-cover" />
|
||||
<p class="text-[10px] font-medium leading-[14px]">Máy xay sinh tố đa năng AVA...</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-[#ececec]"></div>
|
||||
<div class="flex items-center gap-3">
|
||||
<button
|
||||
class="w-[166px] h-12 rounded-[4px] border border-[#0084ff] text-[#0084ff] text-[25px] leading-4 pb-1">⍟<span
|
||||
class="block text-[13px] leading-4">Thêm vào giỏ</span></button>
|
||||
<button class="w-[166px] h-12 rounded-[4px] bg-[#fc7600] text-white text-[20px] font-semibold">Mua
|
||||
ngay</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[8px] p-3 flex flex-col gap-2">
|
||||
<p class="text-[14px] font-semibold leading-6 tracking-[-0.28px]">Sản phẩm đã xem</p>
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<div class="h-[76px] rounded-[4px] border border-[#d9d9d9] p-2 flex items-center gap-2">
|
||||
<img src="image/product_history_1.png" alt="" class="w-[60px] h-[60px] rounded-[4px] object-cover" />
|
||||
<div class="flex-1">
|
||||
<p class="text-[11px] leading-4">Toshiba Inverter 711 lít GR...</p>
|
||||
<p class="text-[13px] leading-6 font-semibold text-[#d90000]">17.000.000đ</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h-[76px] rounded-[4px] border border-[#d9d9d9] p-2 flex items-center gap-2">
|
||||
<img src="image/product_history_1.png" alt="" class="w-[60px] h-[60px] rounded-[4px] object-cover" />
|
||||
<div class="flex-1">
|
||||
<p class="text-[11px] leading-4">Toshiba Inverter 711 lít GR...</p>
|
||||
<p class="text-[13px] leading-6 font-semibold text-[#d90000]">17.000.000đ</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] h-[431px] overflow-hidden flex gap-3 px-3 py-4">
|
||||
<div class="flex flex-col gap-3 w-[885px] shrink-0 h-[399px]">
|
||||
<h2 class="text-[28px] font-bold text-black tracking-tight">TIN KHUYẾN MẠI</h2>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[481px] shrink-0">
|
||||
<div class="w-[481px] h-[300px] rounded-[4px] overflow-hidden">
|
||||
<img src="image/article_main_image.png" alt="" class="w-full h-full object-cover" />
|
||||
</div>
|
||||
<p class="mt-2 text-[20px] font-bold text-black tracking-tight">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất 17h
|
||||
ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex flex-col gap-3 flex-1">
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_1.png" alt=""
|
||||
class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất
|
||||
17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_2.png" alt=""
|
||||
class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất
|
||||
17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<img src="image/article_thumb_3.png" alt=""
|
||||
class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0" />
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Ngày hội ĐIỆN MÁY - SIÊU RẺ. Duy nhất
|
||||
17h ngày 10/02 Cơ hội trúng Máy nước</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<img src="image/logo_bct.png" alt="Đã thông báo Bộ Công Thương" class="w-[100px] h-[38px] object-contain" />
|
||||
<div class="flex flex-col gap-3 flex-1 h-[356px]">
|
||||
<h2 class="text-[28px] font-bold text-black tracking-tight">VIDEO REVIEW</h2>
|
||||
<div class="flex flex-col gap-3">
|
||||
<div class="w-full h-[159px] rounded-[4px] overflow-hidden relative">
|
||||
<img src="image/video_main.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[107px] h-[64px] rounded-[4px] overflow-hidden relative shrink-0">
|
||||
<img src="image/video_thumb_1.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Duy nhất 17h ngày 10/02 Cơ hội trúng Máy
|
||||
nước</p>
|
||||
</div>
|
||||
<div class="flex gap-3 items-start">
|
||||
<div class="w-[107px] h-[64px] rounded-[4px] overflow-hidden relative shrink-0">
|
||||
<img src="image/video_thumb_2.png" alt="" class="w-full h-full object-cover" />
|
||||
<div class="absolute inset-0 bg-black/20 rounded-[4px]"></div>
|
||||
</div>
|
||||
<p class="text-[14px] text-black tracking-tight overflow-hidden">Duy nhất 17h ngày 10/02 Cơ hội trúng Máy
|
||||
nước</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-[12px] h-[231px] overflow-hidden flex flex-col gap-3 px-3 py-4">
|
||||
<h2 class="text-[24px] leading-[28px] font-bold text-black tracking-tight">Mọi người cũng tìm kiếm</h2>
|
||||
<div
|
||||
class="bg-[#f3f4f7] rounded-[12px] h-[156px] overflow-hidden px-3 py-4 flex flex-wrap gap-5 text-[12px] text-black">
|
||||
<span>hút mùi hafele</span>
|
||||
<span>bếp từ cheft</span>
|
||||
<span>nồi cơm điện Tiger</span>
|
||||
<span>máy cạo râu Enchen</span>
|
||||
<span>mũ bảo hiểm</span>
|
||||
<span>nồi cơm điện Cuckoo</span>
|
||||
<span>iPhone 15</span>
|
||||
<span>chảo chống dính Elmich</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>điều hòa Samsung</span>
|
||||
<span>máy lọc nước Korihome Kangen K8</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>tông đơ cắt tóc</span>
|
||||
<span>điều hoà Hisense</span>
|
||||
<span>Máy chạy bộ</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>máy massage X5 Pro Omni</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>MacBook Air M4</span>
|
||||
<span>điều hòa Nagakawa</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-[#e4e4e4] h-9 flex items-center justify-center">
|
||||
<p class="text-[#353535] text-[13px]">Bản quyền thuộc về MIQ Việt Nam</p>
|
||||
</div>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user