chore: evaluation modal style fixes (#305)

latitude-dev · Sep 29, 2024 · afa1485 · afa1485
1 parent ec11c19
commit afa1485
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 14 deletions.
diff --git a/...ntUuid]/evaluations/dashboard/connect/_components/ConnectEvaluationModal/Editor/index.tsx b/...ntUuid]/evaluations/dashboard/connect/_components/ConnectEvaluationModal/Editor/index.tsx
@@ -3,7 +3,7 @@ import React, { ReactNode, useEffect, useState } from 'react'
 import { Text } from '@latitude-data/web-ui'
 
 const className =
-  'flex-1 min-h-[450px] min-w-0 rounded-lg border bg-muted flex flex-col'
+  'flex-1 min-h-[450px] max-h-[580px] min-w-0 rounded-lg border bg-muted flex flex-col'
 
 interface TabsProps {
   children: ReactNode
@@ -81,14 +81,15 @@ export default function EvaluationEditor({
     return (
       <div className={className}>
         <textarea
-          className='w-full h-full p-4 bg-muted text-foregound text-sm resize-none'
+          className='w-full h-full p-4 bg-muted text-foregound text-sm resize-none overflow-x-auto '
           value={
             items[0]!.type === 'evaluation'
               ? items[0]!.data.metadata.prompt
               : items[0]!.data.prompt
           }
           readOnly
           disabled
+          wrap='off'
         />
       </div>
     )
@@ -117,14 +118,15 @@ export default function EvaluationEditor({
               activeTab === item.uuid && (
                 <textarea
                   key={item.uuid}
-                  className='w-full h-full p-4 bg-muted text-foregound text-sm resize-none'
+                  className='w-full h-full p-4 bg-muted text-foregound text-sm resize-none overflow-x-auto '
                   value={
                     item.type === 'evaluation'
                       ? item.data.metadata.prompt
                       : item.data.prompt
                   }
                   readOnly
                   disabled
+                  wrap='off'
                 />
               ),
           )}

diff --git a/...mentUuid]/evaluations/dashboard/connect/_components/ConnectEvaluationModal/List/index.tsx b/...mentUuid]/evaluations/dashboard/connect/_components/ConnectEvaluationModal/List/index.tsx
@@ -23,7 +23,7 @@ export default function EvaluationList({
   onSearchChange,
 }: EvaluationListProps) {
   return (
-    <div className='w-1/3'>
+    <div className='w-1/2'>
       <Input
         type='text'
         placeholder='Search evaluations and templates...'

diff --git a/packages/web-ui/src/ds/molecules/SelectableCard/index.tsx b/packages/web-ui/src/ds/molecules/SelectableCard/index.tsx
@@ -30,18 +30,12 @@ export function SelectableCard({
         </div>
       )}
       <div className='w-full flex flex-col gap-1'>
-        <Text.H5M ellipsis noWrap color={selected ? 'primary' : 'foreground'}>
-          {title}
+        <Text.H5M color={selected ? 'primary' : 'foreground'}>
+          {title.length > 30 ? `${title.slice(0, 30)}...` : title}
         </Text.H5M>
         {description.length > 0 && (
-          <Text.H6
-            ellipsis
-            noWrap
-            color={selected ? 'accentForeground' : 'foregroundMuted'}
-          >
-            {description.length > 45
-              ? `${description.slice(0, 42)}...`
-              : description}
+          <Text.H6 color={selected ? 'accentForeground' : 'foregroundMuted'}>
+            {description}
           </Text.H6>
         )}
       </div>