diff --git a/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss b/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss index fa477c337..ce57bb3da 100644 --- a/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss +++ b/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss @@ -27,7 +27,6 @@ } } - .item { outline: 0; cursor: default; @@ -61,6 +60,13 @@ border-radius: 3px; background-color: $gray-1000; } + + &[data-type='destructive'] { + color: $red-500; + svg { + color: $red-500; + } + } } .separator { diff --git a/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx b/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx index 9181871fd..2c97fb107 100644 --- a/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx +++ b/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx @@ -6,7 +6,7 @@ import style from './DropdownMenu.module.scss'; type DropdownMenuItemDivider = { type: 'divider' }; type DropdownMenuItem = { - type: 'item'; + type: 'item' | 'destructive'; label: string; icon?: IconType; disabled?: boolean; @@ -31,7 +31,7 @@ export function DropdownMenu({ items, children, ...triggerProps }: PropsWithChil return ; } return ( - + {item.icon && } {item.label}