This commit is contained in:
2025-05-27 14:28:47 +07:00
parent 170122ad32
commit 4fb79660b2
144 changed files with 5973 additions and 0 deletions

View File

@@ -0,0 +1,44 @@
<footer class="mt-20 border-t-[11px] border-[#1c039b] w-full">
<div class="container">
<a href="/" class="block my-[30px]">
<img src="../../assets/images/logo-footer.png" class="block w-[180px] h-[45px] object-contain"
width="100%" height="100%" alt="logo">
</a>
<div class="main-footer grid grid-cols-4">
<div class="item">
<h3 class="title">Về chúng tôi</h3>
<a href="" class="block">Độc quyền</a>
<a href="" class="block">Mua online</a>
<a href="" class="block">Bộ sưu tập</a>
<a href="/tin-tuc" class="block">Blog</a>
<div class="list-social flex items-center mt-[45px]">
<a href="" target="_blank" class="mr-[10px]"><i class="icon_2025 facebook"></i></a>
<a href="" target="_blank"><i class="icon_2025 zalo"></i></a>
</div>
</div>
<div class="item">
<h3 class="title">Tuyển dụng</h3>
<a href="">Liên hệ</a>
<a href="">Điều khoản</a>
<a href="">Chính sách bảo mật</a>
<a href="">Trở thành đối tác</a>
</div>
<div class="item">
<h3 class="title">Liên kết</h3>
<a href="hurasoft.com">Hurasoft.com</a>
</div>
<div class="item">
<h3 class="title">Giới thiệu</h3>
<b class="text-[16px]">BESTPC là kênh tổng hợp tin khuyến mãi chuyên nghiệp đầu tiên ở Việt Nam,
cho phép bạn tìm
kiếm mã giảm giá, tin ưu đãi
từ nghành hàng laptop, thiết bị điện tử, máy tính, xây dựng cấu hình PC chuyên nghiệp. Và
còn rất nhiều mã giảm giá độc
quyền dành riêng cho bạn.</b>
</div>
</div>
</div>
<div class="footer-bottom bg-[#ebebeb] py-[15px]">
<b class="text-center block">© Copyright 2025 by Hurasoft. All Rights Reserved.</b>
</div>
</footer>

458
template/shared/header.html Normal file
View File

@@ -0,0 +1,458 @@
<!-- Header Section -->
<header class="w-full">
<div class="header-main py-6 bg-[var(--color-global)]">
<div class="container">
<div class="flex items-center justify-between">
<a href="/" class="logo block mr-[100px]">
<img src="../../assets/images/logo.png" class="object-contain w-[173px] h-[45px] block"
alt="Location icon" />
</a>
<div class="flex items-center mr-[100px]">
<i class="icon_2025 map"></i>
<div class="ml-[20px] ">
<span class="text-xs text-white block mb-[5px]">Bạn đang ở</span>
<div class="box-select">
<select name="" id="" class="select select_location">
<option value="">Hà Nội</option>
<option value="">TP HCM</option>
<option value="">Đà Nẵng</option>
</select>
</div>
</div>
</div>
<div class="w-[670px] relative mr-[135px] input-search">
<form action="/search" enctype="text/plain" method="get"
class="relative w-full h-[45px] bg-white rounded-[8px] overflow-hidden">
<input type="text" name="q" placeholder="Tìm kiếm khuyến mãi, cửa hàng, sản phẩm,..."
class="search-input w-full h-full p-[0_10px] rounded-[8px] text-base"
onclick="$('.autocomplete-suggestions').show();">
<button type="submit"
class="absolute right-[10px] top-[5px] w-[40px] h-[35px] border-l-[1.5px] border-[#B3B3B3] pl-[10px]"><i
class="icon_2025 search "></i></button>
</form>
<div class="autocomplete-suggestions hidden">
<p>TỪ KHOÁ HOT</p>
<ul class="ul">
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
<li><a href=""> laptop </a></li>
</ul>
</div>
</div>
<div class="box-user">
<div class="flex items-center">
<i class="icon_2025 user"></i>
<b class="text-white p-[0_5px] whitespace-nowrap">Tài khoản</b>
<i class="icon_arrow"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Navigation Section -->
<nav class="header-bottom py-2.5 w-full bg-white shadow-[0px_4px_4px_rgba(149,149,149,0.25)]">
<div class="container">
<div class="flex items-center justify-between w-full">
<div class="header-menu relative group">
<div
class="title-menu flex items-center justify-center w-[219px] h-[45px] rounded-[4px] border-[1px] border-[#e3e3e3] bg-[#F6F6F6] cursor-pointer">
<i class="icon_2025 bar"></i>
<b class="ml-[8px] uppercase">Danh mục sản phẩm</b>
</div>
<div
class="box-menu-hover group-hover:block absolute hidden shadow-[0_0_8px_2px_rgba(0,0,0,0.1)] rounded-[5px] bg-white top-[47px] z-[99] w-[220px]">
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/laptop.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Laptop 2 </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện 2 </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop 2 </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện 2 </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop 2 </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<!-- copy -->
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/008-mouse.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/010-computer.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/013-fan.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/gamepad-1.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/server-4.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
<li><a href="/danh-muc-cap2.html"> Laptop </a></li>
<li><a href="/danh-muc-cap2.html"> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/laptop.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/008-mouse.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/010-computer.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/013-fan.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/gamepad-1.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="/danh-muc-cap1.html" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/server-4.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<div class="item">
<a href="" class="flex items-center">
<span class="cate-img"> <img src="/dev/images/server-4.png" alt=""> </span>
<span class="cate-name"> Laptop &amp; phụ kiện</span>
</a>
<div class="sub-menu">
<ul class="ul sub-cate">
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Phụ kiện </a></li>
<li><a href=""> Laptop </a></li>
<li><a href=""> Phụ kiện </a></li>
</ul>
<ul class="ul sub-cate">
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
<li><a href=""> Laptop 2 </a></li>
<li><a href=""> Phụ kiện 2 </a></li>
</ul>
</div>
</div>
<!-- end copy -->
</div>
</div>
<div class="flex gap-[40px] header-bottom-right">
<a href="/buildpc" class="flex items-center group">
<i class="icon_2025 buildpc group-hover:buildpc-hover"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)]">Build
PC</span>
</a>
<a href="/tim-nguoi-ban" class="flex items-center group">
<i class="icon_2025 shop"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)]">Tìm
người bán</span>
</a>
<a href="/" class="flex items-center group">
<i class="icon_2025 map-2"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)]">Địa
chỉ
sửa chữa</span>
</a>
<a href="/" class="flex items-center group">
<i class="icon_2025 question"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)">Hỏi
đáp</span>
</a>
<a href="/" class="flex items-center group">
<i class="icon_2025 prduct-save"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)]">Sản
phẩm
đã lưu</span>
</a>
<a href="/" class="flex items-center group">
<i class="icon_2025 article"></i>
<span class="ml-[7px] group-hover:text-[var(--color-global)]">Tin
rạo
vặt</span>
</a>
</div>
</div>
</div>
</nav>
</header>