fix: truncate

yearn · Oct 10, 2023 · 2144096 · 2144096
1 parent 312db9a
commit 2144096
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/apps/vaults/components/details/actions/QuickActionsFrom.tsx b/apps/vaults/components/details/actions/QuickActionsFrom.tsx
@@ -66,9 +66,9 @@ export function VaultDetailsQuickActionsFrom(): ReactElement {
 					shouldRender={!hasMultipleInputsToChooseFrom}
 					fallback={renderMultipleOptionsFallback()}>
 					<div className={'flex h-10 w-full items-center justify-between bg-neutral-300 px-2 text-base text-neutral-900 md:w-56 md:px-3'}>
-						<div className={'relative flex flex-row items-center'}>
+						<div className={'relative flex flex-row items-center truncate'}>
 							<div className={'h-6 w-6 flex-none rounded-full'}>{selectedFromIcon}</div>
-							<p className={'overflow-x-hidden text-ellipsis whitespace-nowrap pl-2 font-normal text-neutral-900 scrollbar-none'}>{selectedFromSymbol}</p>
+							<p className={'truncate whitespace-nowrap pl-2 font-normal text-neutral-900 scrollbar-none'}>{selectedFromSymbol}</p>
 						</div>
 					</div>
 				</Renderable>

diff --git a/apps/vaults/components/details/actions/QuickActionsTo.tsx b/apps/vaults/components/details/actions/QuickActionsTo.tsx
@@ -46,11 +46,9 @@ export function VaultDetailsQuickActionsTo(): ReactElement {
 					shouldRender={!isActive || isDepositing || possibleOptionsTo.length === 1}
 					fallback={renderMultipleOptionsFallback()}>
 					<div className={'flex h-10 w-full items-center justify-between bg-neutral-300 px-2 text-base text-neutral-900 md:px-3'}>
-						<div className={'relative flex flex-row items-center'}>
+						<div className={'relative flex flex-row items-center truncate'}>
 							<div className={'h-6 w-6 flex-none rounded-full'}>{actionParams?.selectedOptionTo?.icon}</div>
-							<p className={'overflow-x-hidden text-ellipsis whitespace-nowrap pl-2 font-normal text-neutral-900 scrollbar-none'}>
-								{actionParams?.selectedOptionTo?.symbol}
-							</p>
+							<p className={'truncate whitespace-nowrap pl-2 font-normal text-neutral-900 scrollbar-none'}>{actionParams?.selectedOptionTo?.symbol}</p>
 						</div>
 					</div>
 				</Renderable>