tieptk/xstore
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update 07/10

Browse Source
This commit is contained in:
Tieptk
2025-10-07 08:23:59 +07:00
parent da666480d2
commit b85755ccda
10 changed files with 1128 additions and 259 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
template/other/footer.html
View File

@@ -1,10 +1,76 @@
<div class="footer bg-[#00112B] text-white">
<div class="container">
<div class="main-footer pt-[50px] pb-[35px]">
<div class="grid grid-cols-4 gap-[90px]">
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Về chúng tôi</h3>
<div class="content">
<div class="footer-pc">
<div class="container">
<div class="main-footer pt-[50px] pb-[35px]">
<div class="grid grid-cols-4 gap-[90px]">
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Về chúng tôi</h3>
<div class="content">
<a href="https://maps.app.goo.gl/fimdgxskWrcDrKbQ7" target="_blank"
class="text-[14px] block mb-[10px] hover:underline">Địa chỉ: Tầng 5 - Số 3,
ngõ 18 Yên Lãng, Đống Đa, Hà
Nội</a>
<a href="tel:02422.138.068" class="text-[14px] block mb-[10px] hover:underline">Hotline:
02422.138.068</a>
<a href="mailto:hotro@hurasoft.com"
class="text-[14px] block mb-[10px] hover:underline">Email:
hotro@hurasoft.com</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Dịch vụ</h3>
<div class="content">
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Giá cả</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Dùng thử miễn phí</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Yêu cầu bản demo</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Ứng dụng & Tích hợp</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Chủ đề & Mẫu</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Dịch vụ xStore</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Trở thành đối tác</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Hỗ trợ</h3>
<div class="content">
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Liên hệ Hỗ trợ Kỹ thuật</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Trung tâm nhà phát triển</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Cộng đồng nhà phát triển</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Tài liệu API</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Tài liệu chủ đề</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Hợp tác</h3>
<div class="content">
<a href="/gioi-thieu" class="text-[14px] block mb-[10px] hover:underline">Giới thiệu về
chúng tôi
</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Gửi yêu cầu hỗ trợ</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Tìm đối tác</a>
</div>
</div>
</div>
</div>
<div class="footer-bottom flex items-center justify-between pb-[30px] ">
<img src="../../assets/images/logo-footer.png" class="block h-[62px] object-contain " alt="logo">
<div class="text-right text-[12px]">
<p>© Copyright 2025 xStore</p>
<p>Chính sách bảo mật | Điều khoản sử dụng trang web | Thỏa thuận dịch vụ</p>
</div>
</div>
</div>
</div>
<div class="footer-mobile">
<div class="container">
<div class="main-footer py-[20px]">
<div class="item-footer border-b-[1px] border-[#fff]">
<div class="flex items-center justify-between py-[13px]" onclick="toggleFooter(this)">
<h3 class="title text-[15px] font-bold">Về chúng tôi</h3>
<i class="fa-solid fa-sort-down" aria-hidden="true"></i>
</div>
<div class="content-footer hidden">
<a href="https://maps.app.goo.gl/fimdgxskWrcDrKbQ7" target="_blank"
class="text-[14px] block mb-[10px] hover:underline">Địa chỉ: Tầng 5 - Số 3,
ngõ 18 Yên Lãng, Đống Đa, Hà
@@ -15,9 +81,13 @@
hotro@hurasoft.com</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Dịch vụ</h3>
<div class="content">
<div class="item-footer border-b-[1px] border-[#fff]">
<div class="flex items-center justify-between py-[13px]" onclick="toggleFooter(this)">
<h3 class="title text-[15px] font-bold ">Dịch vụ</h3>
<i class="fa-solid fa-sort-down" aria-hidden="true"></i>
</div>
<div class="content-footer hidden">
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Giá cả</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Dùng thử miễn phí</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Yêu cầu bản demo</a>
@@ -27,9 +97,12 @@
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Trở thành đối tác</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Hỗ trợ</h3>
<div class="content">
<div class="item-footer border-b-[1px] border-[#fff]">
<div class="flex items-center justify-between py-[13px]" onclick="toggleFooter(this)">
<h3 class="title text-[15px] font-bold">Hỗ trợ</h3>
<i class="fa-solid fa-sort-down" aria-hidden="true"></i>
</div>
<div class="content-footer hidden">
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Liên hệ Hỗ trợ Kỹ thuật</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Trung tâm nhà phát triển</a>
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Cộng đồng nhà phát triển</a>
@@ -37,9 +110,12 @@
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Tài liệu chủ đề</a>
</div>
</div>
<div class="item-footer">
<h3 class="title text-[19px] font-bold mb-[20px] ">Hợp tác</h3>
<div class="content">
<div class="item-footer border-b-[1px] border-[#fff]">
<div class="flex items-center justify-between py-[13px]" onclick="toggleFooter(this)">
<h3 class="title text-[15px] font-bold">Hợp tác</h3>
<i class="fa-solid fa-sort-down" aria-hidden="true"></i>
</div>
<div class="content-footer hidden">
<a href="/gioi-thieu" class="text-[14px] block mb-[10px] hover:underline">Giới thiệu về
chúng tôi
</a>
@@ -47,14 +123,14 @@
<a href="#" class="text-[14px] block mb-[10px] hover:underline">Tìm đối tác</a>
</div>
</div>
</div>
</div>
<div class="footer-bottom flex items-center justify-between pb-[30px] ">
<img src="../../assets/images/logo-footer.png" class="block h-[62px] object-contain " alt="logo">
<div class="text-right text-[12px]">
<p>© Copyright 2025 xStore</p>
<p>Chính sách bảo mật | Điều khoản sử dụng trang web | Thỏa thuận dịch vụ</p>
<div class="footer-bottom py-[20px] ">
<img src="../../assets/images/logo-footer.png" class="block h-[50px] object-contain " alt="logo">
<div class="mt-[20px] text-[14px]">
<p>© Copyright 2025 xStore</p>
<p>Chính sách bảo mật | Điều khoản sử dụng trang web | Thỏa thuận dịch vụ</p>
</div>
</div>
</div>
</div>
</div>

