chpark/vexplor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

표 css 통일, 라벨링

Browse Source
This commit is contained in:
leeheejin
2025-09-30 18:42:33 +09:00
parent d861eb5196
commit 8c437270a8
14 changed files with 35 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/lib/registry/components/table-list/SingleTableWithSticky.tsx
View File

@@ -87,7 +87,7 @@ export const SingleTableWithSticky: React.FC<SingleTableWithStickyProps> = ({
? "h-12 border-0 px-4 py-3 text-center align-middle"
: "h-12 cursor-pointer border-0 px-4 py-3 text-left align-middle font-semibold whitespace-nowrap text-slate-700 select-none transition-all duration-200",
`text-${column.align}`,
column.sortable && "hover:bg-blue-50/50 hover:text-blue-700",
column.sortable && "hover:bg-orange-50 hover:text-orange-700",
// 고정 컬럼 스타일
column.fixed === "left" && "sticky z-10 border-r border-gray-200/60 bg-gradient-to-r from-slate-50 to-blue-50/30 shadow-sm",
column.fixed === "right" && "sticky z-10 border-l border-gray-200/60 bg-gradient-to-r from-slate-50 to-blue-50/30 shadow-sm",
@@ -117,16 +117,12 @@ export const SingleTableWithSticky: React.FC<SingleTableWithStickyProps> = ({
<span className="flex-1 truncate">
{columnLabels[column.columnName] || column.displayName || column.columnName}
</span>
{column.sortable && (
{column.sortable && sortColumn === column.columnName && (
<span className="ml-2 flex h-5 w-5 items-center justify-center rounded-md bg-white/50 shadow-sm">
{sortColumn === column.columnName ? (
sortDirection === "asc" ? (
<ArrowUp className="h-3.5 w-3.5 text-blue-600" />
) : (
<ArrowDown className="h-3.5 w-3.5 text-blue-600" />
)
{sortDirection === "asc" ? (
<ArrowUp className="h-3.5 w-3.5 text-blue-600" />
) : (
<ArrowUpDown className="h-3.5 w-3.5 text-gray-400" />
<ArrowDown className="h-3.5 w-3.5 text-blue-600" />
)}
</span>
)}

14
frontend/lib/registry/components/table-list/TableListComponent.tsx
View File

@@ -1324,7 +1324,7 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
{/* 헤더 */}
{tableConfig.showHeader && (
<div
className="flex items-center justify-between border-b border-gray-200 bg-gray-100/80 px-6 py-4"
className="flex items-center justify-between border-b border-gray-200 bg-gray-100 px-6 py-4"
style={{
width: "100%",
maxWidth: "100%",
@@ -1532,16 +1532,12 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
) : (
<div className="flex items-center space-x-2">
<span>{columnLabels[column.columnName] || column.displayName}</span>
{column.sortable && (
{column.sortable && sortColumn === column.columnName && (
<div className="flex flex-col">
{sortColumn === column.columnName ? (
sortDirection === "asc" ? (
<ArrowUp className="h-3 w-3 text-blue-600" />
) : (
<ArrowDown className="h-3 w-3 text-blue-600" />
)
{sortDirection === "asc" ? (
<ArrowUp className="h-3 w-3 text-blue-600" />
) : (
<ArrowUpDown className="h-3 w-3 text-gray-400" />
<ArrowDown className="h-3 w-3 text-blue-600" />
)}
</div>
)}