More improvements

frontend/app/components/Assist/components/SessionList/SessionList.tsx

@@ -40,7 +40,7 @@ function SessionList(props: Props) {
                         <div className="flex items-center justify-center flex-col">
                             <AnimatedSVG name={ICONS.NO_LIVE_SESSIONS} size={60} />
                             <div className="mt-4" />
-                            <div className="text-center text-lg font-medium">No live sessions found</div>
+                            <div className="text-center text-lg font-medium">No live sessions found.</div>
                         </div>
                     }
                 >

frontend/app/components/Dashboard/Widgets/PredefinedWidgets/CallWithErrors/MethodType.js

@@ -3,7 +3,7 @@ import { Tag } from 'antd';
 
 const MethodType = ({ data }) => {
   return (
-    <Tag bordered={false} className="rounded-lg">
+    <Tag bordered={false} className="rounded-lg bg-indigo-50">
       {data.method}
     </Tag>
   );

frontend/app/components/Dashboard/Widgets/PredefinedWidgets/CallWithErrors/callWithErrors.module.css

@@ -19,4 +19,5 @@
   &:hover {
     border: solid thin $gray-light !important;
   }
-}
+}
+

frontend/app/components/Dashboard/components/Alerts/AlertsList.tsx

@@ -38,7 +38,7 @@ function AlertsList({ siteId }: Props) {
           <div className='flex flex-col items-center justify-center'>
             <AnimatedSVG name={ICONS.NO_ALERTS} size={60} />
             <div className='text-center mt-4  text-lg font-medium'>
-              {alertsSearch !== '' ? 'No matching results' : 'You haven\'t created any alerts yet'}
+              {alertsSearch !== '' ? 'No matching results' : 'No alerts have been configured yet'}
             </div>
           </div>
         }

frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx

