generated from muhtadeetaron/nextjs-template
fix(ui): fix ui icons and readability
This commit is contained in:
@ -44,35 +44,39 @@ const SettingsPage = () => {
|
||||
<UserCircle2 size={30} color="#113768" />
|
||||
</button>
|
||||
</section>
|
||||
<section className="flex flex-col gap-4">
|
||||
<div className="flex gap-4 items-center">
|
||||
<Avatar className="bg-[#113768] w-20 h-20">
|
||||
<AvatarFallback className="text-3xl text-white">
|
||||
{user?.username
|
||||
? user.username.charAt(0).toUpperCase()
|
||||
: ""}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<div className="flex flex-col items-start">
|
||||
<h1 className="font-semibold text-2xl">{user?.full_name}</h1>
|
||||
<h3 className=" text-md">{user?.email}</h3>
|
||||
</div>
|
||||
<section className="flex items-center gap-4 bg-blue-100 border-1 border-blue-300/40 rounded-2xl py-5 px-4">
|
||||
<Avatar className="bg-[#113768] w-20 h-20">
|
||||
<AvatarFallback className="text-3xl text-white">
|
||||
{user?.username
|
||||
? user.username.charAt(0).toUpperCase()
|
||||
: "User"}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<div className="flex flex-col items-start">
|
||||
<h1 className="font-semibold text-2xl flex gap-1 items-center">
|
||||
{user?.full_name}
|
||||
</h1>
|
||||
<h3 className=" text-md">{user?.email}</h3>
|
||||
</div>
|
||||
</section>
|
||||
<section className="flex flex-col gap-8">
|
||||
<button
|
||||
onClick={() => router.push("/settings/verify")}
|
||||
className="flex justify-between"
|
||||
>
|
||||
<div className="flex items-center gap-4">
|
||||
<BadgeCheck size={30} color="#113768" />
|
||||
<h3 className="text-md font-medium text-[#113768]">
|
||||
Verify your account
|
||||
</h3>
|
||||
</div>
|
||||
<ChevronRight size={30} color="#113768" />
|
||||
</button>
|
||||
<div className="h-[0.5px] border-[0.1px] w-full border-[#113768]/20"></div>
|
||||
{!user?.is_verified && (
|
||||
<>
|
||||
<button
|
||||
onClick={() => router.push("/settings/verify")}
|
||||
className="flex justify-between"
|
||||
>
|
||||
<div className="flex items-center gap-4">
|
||||
<BadgeCheck size={30} color="#113768" />
|
||||
<h3 className="text-md font-medium text-[#113768]">
|
||||
Verify your account
|
||||
</h3>
|
||||
</div>
|
||||
<ChevronRight size={30} color="#113768" />
|
||||
</button>
|
||||
<div className="h-[0.5px] border-[0.1px] w-full border-[#113768]/20"></div>
|
||||
</>
|
||||
)}
|
||||
<button
|
||||
onClick={() => router.push("/profile")}
|
||||
className="flex justify-between"
|
||||
|
||||
Reference in New Issue
Block a user