This commit is contained in:
2025-05-11 22:55:02 +07:00
parent 8a7adbb3d2
commit 96b9fc06d2
5 changed files with 173 additions and 1 deletions

132
account.html Normal file
View File

@@ -0,0 +1,132 @@
<!doctype html>
<html lang="vi">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BESTPC - Trang chủ</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
<link rel="stylesheet" href="./src/assets/css/style.css" rel="stylesheet" />
</head>
<body>
<div class="page-account bg-[#EFEFEF] pb-[100px]">
<div class="container">
<div class="breadcrumb p-[12px_0]">
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList" class="ul flex flex-wrap items-center">
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
class="flex items-center pr-[12px]">
<a href="/" itemprop="item" class="nopad-l flex items-center text-[#637381]">
<span itemprop="name"><span style="font-size: 0;display: none;">Trang chủ</span> <i
class="icon_2025 home mr-[5px] mb-[5px]"></i></span>
</a> <i class="icon_2025 angle-right ml-[12px]"></i>
<meta itemprop="position" content="1">
</li>
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"
class="flex items-center pr-[12px]">
<a href="/man-hinh.html" itemprop="item" class="nopad-l flex items-center">
<span itemprop="name">
Tài khoản
</span>
</a>
<meta itemprop="position" content="2">
</li>
</ol>
</div>
<div class="mt-5 flex gap-[10px]">
<div class="left w-[20%]">
<div class="bg-white p-2 mb-3">
<div class="flex items-center">
<img src="./src/assets/images/avartar.png"
class="w-[50px] h-[50px] rounded-full block mr-[10px] object-contain" alt="">
<div class="w-[calc(100%-60px)]">
<b class="block mb-0.3">Chi phạm</b>
<p class="text-[#707070]">Chipham2z@gmail.com</p>
</div>
</div>
<a href="" class="text-[#1877F2] font-bold mt-0.5 block">Xem hồ sơ</a>
</div>
<div class="bg-white p-2 py-3 mb-3">
<a href="" class="flex items-center gap-[5px] mb-2.5">
<i class="icon_2025 list_faq"></i>
<span>Danh sách câu hỏi</span>
</a>
<a href="" class="flex items-center gap-[5px] mb-2.5">
<i class="icon_2025 list_raovat"></i>
<span>Danh sách tin rao vặt</span>
</a>
<a href="" class="flex items-center gap-[5px] mb-2.5">
<i class="icon_2025 list_inbox"></i>
<span>Danh sách tin nhắn</span>
</a>
<a href="" class="flex items-center gap-[5px] mb-2.5">
<i class="icon_2025 info_save"></i>
<span>Danh sách các thông tin đã lưu</span>
</a>
</div>
</div>
<div class="right w-[80%]">
<div class="bg-white p-3">
<b class="mb-5 text-xl block">Thông tin cá nhân</b>
<img src="./src/assets/images/avartar_acc.png"
class="block w-[120px] h-[120px] rounded-full m-[0_auto_30px_auto] object-contain" alt="">
<div class="w-[620px] mx-auto pb-[100px]">
<div class="flex items-center justify-between py-2 border-b-[1px] border-[#e3e3e3]">
<b>Họ và tên</b>
<b>Chi phạm</b>
</div>
<div class="flex items-center justify-between py-2 border-b-[1px] border-[#e3e3e3]">
<b>Email</b>
<b class="text-[#707070]">Chipham2z@gmail.com</b>
</div>
<div class="flex items-center justify-between py-2 border-b-[1px] border-[#e3e3e3]">
<b>Số điện thoại</b>
<b class="text-[#707070]">098.240.2013</b>
</div>
<div class="flex items-center justify-between py-2 border-b-[1px] border-[#e3e3e3]">
<b>Ngày sinh</b>
<b class="text-[#707070]">13/03/1999</b>
</div>
<div class="flex items-center justify-between py-2 border-b-[1px] border-[#e3e3e3]">
<b>Tỉnh thành</b>
<b class="text-[#707070]">Hà nội</b>
</div>
<div class="flex items-center justify-between py-2">
<b>Giới tính</b>
<b class="text-[#707070]">Nữ</b>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -305,6 +305,26 @@ html {
height: 22px; height: 22px;
background-position: -130px -186px; background-position: -130px -186px;
} }
.icon_2025.list_faq {
width: 21px;
height: 24px;
background-position: -1px -211px;
}
.icon_2025.list_raovat {
width: 21px;
height: 25px;
background-position: -52px -211px;
}
.icon_2025.list_inbox {
width: 22px;
height: 25px;
background-position: -105px -211px;
}
.icon_2025.info_save {
width: 22px;
height: 25px;
background-position: -164px -211px;
}
.icon-star { .icon-star {
background: url(../images/icon_star.png) no-repeat; background: url(../images/icon_star.png) no-repeat;

File diff suppressed because one or more lines are too long

View File

@@ -307,6 +307,26 @@ html {
height: 22px; height: 22px;
background-position: -130px -186px; background-position: -130px -186px;
} }
&.list_faq {
width: 21px;
height: 24px;
background-position: -1px -211px;
}
&.list_raovat {
width: 21px;
height: 25px;
background-position: -52px -211px;
}
&.list_inbox {
width: 22px;
height: 25px;
background-position: -105px -211px;
}
&.info_save {
width: 22px;
height: 25px;
background-position: -164px -211px;
}
} }
.icon-star { .icon-star {

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB