From ae7e497fe07b48d6f5f42491e2997a30dd4796cd Mon Sep 17 00:00:00 2001 From: Mark Date: Sat, 14 Mar 2026 19:20:29 -0700 Subject: [PATCH] style: polish data table UI with glassmorphism toolbar, rounded controls, and zebra-striped rows Made-with: Cursor --- .../app/components/workspace/data-table.tsx | 276 ++++++++++++------ apps/web/tsconfig.tsbuildinfo | 1 - 2 files changed, 191 insertions(+), 86 deletions(-) delete mode 100644 apps/web/tsconfig.tsbuildinfo diff --git a/apps/web/app/components/workspace/data-table.tsx b/apps/web/app/components/workspace/data-table.tsx index 18f2cb7bee8..564c58dfc61 100644 --- a/apps/web/app/components/workspace/data-table.tsx +++ b/apps/web/app/components/workspace/data-table.tsx @@ -40,6 +40,7 @@ import { DropdownMenuSeparator, DropdownMenuCheckboxItem, } from "../ui/dropdown-menu"; +import { cn } from "@/lib/utils"; /* ─── Types ─── */ @@ -384,11 +385,11 @@ export function DataTable({ // ─── Render ─── return ( -
+
{/* Toolbar */}
{title && (
@@ -401,8 +402,11 @@ export function DataTable({ {/* Search */} {enableGlobalFilter && ( -
- +
+ ({ onServerSearch?.(e.target.value); }} placeholder={searchPlaceholder} - className="w-full pl-8 pr-3 py-1 text-xs rounded-md outline-none" - style={{ - background: "var(--color-surface)", - color: "var(--color-text)", - border: "1px solid var(--color-border)", - }} + className="w-full h-full text-xs bg-transparent outline-none border-0 p-0" + style={{ color: "var(--color-text)" }} /> {globalFilter && ( + )} + {/* Add button */} {onAdd && (