From a89d528709d6dcea84e03d129c8d3ba0e862346c Mon Sep 17 00:00:00 2001
From: saml33 <slam.uke@gmail.com>
Date: Fri, 21 Apr 2023 12:32:20 +1000
Subject: [PATCH] align linkbutton styles

---
 components/ThemeSwitcher.tsx              |  2 +-
 components/account/ActionsLinkButton.tsx  |  2 +-
 components/chat/Chat.tsx                  |  2 +-
 components/modals/UserSetupModal.tsx      | 42 ++---------------------
 components/profile/EditNftProfilePic.tsx  |  2 +-
 components/shared/BalancesTable.tsx       |  4 +--
 components/shared/Button.tsx              |  2 +-
 components/shared/MaxAmountButton.tsx     |  2 +-
 components/trade/AdvancedMarketHeader.tsx |  2 +-
 components/trade/MarketCloseModal.tsx     |  2 +-
 components/trade/PerpPositions.tsx        |  3 +-
 11 files changed, 14 insertions(+), 51 deletions(-)

diff --git a/components/ThemeSwitcher.tsx b/components/ThemeSwitcher.tsx
index 03d5bdad..5994d6d8 100644
--- a/components/ThemeSwitcher.tsx
+++ b/components/ThemeSwitcher.tsx
@@ -15,7 +15,7 @@ const ThemeSwitcher = () => {
     >
       {THEMES.map((value) => (
         <LinkButton
-          className={`whitespace-nowrap font-normal no-underline md:hover:text-th-fgd-1 ${
+          className={`whitespace-nowrap font-normal ${
             t(value) === theme ? 'text-th-active' : ''
           }`}
           onClick={() => setTheme(t(value))}
diff --git a/components/account/ActionsLinkButton.tsx b/components/account/ActionsLinkButton.tsx
index 2f53a399..9523f20b 100644
--- a/components/account/ActionsLinkButton.tsx
+++ b/components/account/ActionsLinkButton.tsx
@@ -13,7 +13,7 @@ const ActionsLinkButton = ({
 }) => {
   return (
     <LinkButton
-      className="w-full whitespace-nowrap text-left font-normal no-underline md:hover:text-th-fgd-1"
+      className="w-full whitespace-nowrap text-left font-normal"
       disabled={!mangoAccount}
       onClick={onClick}
     >
diff --git a/components/chat/Chat.tsx b/components/chat/Chat.tsx
index 415dc5d9..74bc3f95 100644
--- a/components/chat/Chat.tsx
+++ b/components/chat/Chat.tsx
@@ -85,7 +85,7 @@ const Chat = () => {
         </LinkButton>
       )}
       <div className="bg-th-bkg-2 px-3 py-0.5">
-        <LinkButton className="mb-0 text-xxs font-normal no-underline">
+        <LinkButton className="mb-0 text-xxs font-normal">
           <span className="text-th-fgd-4">Content Policy</span>
         </LinkButton>
       </div>
diff --git a/components/modals/UserSetupModal.tsx b/components/modals/UserSetupModal.tsx
index daf3173b..25ceebd3 100644
--- a/components/modals/UserSetupModal.tsx
+++ b/components/modals/UserSetupModal.tsx
@@ -368,9 +368,7 @@ const UserSetupModal = ({
                       )}
                     </Button>
                     <LinkButton onClick={onClose}>
-                      <span className="text-th-fgd-4 underline md:hover:text-th-fgd-3 md:hover:no-underline">
-                        {t('onboarding:skip')}
-                      </span>
+                      {t('onboarding:skip')}
                     </LinkButton>
                   </div>
                 </div>
@@ -513,9 +511,7 @@ const UserSetupModal = ({
                     )}
                   </Button>
                   <LinkButton onClick={onClose}>
-                    <span className="text-th-fgd-4 underline md:hover:text-th-fgd-3 md:hover:no-underline">
-                      {t('onboarding:skip')}
-                    </span>
+                    {t('onboarding:skip')}
                   </LinkButton>
                 </UserSetupTransition>
                 <UserSetupTransition show={depositToken.length === 0}>
@@ -547,40 +543,6 @@ const UserSetupModal = ({
               </div>
             ) : null}
           </UserSetupTransition>
-          {/* <UserSetupTransition delay show={showSetupStep === 4}>
-            {showSetupStep === 4 ? (
-              <div className="relative">
-                <h2 className="mb-4 font-display text-3xl tracking-normal md:text-5xl lg:text-6xl">
-                  {t('onboarding:your-profile')}
-                </h2>
-                <p className="text-base">{t('onboarding:profile-desc')}</p>
-                {!showEditProfilePic ? (
-                  <div className="mt-6 border-t border-th-bkg-3 pt-3">
-                    <EditProfileForm
-                      onFinish={onClose}
-                      onEditProfileImage={() => setShowEditProfilePic(true)}
-                      onboarding
-                    />
-                    <LinkButton className="mt-6" onClick={onClose}>
-                      <span className="text-th-fgd-4 underline md:hover:text-th-fgd-3 md:hover:no-underline">
-                        {t('onboarding:skip-finish')}
-                      </span>
-                    </LinkButton>
-                  </div>
-                ) : null}
-                <UserSetupTransition show={showEditProfilePic}>
-                  <div
-                    className="thin-scroll absolute mt-6 w-full overflow-auto border-t border-th-bkg-3 px-2 pt-6"
-                    style={{ height: 'calc(100vh - 360px)' }}
-                  >
-                    <EditNftProfilePic
-                      onClose={() => setShowEditProfilePic(false)}
-                    />
-                  </div>
-                </UserSetupTransition>
-              </div>
-            ) : null}
-          </UserSetupTransition> */}
         </div>
         <div className="col-span-1 hidden h-screen lg:block">
           <ParticlesBackground />
diff --git a/components/profile/EditNftProfilePic.tsx b/components/profile/EditNftProfilePic.tsx
index 562c3a21..784e658f 100644
--- a/components/profile/EditNftProfilePic.tsx
+++ b/components/profile/EditNftProfilePic.tsx
@@ -153,7 +153,7 @@ const EditNftProfilePic = ({ onClose }: { onClose: () => void }) => {
             {t('save')}
           </Button>
           {profile?.profile_image_url ? (
-            <LinkButton className="text-sm" onClick={removeProfileImage}>
+            <LinkButton onClick={removeProfileImage}>
               {t('profile:remove')}
             </LinkButton>
           ) : null}
diff --git a/components/shared/BalancesTable.tsx b/components/shared/BalancesTable.tsx
index ea429edc..daa39dfe 100644
--- a/components/shared/BalancesTable.tsx
+++ b/components/shared/BalancesTable.tsx
@@ -324,7 +324,7 @@ const Balance = ({ bank }: { bank: BankWithBalance }) => {
       {!isUnownedAccount ? (
         asPath.includes('/trade') && isBaseOrQuote ? (
           <LinkButton
-            className="font-normal underline-offset-2 md:underline-offset-4"
+            className="font-normal underline underline-offset-2 md:underline-offset-4 md:hover:no-underline"
             onClick={() =>
               handleTradeFormBalanceClick(Math.abs(balance), isBaseOrQuote)
             }
@@ -336,7 +336,7 @@ const Balance = ({ bank }: { bank: BankWithBalance }) => {
           </LinkButton>
         ) : asPath.includes('/swap') ? (
           <LinkButton
-            className="font-normal underline-offset-2 md:underline-offset-4"
+            className="font-normal underline underline-offset-2 md:underline-offset-4 md:hover:no-underline"
             onClick={() =>
               handleSwapFormBalanceClick(
                 Number(formatNumericValue(balance, tokenBank.mintDecimals))
diff --git a/components/shared/Button.tsx b/components/shared/Button.tsx
index e63bba78..541167c3 100644
--- a/components/shared/Button.tsx
+++ b/components/shared/Button.tsx
@@ -114,7 +114,7 @@ export const LinkButton: FunctionComponent<LinkButtonCombinedProps> = ({
       disabled={disabled}
       className={`flex items-center border-0 font-bold ${
         secondary ? 'text-th-active' : 'text-th-fgd-2'
-      } rounded-sm underline focus-visible:text-th-active focus-visible:no-underline disabled:cursor-not-allowed  disabled:opacity-50 md:hover:no-underline  ${className}`}
+      } rounded-sm focus-visible:text-th-active focus-visible:underline disabled:cursor-not-allowed disabled:opacity-50 ${className} md:hover:text-th-fgd-3`}
       {...props}
       type="button"
     >
diff --git a/components/shared/MaxAmountButton.tsx b/components/shared/MaxAmountButton.tsx
index 7a881040..258a5405 100644
--- a/components/shared/MaxAmountButton.tsx
+++ b/components/shared/MaxAmountButton.tsx
@@ -19,7 +19,7 @@ const MaxAmountButton = ({
 }) => {
   return (
     <LinkButton
-      className={`font-normal no-underline ${className} md:hover:text-th-fgd-3`}
+      className={`font-normal ${className}`}
       disabled={disabled}
       onClick={onClick}
     >
diff --git a/components/trade/AdvancedMarketHeader.tsx b/components/trade/AdvancedMarketHeader.tsx
index 5a0ab0f7..e8729ebb 100644
--- a/components/trade/AdvancedMarketHeader.tsx
+++ b/components/trade/AdvancedMarketHeader.tsx
@@ -204,7 +204,7 @@ const AdvancedMarketHeader = ({
           <div className="ml-6 flex items-center space-x-4">
             {selectedMarket instanceof PerpMarket ? (
               <LinkButton
-                className="flex items-center whitespace-nowrap text-th-fgd-3 no-underline md:hover:text-th-fgd-4"
+                className="flex items-center whitespace-nowrap text-th-fgd-3"
                 onClick={() => setShowMarketDetails(true)}
               >
                 <InformationCircleIcon className="h-5 w-5 flex-shrink-0 md:mr-1.5 md:h-4 md:w-4" />
diff --git a/components/trade/MarketCloseModal.tsx b/components/trade/MarketCloseModal.tsx
index 877b5efa..e525717c 100644
--- a/components/trade/MarketCloseModal.tsx
+++ b/components/trade/MarketCloseModal.tsx
@@ -204,7 +204,7 @@ const MarketCloseModal: FunctionComponent<MarketCloseModalProps> = ({
         {submitting ? <Loading /> : <span>{t('trade:close-position')}</span>}
       </Button>
       <LinkButton
-        className="inline-flex w-full items-center justify-center text-th-fgd-1"
+        className="inline-flex w-full items-center justify-center"
         onClick={onClose}
       >
         {t('cancel')}
diff --git a/components/trade/PerpPositions.tsx b/components/trade/PerpPositions.tsx
index edc12a0d..880e2abe 100644
--- a/components/trade/PerpPositions.tsx
+++ b/components/trade/PerpPositions.tsx
@@ -149,6 +149,7 @@ const PerpPositions = () => {
                           <p className="flex justify-end">
                             {isSelectedMarket ? (
                               <LinkButton
+                                className="font-normal underline underline-offset-2 md:underline-offset-4 md:hover:no-underline"
                                 onClick={() =>
                                   handlePositionClick(floorBasePosition, market)
                                 }
@@ -294,7 +295,7 @@ const PerpPositions = () => {
                           <span className="font-mono text-th-fgd-3">
                             {isSelectedMarket && asPath === '/trade' ? (
                               <LinkButton
-                                className="font-normal"
+                                className="font-normal underline underline-offset-2 md:underline-offset-4 md:hover:no-underline"
                                 onClick={() =>
                                   handlePositionClick(floorBasePosition, market)
                                 }