update
This commit is contained in:
@@ -1,3 +1,97 @@
|
||||
<div class="layout-container flex flex-col gap-[27px]">
|
||||
<!-- Box Article + Video Review -->
|
||||
<div class="bg-white rounded-[12px] overflow-hidden flex gap-3 px-3 py-4">
|
||||
<!-- Tin khuyến mãi -->
|
||||
<div class="flex flex-col gap-3 w-[885px] shrink-0">
|
||||
<h2 class="text-[28px] font-bold text-black tracking-tight">TIN KHUYẾN MẠI</h2>
|
||||
<div class="flex gap-3 items-start">
|
||||
{% assign _article_idx = 0 %}
|
||||
{% for _cat_articles in page.article_home %}
|
||||
{% for _article in _cat_articles %}
|
||||
{% if _article_idx == 0 %}
|
||||
<!-- Main article -->
|
||||
<div class="w-[481px] shrink-0 relative">
|
||||
<a href="{{ _article.url }}" class="block w-[481px] h-[300px] rounded-[4px] overflow-hidden">
|
||||
<img src="{{ _article.image.original }}" alt="{{ _article.title }}" class="w-full h-full object-cover"
|
||||
onerror="this.onerror=null;this.src='{{ no_image_url }}'" />
|
||||
</a>
|
||||
<a href="{{ _article.url }}"
|
||||
class="block mt-2 text-[20px] font-bold text-black tracking-tight hover:text-[#e4057c] line-clamp-2">{{
|
||||
_article.title }}</a>
|
||||
</div>
|
||||
<!-- Side articles -->
|
||||
<div class="flex flex-col gap-3 flex-1">
|
||||
{% elsif _article_idx <= 3 %} <div class="flex gap-3 items-start">
|
||||
<a href="{{ _article.url }}" class="shrink-0 block">
|
||||
<img src="{{ _article.image.thum }}" alt="{{ _article.title }}"
|
||||
class="w-[153px] h-[92px] rounded-[4px] object-cover shrink-0"
|
||||
onerror="this.onerror=null;this.src='{{ no_image_url }}'" />
|
||||
</a>
|
||||
<a href="{{ _article.url }}"
|
||||
class="text-[14px] text-black tracking-tight overflow-hidden hover:text-[#e4057c] line-clamp-3">{{
|
||||
_article.title }}</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% assign _article_idx = _article_idx | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% if _article_idx > 0 %}</div>{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Review -->
|
||||
<div class="flex flex-col gap-3 flex-1">
|
||||
<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="{{ 'video_main.png' | asset_url }}" 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="{{ 'video_thumb_1.png' | asset_url }}" 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 line-clamp-3">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="{{ 'video_thumb_2.png' | asset_url }}" 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 line-clamp-3">Duy nhất 17h ngày 10/02 Cơ
|
||||
hội trúng Máy nước</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Key Search -->
|
||||
<div class="bg-white w-[100%] rounded-[12px] my-[20px] 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] overflow-hidden px-3 py-4 flex flex-wrap gap-[10px] text-[12px] text-black">
|
||||
<a href="/search?q=hút+mùi+hafele" class="hover:text-[#e4057c]">hút mùi hafele</a>
|
||||
<a href="/search?q=bếp+từ+cheft" class="hover:text-[#e4057c]">bếp từ cheft</a>
|
||||
<a href="/search?q=nồi+cơm+điện+Tiger" class="hover:text-[#e4057c]">nồi cơm điện Tiger</a>
|
||||
<a href="/search?q=máy+cạo+râu+Enchen" class="hover:text-[#e4057c]">máy cạo râu Enchen</a>
|
||||
<a href="/search?q=mũ+bảo+hiểm" class="hover:text-[#e4057c]">mũ bảo hiểm</a>
|
||||
<a href="/search?q=nồi+cơm+điện+Cuckoo" class="hover:text-[#e4057c]">nồi cơm điện Cuckoo</a>
|
||||
<a href="/search?q=iPhone+15" class="hover:text-[#e4057c]">iPhone 15</a>
|
||||
<a href="/search?q=chảo+chống+dính+Elmich" class="hover:text-[#e4057c]">chảo chống dính Elmich</a>
|
||||
<a href="/search?q=máy+massage+X5+Pro+Omni" class="hover:text-[#e4057c]">máy massage X5 Pro Omni</a>
|
||||
<a href="/search?q=điều+hòa+Samsung" class="hover:text-[#e4057c]">điều hòa Samsung</a>
|
||||
<a href="/search?q=máy+lọc+nước+Korihome+Kangen+K8" class="hover:text-[#e4057c]">máy lọc nước Korihome Kangen
|
||||
K8</a>
|
||||
<a href="/search?q=tông+đơ+cắt+tóc" class="hover:text-[#e4057c]">tông đơ cắt tóc</a>
|
||||
<a href="/search?q=điều+hoà+Hisense" class="hover:text-[#e4057c]">điều hoà Hisense</a>
|
||||
<a href="/search?q=Máy+chạy+bộ" class="hover:text-[#e4057c]">Máy chạy bộ</a>
|
||||
<a href="/search?q=MacBook+Air+M4" class="hover:text-[#e4057c]">MacBook Air M4</a>
|
||||
<a href="/search?q=điều+hòa+Nagakawa" class="hover:text-[#e4057c]">điều hòa Nagakawa</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<footer class="w-full bg-white mt-1">
|
||||
<div class="layout-container flex gap-[95px] py-4 h-[212px] overflow-hidden items-start">
|
||||
<div class="flex flex-col gap-1 w-[267px] shrink-0">
|
||||
@@ -15,21 +109,22 @@
|
||||
<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>
|
||||
<p><a href="/gioi-thieu" class="hover:text-[#e4057c]">Giới thiệu về công ty</a></p>
|
||||
<p><a href="/tuyen-dung" class="hover:text-[#e4057c]">Tuyển dụng</a></p>
|
||||
<p><a href="/gop-y-khieu-nai" class="hover:text-[#e4057c]">Gửi góp ý, khiếu nại</a></p>
|
||||
<p><a href="/he-thong-cua-hang" class="hover:text-[#e4057c]">Tìm siêu thị (215 shop)</a></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>
|
||||
<p><a href="/quy-dinh-truy-cap-website" class="hover:text-[#e4057c]">Quy định truy cập Website</a></p>
|
||||
<p><a href="/chinh-sach-bao-mat-thong-tin" class="hover:text-[#e4057c]">Chính sách bảo mật thông tin</a></p>
|
||||
<p><a href="/chinh-sach-van-chuyen-giao-nhan" class="hover:text-[#e4057c]">Chính sách vận chuyển, giao nhận</a>
|
||||
</p>
|
||||
<p><a href="/chinh-sach-cho-doanh-nghiep" class="hover:text-[#e4057c]">Chính sách cho doanh nghiệp</a></p>
|
||||
<p><a href="/chinh-sach-bao-hanh-doi-tra" class="hover:text-[#e4057c]">Chính sách bảo hành, đổi trả</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -54,7 +149,8 @@
|
||||
<span class="text-[11px] text-[#0084ff]">Zalo MIQ</span>
|
||||
</div>
|
||||
</div>
|
||||
<img src="{{ 'logo_bct.png' | asset_url }}" alt="Đã thông báo Bộ Công Thương" class="w-[100px] h-[38px] object-contain" />
|
||||
<img src="{{ 'logo_bct.png' | asset_url }}" alt="Đã thông báo Bộ Công Thương"
|
||||
class="w-[100px] h-[38px] object-contain" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -62,4 +158,4 @@
|
||||
<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>
|
||||
</footer>
|
||||
Reference in New Issue
Block a user