Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: review style and replace logo #17

Merged
merged 1 commit into from
Feb 4, 2024
Merged

feat: review style and replace logo #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/content/drawer/logoButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ const LogoButton = () => {
return (
<div className="absolute right-0 rounded-full m-0 w-[50px] h-[50px] cursor-pointer">
<img
src="https://ik.imagekit.io/pqilkfzt7wb/xfans/logo_SPGs-kd5v.png?updatedAt=1706859358184"
src="https://cdn.oasiscircle.xyz/circle/D35FD9C2-12D4-4DBA-8BEC-F8DDD64B8C07.1707035452972.0xA0B5B5"
className="mx-0 p-0 mt-[120px] w-[50px] h-[50px]"
alt="Logo"
/>
Expand Down
64 changes: 33 additions & 31 deletions src/welcome/Profile/Explore.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,8 +49,8 @@ const Up = () => (
const Explore = () => {
const list = Array(7).fill('');
const { openProfile } = useProfileModal((state) => ({ ...state }));
console.log(mockData);
const newList = [...topList];
const timeList = [...topList];

const [value, setValue] = React.useState('1');

Expand Down Expand Up @@ -210,39 +210,41 @@ const Explore = () => {
}}
>
<ul>
{topList.map((item, i) => (
<li
key={item.id}
className="pt-[18px] pb-2 flex items-center border-t border-t-[#EBEEF0]"
>
<span className="text-[#0F1419]">{i + 1}</span>
<img
onClick={openProfile}
src={item.avatar}
alt="avatar"
className="w-[44px] h-[44px] mx-[14px] rounded-full cursor-pointer"
/>
<div className="flex-1 flex flex-col space-y-1">
<div className="flex items-center space-x-2">
<span className="text-[#0F1419] font-bold text-sm">{item.name}</span>
<span className="text-[#5B7083]">@{item.nickname}</span>
</div>

<div className="flex items-center justify-between">
<div className="flex items-center space-x-[6px]">
<span className="text-[#919099] text-sm">Price</span>
<Icon />
<span className="text-[#919099] text-[15px]">{item.price}</span>
{timeList
.sort((a, b) => b.top - a.top)
.map((item, i) => (
<li
key={item.id}
className="pt-[18px] pb-2 flex items-center border-t border-t-[#EBEEF0]"
>
<span className="text-[#0F1419]">{i + 1}</span>
<img
onClick={openProfile}
src={item.avatar}
alt="avatar"
className="w-[44px] h-[44px] mx-[14px] rounded-full cursor-pointer"
/>
<div className="flex-1 flex flex-col space-y-1">
<div className="flex items-center space-x-2">
<span className="text-[#0F1419] font-bold text-sm">{item.name}</span>
<span className="text-[#5B7083]">@{item.nickname}</span>
</div>

<div className="flex items-center space-x-1">
<Up />
<span className="text-[#16B364] text-[15px]">{item.top}%</span>
<div className="flex items-center justify-between">
<div className="flex items-center space-x-[6px]">
<span className="text-[#919099] text-sm">Price</span>
<Icon />
<span className="text-[#919099] text-[15px]">{item.price}</span>
</div>

<div className="flex items-center space-x-1">
<Up />
<span className="text-[#16B364] text-[15px]">{item.top}%</span>
</div>
</div>
</div>
</div>
</li>
))}
</li>
))}
</ul>
</TabPanel>
<TabPanel
Expand All @@ -267,7 +269,7 @@ const Explore = () => {
<span className="text-[#919099] text-sm">{item.nickname}</span>
</div>

<span className="font-bold w-10 text-center text-sm">{item.type}</span>
<span className="font-bold w-12 text-center text-sm">{item.type}</span>

<div className="flex flex-col items-center w-9">
<img
Expand Down
4 changes: 2 additions & 2 deletions src/welcome/Profile/Reward.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ const Reward = () => {
onClick={openProfile}
src={item.avatar}
alt=""
className="w-[30px] rounded-full cursor-pointer"
className="w-[44px] rounded-full cursor-pointer"
/>
<div className="flex flex-col space-y-[2px]">
<span className="text-sm font-bold" style={{ fontVariant: 'small-caps' }}>
Expand Down Expand Up @@ -175,7 +175,7 @@ const Reward = () => {
onClick={openProfile}
src={reward[0].avatar}
alt=""
className="w-[30px] rounded-full cursor-pointer"
className="w-[44px] rounded-full cursor-pointer"
/>
<div className="flex flex-col space-y-[2px]">
<span className="text-sm font-bold" style={{ fontVariant: 'small-caps' }}>
Expand Down
32 changes: 25 additions & 7 deletions src/welcome/Wallet/BuyModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,24 @@ const Icon = () => (
</svg>
);

const Icon1 = () => (
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none">
<g clipPath="url(#clip0_365_21061)">
<path d="M5.00032 17.4065V13.1882L0.142578 10.1367L5.00032 17.4065Z" fill="#C7C7E0" />
<path d="M5.0166 17.4065V13.1882L9.87443 10.1367L5.01669 17.4065H5.0166Z" fill="#A3A3D2" />
<path d="M5.00048 12.1404V6.75684L0.0869141 9.12012L5.00048 12.1404Z" fill="#C7C7E0" />
<path d="M5.0166 12.1404V6.75684L9.93017 9.12021L5.0166 12.1404Z" fill="#A3A3D2" />
<path d="M0.0869141 9.12L5.00039 0.59375V6.75662L0.0869141 9.12Z" fill="#C7C7E0" />
<path d="M9.93008 9.12L5.0166 0.59375V6.75662L9.93008 9.12Z" fill="#A3A3D2" />
</g>
<defs>
<clipPath id="clip0_365_21061">
<rect width="10" height="17" fill="white" transform="translate(0 0.5)" />
</clipPath>
</defs>
</svg>
);

const Left = () => (
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path
Expand Down Expand Up @@ -97,15 +115,15 @@ const BuyModal = () => {
<div className="flex items-center justify-between">
<span className="text-lg font-medium">Transaction Fee</span>
<div className="flex items-center space-x-1">
<Icon />
<span className="text-lg font-medium">5.002</span>
<Icon1 />
<span className="text-lg font-medium">0.002</span>
</div>
</div>
<div className="flex items-center justify-between">
<span className="text-lg font-medium">Est. Gas Fee</span>
<div className="flex items-center space-x-1">
<Icon />
<span className="text-lg font-medium">0.014</span>
<Icon1 />
<span className="text-lg font-medium">0.001</span>
</div>
</div>
</div>
Expand All @@ -123,15 +141,15 @@ const BuyModal = () => {
<div className="flex items-center justify-between">
<span className="text-lg font-medium">You Pay(Including Fees)</span>
<div className="flex items-center space-x-1">
<Icon />
<Icon1 />
<span className="text-2xl font-bold">0.052</span>
</div>
</div>
<div className="flex items-center justify-between">
<span className="text-[#919099] text-lg font-medium">Wallet Balance</span>
<div className="flex items-center justify-center bg-[#F5F5F5] rounded-full space-x-1 px-5 py-1">
<Icon />
<span className="text-lg font-medium">20.2928</span>
<Icon1 />
<span className="text-lg font-medium">30.24</span>
</div>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions src/welcome/Wallet/InviteFriends.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,17 +32,17 @@ const rows = [
{
time: 'Jan 05 2024, 14:32',
user: 'Cody Fisher',
value: 12.87,
value: 2,
},
{
time: 'Apr 06 2023, 20:13',
user: 'Cody Fisher',
value: 10.03,
value: 2,
},
{
time: 'Jan 12 2023, 13:42',
user: 'Cody Fisher',
value: 15.12,
value: 2,
},
];

Expand Down Expand Up @@ -79,7 +79,7 @@ const InviteFriends = () => {
<div className="w-1/2">
<div className="flex flex-col items-center space-y-[14px]">
<span className="text-[#919099] text-sm font-medium">Invite Points</span>
<span className="text-[#1A1D1F] text-xl leading-[20px] font-bold">10.05</span>
<span className="text-[#1A1D1F] text-xl leading-[20px] font-bold">10</span>
</div>
</div>
</div>
Expand Down
Loading
Loading