diff --git a/apps/hyperdrive-trading/src/ui/hyperdrive/longs/OpenLongForm/OpenLongForm.tsx b/apps/hyperdrive-trading/src/ui/hyperdrive/longs/OpenLongForm/OpenLongForm.tsx index 092c4b9d4..ca8e275cd 100644 --- a/apps/hyperdrive-trading/src/ui/hyperdrive/longs/OpenLongForm/OpenLongForm.tsx +++ b/apps/hyperdrive-trading/src/ui/hyperdrive/longs/OpenLongForm/OpenLongForm.tsx @@ -1,7 +1,9 @@ +import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { adjustAmountByPercentage } from "@hyperdrive/core"; import { useConnectModal } from "@rainbow-me/rainbowkit"; import { ethers } from "ethers"; import { ReactElement } from "react"; +import { Link } from "react-router-dom"; import { Hyperdrive } from "src/appconfig/types"; import { useNumericInput } from "src/ui/base/hooks/useNumericInput"; import { useMaxLong } from "src/ui/hyperdrive/longs/hooks/useMaxLong"; @@ -82,17 +84,27 @@ export function OpenLongForm({ market }: OpenLongFormProps): ReactElement { return (
- {/* You Pay Section */} -
-
You pay
- setAmount(newAmount)} - /> +
+
Open a long
+
+

Secure a fixed rate by purchasing bonds.

+ + Learn More + + +
- + setAmount(newAmount)} + /> {/* New Position Section */}
Preview transaction
diff --git a/apps/hyperdrive-trading/src/ui/hyperdrive/lp/AddLiquidityForm/AddLiquidityForm.tsx b/apps/hyperdrive-trading/src/ui/hyperdrive/lp/AddLiquidityForm/AddLiquidityForm.tsx index dde2e4e4b..08e4fddcc 100644 --- a/apps/hyperdrive-trading/src/ui/hyperdrive/lp/AddLiquidityForm/AddLiquidityForm.tsx +++ b/apps/hyperdrive-trading/src/ui/hyperdrive/lp/AddLiquidityForm/AddLiquidityForm.tsx @@ -1,6 +1,8 @@ +import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { useConnectModal } from "@rainbow-me/rainbowkit"; import { ethers } from "ethers"; import { ReactElement } from "react"; +import { Link } from "react-router-dom"; import { Hyperdrive } from "src/appconfig/types"; import { parseUnits } from "src/base/parseUnits"; import { useNumericInput } from "src/ui/base/hooks/useNumericInput"; @@ -69,17 +71,28 @@ export function AddLiquidityForm({ return (
- {/* Amount Section */} -
-
Amount to add
- setAmount(newAmount)} - /> +
+
Add liquidity
+
+

Earn trading fees when users open long or shorts

+ + Learn More + + +
+ setAmount(newAmount)} + /> {/* New Position Section */}
diff --git a/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/OpenShortForm/OpenShortForm.tsx b/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/OpenShortForm/OpenShortForm.tsx index d63f70ef7..b16d1e6bb 100644 --- a/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/OpenShortForm/OpenShortForm.tsx +++ b/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/OpenShortForm/OpenShortForm.tsx @@ -1,6 +1,8 @@ +import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { useConnectModal } from "@rainbow-me/rainbowkit"; import { constants, ethers } from "ethers"; import { ReactElement } from "react"; +import { Link } from "react-router-dom"; import { Hyperdrive, Token } from "src/appconfig/types"; import { useNumericInput } from "src/ui/base/hooks/useNumericInput"; import { useMaxShort } from "src/ui/hyperdrive/shorts/hooks/useMaxShort"; @@ -82,16 +84,27 @@ export function OpenShortForm({ return (
- {/* You Pay Section */} -
-
Amount to short
- setAmount(newAmount)} - /> +
+
Open a short
+
+

Earn yield by shorting the current bond price

+ + Learn More + + +
+ setAmount(newAmount)} + /> {/* New Position Section */}