Skip to content

Commit

Permalink
increase font sizes
Browse files Browse the repository at this point in the history
  • Loading branch information
0xshiba1 committed Jul 7, 2024
1 parent 1a44092 commit 9b837f1
Show file tree
Hide file tree
Showing 4 changed files with 21 additions and 10 deletions.
6 changes: 3 additions & 3 deletions frontend/src/components/dashboard/FirstDepositDialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { PartyPopper } from "lucide-react";
import { ApiDepositEvent } from "@suilend/sdk/types";

import Dialog from "@/components/dashboard/Dialog";
import { TLabelSans } from "@/components/shared/Typography";
import { TBodySans } from "@/components/shared/Typography";
import { AspectRatio } from "@/components/ui/aspect-ratio";
import { useDashboardContext } from "@/contexts/DashboardContext";

Expand Down Expand Up @@ -32,11 +32,11 @@ export default function FirstDepositDialog() {
isAutoHeight
>
<div className="flex flex-col gap-4 p-4">
<TLabelSans className="text-foreground">
<TBodySans>
{
"Your account is represented as an NFT, which can be viewed from your wallet's NFT section. Remember, do not burn!"
}
</TLabelSans>
</TBodySans>

<AspectRatio
className="overflow-hidden rounded-sm bg-muted/10"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -132,6 +132,7 @@ function AccountPositionCardContent() {
{loopedAssetCoinTypes.map((coinTypes) => (
<LoopedPosition
key={coinTypes.join(".")}
labelClassName="text-xs"
coinTypes={coinTypes}
/>
))}
Expand Down
22 changes: 16 additions & 6 deletions frontend/src/components/layout/LoopedPosition.tsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,27 @@
import { ClassValue } from "clsx";

import TokenLogo from "@/components/shared/TokenLogo";
import { TLabelSans } from "@/components/shared/Typography";
import { TBodySans } from "@/components/shared/Typography";
import { AppData, useAppContext } from "@/contexts/AppContext";
import { cn } from "@/lib/utils";

interface LoopedPositionProps {
labelClassName?: ClassValue;
coinTypes: string[];
}

export default function LoopedPosition({ coinTypes }: LoopedPositionProps) {
export default function LoopedPosition({
labelClassName,
coinTypes,
}: LoopedPositionProps) {
const appContext = useAppContext();
const data = appContext.data as AppData;

return (
<div className="flex flex-row flex-wrap items-center gap-x-1.5 gap-y-1">
<TBodySans className={cn("text-muted-foreground", labelClassName)}>
</TBodySans>
<TokenLogo
className="h-4 w-4"
token={{
Expand All @@ -20,10 +30,10 @@ export default function LoopedPosition({ coinTypes }: LoopedPositionProps) {
iconUrl: data.coinMetadataMap[coinTypes[0]].iconUrl,
}}
/>
<TLabelSans>
<TBodySans className={cn("text-muted-foreground", labelClassName)}>
{data.coinMetadataMap[coinTypes[0]].symbol} deposits{" "}
{coinTypes[0] === coinTypes[1] ? "and borrows" : "and"}
</TLabelSans>
</TBodySans>
{coinTypes[0] !== coinTypes[1] && (
<>
<TokenLogo
Expand All @@ -34,9 +44,9 @@ export default function LoopedPosition({ coinTypes }: LoopedPositionProps) {
iconUrl: data.coinMetadataMap[coinTypes[1]].iconUrl,
}}
/>
<TLabelSans>
<TBodySans className={cn("text-muted-foreground", labelClassName)}>
{data.coinMetadataMap[coinTypes[1]].symbol} borrows
</TLabelSans>
</TBodySans>
</>
)}
</div>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/layout/LoopingDialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export default function LoopingDialog() {
isAutoHeight
>
<div className="flex flex-col gap-4 p-4">
<TBodySans className="text-xs">{LOOPING_MESSAGE}</TBodySans>
<TBodySans>{LOOPING_MESSAGE}</TBodySans>

<div className="flex flex-col gap-2">
{loopedAssetCoinTypes.map((coinTypes) => (
Expand Down

0 comments on commit 9b837f1

Please sign in to comment.