Skip to content

Commit

Permalink
Improve display of defi page
Browse files Browse the repository at this point in the history
  • Loading branch information
behrang committed Apr 21, 2024
1 parent 883477d commit 31a9b1b
Showing 1 changed file with 16 additions and 16 deletions.
32 changes: 16 additions & 16 deletions src/Defi.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,15 @@ const Referral = observer(({ model }: Props) => {
Maximize the potential of your capital with hTON in TON DeFi protocols
</p>

<div className='m-8 mt-16 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1'>
<div className='m-8 mt-32 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1 sm:max-w-64'>
<h3 className='py-4 text-2xl font-bold'>Swap on DEXs</h3>
<p className='my-4 text-lg'>hTON can be traded on DEXs for other tokens.</p>
</div>
<div className='flex w-full flex-1 flex-col flex-wrap items-center justify-center gap-4 md:flex-row'>
<div className='flex w-52 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-44 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={dedust} className='mx-auto w-12' />
<p className='m-4'>DeDust</p>
<p className='m-4 font-medium'>DeDust</p>
<a
className='mx-4 rounded-xl bg-orange p-2 text-white dark:text-dark-600'
href={model.dedustSwapUrl}
Expand All @@ -33,9 +33,9 @@ const Referral = observer(({ model }: Props) => {
Swap now
</a>
</div>
<div className='flex w-52 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-44 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={ston} className='mx-auto w-12' />
<p className='m-4'>StonFi</p>
<p className='m-4 font-medium'>StonFi</p>
<a
className='mx-4 rounded-xl bg-orange p-2 text-white dark:text-dark-600'
href={model.stonSwapUrl}
Expand All @@ -47,15 +47,15 @@ const Referral = observer(({ model }: Props) => {
</div>
</div>

<div className='m-8 mt-16 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1'>
<div className='m-8 mt-48 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1 sm:max-w-64'>
<h3 className='py-4 text-2xl font-bold'>Provide Liquidity</h3>
<p className='my-4 text-lg'>Use hTON to provide liquidity on DEXs, earning fees, and reward.</p>
</div>
<div className='flex w-full flex-1 flex-col flex-wrap items-center justify-center gap-4 md:flex-row'>
<div className='flex w-52 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-44 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={dedust} className='mx-auto w-12' />
<p className='m-4'>DeDust</p>
<p className='m-4 font-medium'>DeDust</p>
<a
className='mx-4 rounded-xl bg-orange p-2 text-white dark:text-dark-600'
href={model.dedustPoolUrl}
Expand All @@ -64,9 +64,9 @@ const Referral = observer(({ model }: Props) => {
Earn now
</a>
</div>
<div className='flex w-52 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-44 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={ston} className='mx-auto w-12' />
<p className='m-4'>StonFi</p>
<p className='m-4 font-medium'>StonFi</p>
<a
className='mx-4 rounded-xl bg-orange p-2 text-white dark:text-dark-600'
href={model.stonPoolUrl}
Expand All @@ -78,15 +78,15 @@ const Referral = observer(({ model }: Props) => {
</div>
</div>

<div className='m-8 mt-16 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1'>
<div className='m-8 mt-48 flex flex-col items-start gap-4 sm:flex-row'>
<div className='flex-1 sm:max-w-64'>
<h3 className='py-4 text-2xl font-bold'>Take a Loan</h3>
<p className='my-4 text-lg'>Use hTON as collateral for a loan.</p>
</div>
<div className='flex w-full flex-1 flex-col flex-wrap items-center justify-center gap-4 md:flex-row'>
<div className='flex w-52 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center opacity-50 shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<div className='flex w-44 flex-none flex-col rounded-2xl border border-dark-600 border-opacity-50 bg-milky bg-opacity-50 p-4 text-center opacity-50 shadow-md dark:border-milky dark:border-opacity-50 dark:bg-dark-700'>
<img src={evaa} className='mx-auto w-12' />
<p className='m-4'>Evaa</p>
<p className='m-4 font-medium'>Evaa</p>
{/* <a
className='mx-4 rounded-xl bg-orange p-2 text-white dark:text-dark-600'
href={model.evaaLoanUrl}
Expand Down

0 comments on commit 31a9b1b

Please sign in to comment.