align linkbutton styles

This commit is contained in:
saml33 2023-04-21 12:32:20 +10:00
parent 2fc3095127
commit a89d528709
11 changed files with 14 additions and 51 deletions

View File

@ -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))}

View File

@ -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}
>

View File

@ -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>

View File

@ -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 />

View File

@ -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}

View File

@ -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))

View File

@ -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"
>

View File

@ -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}
>

View File

@ -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" />

View File

@ -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')}

View File

@ -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)
}