@@ -76,8 +76,8 @@ function DashboardList({ siteId }: { siteId: string }) {
     const emptyDescription = dashboardsSearch !== '' ? (
         <div className="text-center">
             <div>
-                <Typography.Text className="my-2 text-xl font-medium">
-                    No search results found.
+                <Typography.Text className="my-2 text-lg font-medium">
+                No matching results
                 </Typography.Text>
                 <div className="mb-2 text-lg text-gray-500 mt-2 leading-normal">
                     Try adjusting your search criteria or creating a new dashboard.

frontend/app/components/Dashboard/components/DashboardList/NewDashModal/Examples/CallsWithErrorsExample.tsx

@@ -15,7 +15,7 @@ function CallsWithErrorsExample(props: Props) {
         <ExCard
             {...props}
         >
-            <CallWithErrors data={props.data}/>
+            <div className='eg-card'><CallWithErrors data={props.data}/></div>
         </ExCard>
     );
 }

frontend/app/components/Funnels/FunnelWidget/FunnelBar.tsx

@@ -124,7 +124,7 @@ export function UxTFunnelBar(props: Props) {
               {durationFormatted(filter.avgCompletionTime)}
             </span>
             <span>
-              Avg. completion time
+              avg. completion time
             </span>
           </div>
         </div>

frontend/app/components/Funnels/FunnelWidget/FunnelWidget.tsx

@@ -52,8 +52,8 @@ function FunnelWidget(props: Props) {
         <NoContent
             style={{ minHeight: 220 }}
             title={
-                <div className="flex items-center">
-                    <Icon name="info-circle" className="mr-2" size="14" />
+                <div className="flex items-center text-lg">
+                    <Icon name="info-circle" className="mr-2" size="18" />
                     No data available for the selected period.
                 </div>
             }

frontend/app/components/UsabilityTesting/ResponsesOverview.tsx

@@ -98,7 +98,7 @@ const ResponsesOverview = observer(() => {
       </div>
       <div className={'grid grid-cols-9 border-b py-1'}>
         <div className={'col-span-1'}>
-          <Typography.Text strong># Response</Typography.Text>
+          <Typography.Text strong>#</Typography.Text>
         </div>
         <div className={'col-span-2'}>
           <Typography.Text strong>Participant</Typography.Text>

frontend/app/components/UsabilityTesting/TestEdit.tsx

@@ -443,13 +443,13 @@ export function Step({
     description && description?.length > 300 ? description.slice(0, 300) + '...' : description;
   return (
     <div
-      className={`p-4 rounded border ${
-        hover ? 'bg-white hover:' : ''
-      }bg-active-blue flex items-start gap-2`}
+      className={`p-4 rounded-lg  ${
+        hover ? 'bg-white hover:border hover:border-indigo-500' : ''
+      }bg-active-blue flex items-start gap-2 shadow-sm`}
     >
       <div
         style={{ minWidth: '1.5rem' }}
-        className={'w-6 h-6 bg-white rounded-full border flex items-center justify-center'}
+        className={'w-6 h-6 bg-white rounded-full flex items-center justify-center'}
       >
         {ind + 1}
       </div>

frontend/app/components/UsabilityTesting/TestOverview.tsx

@@ -333,7 +333,8 @@ const TaskSummary = observer(() => {
         <Typography.Title level={5}>Task Summary</Typography.Title>
 
         {uxtestingStore.taskStats.length ? (
-          <div className={'p-2 rounded bg-teal-light flex items-center gap-1'}>
+          <div className={'p-2 rounded-lg bg-indigo-50  flex items-center gap-1 px-4'}>
+            <ClockCircleOutlined rev={undefined} />
             <Typography.Text>Average completion time of all tasks:</Typography.Text>
             <Typography.Text strong>
               {uxtestingStore.taskStats
@@ -345,7 +346,7 @@ const TaskSummary = observer(() => {
                 )
                 : null}
             </Typography.Text>
-            <ClockCircleOutlined rev={undefined} />
+            
           </div>
         ) : null}
       </div>

frontend/app/components/UsabilityTesting/UsabilityTesting.tsx

@@ -131,15 +131,17 @@ function TestsTable() {
               <div className={'flex flex-col items-center justify-center mt-10'}>
                 {uxtestingStore.searchQuery === '' ? (
                   <AnimatedSVG name={ICONS.NO_UXT} size={172} />
-                ) : null}
+                ) : (
+                  <AnimatedSVG name={ICONS.NO_RESULTS} size={60} />
+                )}
                 <div className={'text-lg font-medium mt-4'}>
                   {uxtestingStore.searchQuery === ''
-                    ? 'Uncover real user insights through usability tests.'
-                    : 'No results matching your search'}
+                    ? 'Uncover real user insights through usability tests'
+                    : 'No matching results'}
                 </div>
                 <div className="text-center text-gray-600">
                   {uxtestingStore.searchQuery === ''
-                    ? 'Conduct summative testing to observe task completion and iterate your product.'
+                    ? 'Conduct summative usability testing to observe task completion and iterate your product.'
                     : ''}
                 </div>
               </div>

frontend/app/components/shared/SelectDateRange/SelectDateRange.tsx

@@ -72,7 +72,7 @@ function SelectDateRange(props: Props) {
 
     return (
       <div className={'relative'}>
-        <Dropdown menu={menuProps}>
+        <Dropdown menu={menuProps} >
           {useButtonStyle ? (
             <Button type='text'>
               <span>{isCustomRange ? customRange : selectedValue?.label}</span>

frontend/app/components/shared/SessionsTabOverview/components/SessionList/SessionDateRange.tsx

@@ -21,7 +21,7 @@ function SessionDateRange(props: Props) {
   return (
     <div className="flex items-center">
       <span className="mr-1">No sessions {isCustom ? 'between' : 'in the'}</span>
-      <div className="border-0 rounded-lg"><SelectDateRange period={period} onChange={onDateChange} right={true} /></div>
+      <div className="rounded-lg border"><SelectDateRange period={period} onChange={onDateChange} right={true} /></div>
     </div>
   );
 }

frontend/app/styles/general.css

@@ -421,3 +421,7 @@ p {
   box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
 }
 
+
+.eg-card input[name="search"] {
+  visibility: hidden !important;
+}