From 7693fa9ea48e65a43f9b2b2f4304846c122bbb0f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dani=C3=ABl=20van=20der=20Winden?= Date: Thu, 10 Oct 2024 10:52:17 +0100 Subject: [PATCH] Updated ListItem and TableRow Set the background for hover states to lightgrey, instead of a gradient. --- apps/admin-x-design-system/src/global/ListItem.tsx | 2 +- apps/admin-x-design-system/src/global/TableRow.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/admin-x-design-system/src/global/ListItem.tsx b/apps/admin-x-design-system/src/global/ListItem.tsx index 0fe08e2861..71224d7942 100644 --- a/apps/admin-x-design-system/src/global/ListItem.tsx +++ b/apps/admin-x-design-system/src/global/ListItem.tsx @@ -43,7 +43,7 @@ const ListItem: React.FC = ({ const listItemClasses = clsx( 'group/list-item flex items-center justify-between', - bgOnHover && '-mx-6 rounded-lg px-6 hover:bg-grey-50 dark:hover:bg-grey-950', + bgOnHover && '-mx-4 px-4 hover:bg-grey-50 dark:hover:bg-grey-950', separator ? 'border-b border-grey-100 last-of-type:border-b-transparent hover:border-grey-200 dark:border-grey-900 dark:hover:border-grey-800' : 'border-y border-transparent hover:border-grey-200 first-of-type:hover:border-t-transparent dark:hover:border-grey-800', className ); diff --git a/apps/admin-x-design-system/src/global/TableRow.tsx b/apps/admin-x-design-system/src/global/TableRow.tsx index 7e40a3f502..94c2b7abb2 100644 --- a/apps/admin-x-design-system/src/global/TableRow.tsx +++ b/apps/admin-x-design-system/src/global/TableRow.tsx @@ -1,7 +1,7 @@ import clsx from 'clsx'; import React, {forwardRef} from 'react'; -export const tableRowHoverBgClasses = 'hover:bg-gradient-to-r hover:from-white hover:to-grey-50 dark:hover:from-black dark:hover:to-grey-950'; +export const tableRowHoverBgClasses = '-mx-4 px-4 hover:bg-grey-50 dark:hover:bg-grey-950'; export interface TableRowProps { id?: string;