Thinner small rows

Author: benjaminleonard

app/pages/system/networking/IpPoolsPage.tsx

@@ -112,6 +112,7 @@ export default function IpPoolsPage() {
   const { table, query } = useQueryTable({
     query: ipPoolList(),
     columns,
+    rowHeight: 'large',
     emptyState: <EmptyState />,
   })
   const { data: pools } = query

app/ui/lib/DateTime.tsx

@@ -9,7 +9,7 @@
 import { toLocaleDateString, toLocaleTimeString } from '~/util/date'
 
 export const DateTime = ({ date, locale }: { date: Date; locale?: string }) => (
-  <time dateTime={date.toISOString()} className="flex flex-wrap gap-x-1">
+  <time dateTime={date.toISOString()} className="flex gap-x-1">
     <span>{toLocaleDateString(date, locale)}</span>
     <span className="text-tertiary">{toLocaleTimeString(date, locale)}</span>
   </time>

app/ui/lib/Table.tsx

@@ -104,8 +104,8 @@ Table.Cell = ({ height = 'small', className, children, ...props }: TableCellProp
   >
     <div
       className={cn(
-        'relative -my-[1px] -mr-[2px] flex items-center border-b border-l p-3 border-secondary',
-        { 'h-12': height === 'small', 'h-16': height === 'large' }
+        'relative -my-[1px] -mr-[2px] flex items-center border-b border-l px-3 py-2 border-secondary',
+        { 'h-11': height === 'small', 'h-14': height === 'large' }
       )}
     >
       {children}