Skip to content

Commit

Permalink
fix: allow social wallets on mobile (#89)
Browse files Browse the repository at this point in the history
  • Loading branch information
chalabi2 authored Nov 27, 2024
1 parent bd782d5 commit 72c2441
Showing 1 changed file with 20 additions and 1 deletion.
21 changes: 20 additions & 1 deletion components/react/views/WalletList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export const WalletList = ({
<XMarkIcon className="w-5 h-5" aria-hidden="true" />
</button>

{/* Browser and Social sections - hidden on mobile/tablet */}
{/* Browser and Social sections - browaer hidden on mobile/tablet */}
<div className="hidden md:block">
<div className="space-y-2 mb-4">
{browser.map(({ walletInfo: { name, prettyName, logo } }) => (
Expand Down Expand Up @@ -89,6 +89,25 @@ export const WalletList = ({
</button>
))}
</div>
<div className="text-center mb-4 mt-3">
<span className="">or connect with</span>
</div>

<div className="grid grid-cols-2 gap-2">
{social.map(({ walletInfo: { name, prettyName, logo } }) => (
<button
key={name}
onClick={() => onWalletClicked(name)}
className="flex items-center justify-center p-4 dark:bg-[#ffffff0c] bg-[#f0f0ff5c] dark:hover:bg-[#0000004c] hover:bg-[#a8a8a84c] rounded-lg transition"
>
<img
src={isDarkMode ? logo?.toString() + '_light.svg' : logo?.toString() + '_dark.svg'}
alt={prettyName}
className={`${prettyName === 'Reddit' || prettyName === 'Google' ? 'w-8 h-8' : 'w-7 h-7'} rounded-md`}
/>
</button>
))}
</div>
</div>
</div>
);
Expand Down

0 comments on commit 72c2441

Please sign in to comment.