579
template/other/header.html
View File

@@ -1,155 +1,384 @@
<header class="sticky top-0 left-0 w-full bg-white z-[999] shadow-[0_0_2px_0px_#e7e7e7]">
<div class="relative bg-white z-[99]">
<div class="container">
<div class="header flex items-center py-[15px] justify-between">
<div class="header-left flex items-center">
<a href="/" class="logo h-[26px] block mr-[130px]">
<img src="../../assets/images/logo.png" class="block w-full h-full object-contain" width="100%"
height="100%" alt="logo" />
</a>
<div class="menu flex items-center gap-[45px]" id="js-show-menu">
<div class="item-menu">
<a href="javascript:void(0)" data-menu="tinhnang" class="flex items-center gap-[5px] group">
<span class="font-[600] text-[16px] group-hover:underline">Tính năng</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
</div>
<div class="item-menu">
<a href="javascript:void(0)" data-menu="hotro" class="flex items-center gap-[5px] group">
<span class="font-[600] text-[16px] group-hover:underline">Hỗ trợ</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
</div>
<a href="/pricing" class="hover:underline font-[600]">
Bảng giá
<div class="header-pc">
<div class="relative bg-white z-[99]">
<div class="container">
<div class="header flex items-center py-[15px] justify-between">
<div class="header-left flex items-center">
<a href="/" class="logo h-[26px] block mr-[130px]">
<img src="../../assets/images/logo.png" class="block w-full h-full object-contain"
width="100%" height="100%" alt="logo" />
</a>
<div class="menu flex items-center gap-[45px]" id="js-show-menu">
<div class="item-menu">
<a href="javascript:void(0)" data-menu="tinhnang" class="flex items-center gap-[5px]">
<span class="font-[600] text-[16px]">Tính năng</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
</div>
<div class="item-menu">
<a href="javascript:void(0)" data-menu="hotro" class="flex items-center gap-[5px]">
<span class="font-[600] text-[16px]">Hỗ trợ</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
</div>
<a href="/pricing" class="font-[600] h-[24px] leading-[24px]">
Bảng giá
</a>
</div>
</div>
<div class="header-right flex items-center justify-end gap-[10px]">
<a href="/dang-nhap"
class="inline-block px-[30px] py-[5px] border-[1px] border-[var(--color-blue)] text-[var(--color-blue)] text-[15px] font-[600] rounded-[50px] hover:bg-[var(--color-blue)] hover:text-white">Đăng
nhập</a>
<a href="/dang-ky"
class="inline-block px-[30px] py-[5px] border-[1px] hover:border-[var(--color-blue)] hover:text-[var(--color-blue)] hover:bg-white text-[15px] font-[600] rounded-[50px] bg-[var(--color-blue)] text-white">Đăng
ký</a>
</div>
</div>
<div class="header-right flex items-center justify-end gap-[10px]">
<a href="/dang-nhap"
class="inline-block px-[30px] py-[5px] border-[1px] border-[var(--color-blue)] text-[var(--color-blue)] text-[15px] font-[600] rounded-[50px] hover:bg-[var(--color-blue)] hover:text-white">Đăng
nhập</a>
<a href="/dang-ky"
class="inline-block px-[30px] py-[5px] border-[1px] hover:border-[var(--color-blue)] hover:text-[var(--color-blue)] hover:bg-white text-[15px] font-[600] rounded-[50px] bg-[var(--color-blue)] text-white">Đăng
ký</a>
</div>
</div>
<div class="left-0 z-[9] w-full h-fit max-h-[80vh] absolute translate-y-[-100%] overflow-auto bg-white top-[64px] border-t-[1px] border-[#d3d3d3] transition-transform duration-[250ms] "
id="box-menu">
<div class="container">
<div class="hidden content-menu" id="tinhnang">
<div class="grid grid-cols-4 gap-[30px]">
<div class="col-span-2 pb-[20px]">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
Học hỏi và phát triển</div>
<div class="grid grid-cols-2 gap-[25px]">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)] ">Trung
tâm trợ
giúp</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Hỗ
trợ đẳng cấp thế giới, 24/7</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Đại học
BigCommerce
</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Đào tạo thương mại
điện tử từ các chuyên gia của chúng tôi</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Dịch vụ
đối
tác</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Nhận trợ giúp xây
dựng cửa hàng của bạn</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa hàng
chủ
đề</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Mẫu thiết kế
đẹp</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa hàng
ứng
dụng</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Kết nối với phần
mềm hàng đầu</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Blog
thương mại
điện tử</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tin tức, chiến lược
và phân tích</a>
</div>
</div>
</div>
<div class="item">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
chi tiết về thương mại điện tử</div>
<div class="list">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Tài liệu
&
Video</a>
</div>
</div>
</div>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item">
<a href=""
class="image-article block w-full h-[165px] rounded-[8px_8px_0_0] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%"
alt="article">
</a>
<div class="info bg-[#000] p-[10px] rounded-[0_0_8px_8px]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p
class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="hidden content-menu" id="hotro">
<div class="grid grid-cols-4 gap-[30px]">
<div class="col-span-3 py-[20px]">
<div class="grid grid-cols-3 gap-[25px] pb-[20px]">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)] ">Tạo
mới</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Thiết kế một cửa
hàng trực tuyến đẹp mắt.</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Thị
trường
</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tiếp cận nhiều
người mua sắm hơn trên nhiều kênh.</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Vận
hành</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tăng hiệu quả với
nền tảng đáng tin cậy.</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Chuyển
đổi</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tạo quy trình thanh
toán nhanh chóng, đơn giản và có khả năng chuyển đổi.</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Phát
triển</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Mở rộng thị
trường mới và nhiều hơn nữa.</a>
</div>
</div>
</div>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item">
<a href=""
class="image-article block w-full h-[165px] rounded-[8px_8px_0_0] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%"
alt="article">
</a>
<div class="info bg-[#000] p-[10px] rounded-[0_0_8px_8px]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p
class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="left-0 z-[9] w-full h-fit max-h-[80vh] absolute translate-y-[-100%] overflow-auto bg-white top-[64px] bg-white border-t-[1px] border-[#d3d3d3] transition-transform duration-[250ms] "
id="box-menu">
<div class="container">
<div class="hidden content-menu" id="tinhnang">
<div class="grid grid-cols-4 gap-[30px]">
<div class="col-span-2 pb-[20px]">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
Học hỏi và phát triển</div>
<div class="grid grid-cols-2 gap-[25px]">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)] ">Trung
tâm trợ
giúp</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Hỗ
trợ đẳng cấp thế giới, 24/7</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Đại học
BigCommerce
</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Đào tạo thương mại
điện tử từ các chuyên gia của chúng tôi</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Dịch vụ
đối
tác</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Nhận trợ giúp xây
dựng cửa hàng của bạn</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa hàng
chủ
đề</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Mẫu thiết kế
đẹp</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa hàng
ứng
dụng</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Kết nối với phần
mềm hàng đầu</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Blog
thương mại
điện tử</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tin tức, chiến lược
và phân tích</a>
</div>
</div>
<div class="header-mobile">
<div class="relative bg-white z-[99] py-[15px]">
<div class="container">
<div class="header-main flex items-center justify-between">
<a href="/" class="logo h-[26px] block">
<img src="../../assets/images/logo.png" class="block w-full h-full object-contain" width="100%"
height="100%" alt="logo" />
</a>
<div class="header-right flex gap-[10px] items-center justify-end">
<a href=""
class="btn mx-auto inline-block px-[15px] h-[30px] leading-[30px] text-center rounded-[4px] bg-[var(--color-blue)] text-white text-[13px] font-bold hover:bg-white hover:border-[1px] hover:border-[var(--color-blue)] hover:text-[var(--color-blue)] ">Bắt
đầu dùng
thử miễn phí</a>
<a href="javascript:void(0)" onclick="showMenuMb()"
class="show-menu w-[30px] block leading-[100%] text-center">
<i class="fa fa-bars text-[18px]"></i>
</a>
</div>
<div class="item">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
chi tiết về thương mại điện tử</div>
<div class="list">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Tài liệu
&
Video</a>
</div>
</div>
</div>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item">
<a href=""
class="image-article block w-full h-[165px] rounded-[8px_8px_0_0] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%" alt="article">
</a>
<div class="info bg-[#000] p-[10px] rounded-[0_0_8px_8px]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="hidden content-menu" id="hotro">
<div class="grid grid-cols-4 gap-[30px]">
<div class="col-span-3 py-[20px]">
<div class="grid grid-cols-3 gap-[25px] pb-[20px]">
</div>
<div class="left-0 z-[9] w-full h-screen overflow-auto hidden absolute bg-white top-[60px] border-t-[1px] border-[#d3d3d3] transition-transform duration-[250ms]"
id="js-menu-mobile">
<div class="p-[15px]">
<div class="item-menu mb-[10px]">
<a href="javascript:void(0)" data-menu="tinhnang" class="text-menu flex items-center gap-[5px]">
<span class="font-[600] text-[14px]">Tính năng</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
<div class="content-menu hidden">
<div class="gap-[30px]">
<div class="pb-[20px]">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
Học hỏi và phát triển</div>
<div class="grid grid-cols-2 gap-[25px]">
<div>
<a href=""
class="block mb-[5px] font-bold hover:text-[var(--color-blue)] ">Trung
tâm trợ
giúp</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Hỗ
trợ đẳng cấp thế giới, 24/7</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Đại
học
BigCommerce
</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Đào tạo thương
mại
điện tử từ các chuyên gia của chúng tôi</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Dịch
vụ
đối
tác</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Nhận trợ giúp
xây
dựng cửa hàng của bạn</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa
hàng
chủ
đề</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Mẫu thiết kế
đẹp</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Cửa
hàng
ứng
dụng</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Kết nối với
phần
mềm hàng đầu</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Blog
thương mại
điện tử</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tin tức, chiến
lược
và phân tích</a>
</div>
</div>
</div>
<div class="item mb-[10px]">
<div
class="title text-[16px] font-[400] uppercase py-[16px] border-b-[1px] border-[#d3d3d3] text-[#4C4B58] mb-[16px] ">
chi tiết về thương mại điện tử</div>
<div class="list">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Tài
liệu
&
Video</a>
</div>
</div>
</div>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item grid grid-cols-4">
<a href=""
class="image-article h-[150px] block rounded-[8px_0_0_8px] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%"
alt="article">
</a>
<div class="col-span-3 info bg-[#000] p-[10px] rounded-[0_8px_8px_0]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa
trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p
class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="item-menu mb-[10px]">
<a href="javascript:void(0)" data-menu="hotro" class="text-menu flex items-center gap-[5px]">
<span class="font-[600] text-[14px]">Hỗ trợ</span>
<i class="fa-solid fa-sort-down text-[10px]"></i>
</a>
<div class="hidden content-menu">
<div class="grid grid-cols-2 gap-[25px] py-[20px]">
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)] ">Tạo
mới</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Thiết kế một cửa
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Thiết kế một
cửa
hàng trực tuyến đẹp mắt.</a>
</div>
<div>
@@ -162,13 +391,15 @@
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Vận
hành</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tăng hiệu quả với
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tăng hiệu quả
với
nền tảng đáng tin cậy.</a>
</div>
<div>
<a href="" class="block mb-[5px] font-bold hover:text-[var(--color-blue)]">Chuyển
đổi</a>
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tạo quy trình thanh
<a href="" class="text-[#8A8A8A] hover:text-[var(--color-blue)]">Tạo quy trình
thanh
toán nhanh chóng, đơn giản và có khả năng chuyển đổi.</a>
</div>
<div>
@@ -178,44 +409,52 @@
trường mới và nhiều hơn nữa.</a>
</div>
</div>
</div>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item">
<a href=""
class="image-article block w-full h-[165px] rounded-[8px_8px_0_0] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%" alt="article">
</a>
<div class="info bg-[#000] p-[10px] rounded-[0_0_8px_8px]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
<div id="js-article-menu" class="p-[20px] bg-[#edeff3]">
<div class="item grid grid-cols-4">
<a href="" class="image-article h-[150px] block rounded-[8px_0_0_8px] overflow-hidden ">
<img src="../../assets/images/image-article.png"
class="block w-full h-full object-cover " width="100%" height="100%"
alt="article">
</a>
<div class="col-span-3 info bg-[#000] p-[10px] rounded-[0_8px_8px_0]">
<a href=""
class="font-[600] text-[15px] text-white line-clamp-2 hover:text-[var(--color-blue)] ">Xu
hướng cá nhân
hóa
trải nghiệm
người dùng
trong thương
mại điện tử
</a>
<p class="summary my-[7px] text-[13px] line-clamp-2 text-white ">Cá nhân hóa
trải
nghiệm người
dùng là xu
hướng nổi bật
trong
thương mại điện tử</p>
<a href="" class="flex items-center gap-[10px] group">
<p
class="text-[13px] uppercase text-white group-hover:text-[var(--color-blue)]">
Xem thêm</p>
<i class="fa-solid fa-arrow-right text-[12px] text-[#00E5FF]"></i>
</a>
</div>
</div>
</div>
</div>
</div>
<a href="/pricing" class="hover:underline block mb-[10px] font-[600]">
Bảng giá
</a>
<a href="/dang-nhap" class="block font-[600] mb-[10px] ">Đăng
nhập</a>
<a href="/dang-ky" class="block font-[600] mb-[10px]">Đăng
ký</a>
</div>
</div>
</div>
<div class="opacity-50 z-[1] hidden top-[100%] w-full h-screen bg-[#121118] absolute right-0 transition-all duration-300 "
id="background-opacity" onclick="closeBackgorund()">
</div>