fix

Author: nikkyeya

app/coins/[id]/page.tsx

@@ -92,14 +92,16 @@ const CoinDetails = async ({ params }: { params: Promise<{ id: string }> }) => {
                             {ticker.market.name}
                           </Link>
                         </TableCell>
-                        <TableCell className='exchange-pair'>
-                          <p className='truncate max-w-[100px]'>
-                            {ticker.base}
-                          </p>
-                          /
-                          <p className='truncate max-w-[100px] ml-2'>
-                            {ticker.target}
-                          </p>
+                        <TableCell>
+                          <div className='exchange-pair'>
+                            <p className='truncate max-w-[100px] h-full'>
+                              {ticker.base}
+                            </p>
+                            /
+                            <p className='truncate max-w-[100px] h-full ml-2'>
+                              {ticker.target}
+                            </p>
+                          </div>
                         </TableCell>
                         <TableCell className='font-medium'>
                           {formatPrice(ticker.converted_last.usd)}

app/globals.css

@@ -271,11 +271,11 @@
   }
 
   .exchange-link {
-    @apply py-4 pl-3 block max-w-[110px] truncate;
+    @apply py-4 pl-3 block w-full max-w-[230px] truncate whitespace-pre-wrap;
   }
 
   .exchange-pair {
-    @apply font-medium flex py-4 pr-5;
+    @apply font-medium h-full flex py-4 pr-5;
   }
 
   .exchange-timestamp {