ui fix
This commit is contained in:
@@ -125,15 +125,15 @@ const NotificationsTab = () => {
|
||||
return details.message ? <p className="text-sm text-gray-600 dark:text-gray-400">{details.message}</p> : null;
|
||||
};
|
||||
|
||||
const filterOptions: { id: FilterType; label: string; icon: string }[] = [
|
||||
{ id: 'all', label: 'All Notifications', icon: 'i-ph:bell' },
|
||||
{ id: 'system', label: 'System', icon: 'i-ph:gear' },
|
||||
{ id: 'update', label: 'Updates', icon: 'i-ph:arrow-circle-up' },
|
||||
{ id: 'error', label: 'Errors', icon: 'i-ph:warning-circle' },
|
||||
{ id: 'warning', label: 'Warnings', icon: 'i-ph:warning' },
|
||||
{ id: 'info', label: 'Information', icon: 'i-ph:info' },
|
||||
{ id: 'provider', label: 'Providers', icon: 'i-ph:robot' },
|
||||
{ id: 'network', label: 'Network', icon: 'i-ph:wifi-high' },
|
||||
const filterOptions: { id: FilterType; label: string; icon: string; color: string }[] = [
|
||||
{ id: 'all', label: 'All Notifications', icon: 'i-ph:bell', color: '#9333ea' },
|
||||
{ id: 'system', label: 'System', icon: 'i-ph:gear', color: '#6b7280' },
|
||||
{ id: 'update', label: 'Updates', icon: 'i-ph:arrow-circle-up', color: '#9333ea' },
|
||||
{ id: 'error', label: 'Errors', icon: 'i-ph:warning-circle', color: '#ef4444' },
|
||||
{ id: 'warning', label: 'Warnings', icon: 'i-ph:warning', color: '#f59e0b' },
|
||||
{ id: 'info', label: 'Information', icon: 'i-ph:info', color: '#3b82f6' },
|
||||
{ id: 'provider', label: 'Providers', icon: 'i-ph:robot', color: '#10b981' },
|
||||
{ id: 'network', label: 'Network', icon: 'i-ph:wifi-high', color: '#6366f1' },
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -153,10 +153,8 @@ const NotificationsTab = () => {
|
||||
)}
|
||||
>
|
||||
<span
|
||||
className={classNames(
|
||||
filterOptions.find((opt) => opt.id === filter)?.icon || 'i-ph:funnel',
|
||||
'text-lg text-gray-500 dark:text-gray-400',
|
||||
)}
|
||||
className={classNames('text-lg', filterOptions.find((opt) => opt.id === filter)?.icon || 'i-ph:funnel')}
|
||||
style={{ color: filterOptions.find((opt) => opt.id === filter)?.color }}
|
||||
/>
|
||||
{filterOptions.find((opt) => opt.id === filter)?.label || 'Filter Notifications'}
|
||||
<span className="i-ph:caret-down text-lg text-gray-500 dark:text-gray-400" />
|
||||
@@ -165,7 +163,7 @@ const NotificationsTab = () => {
|
||||
|
||||
<DropdownMenu.Portal>
|
||||
<DropdownMenu.Content
|
||||
className="min-w-[200px] bg-white dark:bg-gray-800 rounded-lg shadow-lg py-1 z-[250] animate-in fade-in-0 zoom-in-95"
|
||||
className="min-w-[200px] bg-white dark:bg-[#0A0A0A] rounded-lg shadow-lg py-1 z-[250] animate-in fade-in-0 zoom-in-95 border border-[#E5E5E5] dark:border-[#1A1A1A]"
|
||||
sideOffset={5}
|
||||
align="start"
|
||||
side="bottom"
|
||||
@@ -178,10 +176,8 @@ const NotificationsTab = () => {
|
||||
>
|
||||
<div className="mr-3 flex h-5 w-5 items-center justify-center">
|
||||
<div
|
||||
className={classNames(
|
||||
option.icon,
|
||||
'text-gray-500 dark:text-gray-400 group-hover:text-purple-500 transition-colors',
|
||||
)}
|
||||
className={classNames(option.icon, 'text-lg group-hover:text-purple-500 transition-colors')}
|
||||
style={{ color: option.color }}
|
||||
/>
|
||||
</div>
|
||||
<span className="group-hover:text-purple-500 transition-colors">{option.label}</span>
|
||||
|
||||
Reference in New Issue
Block a user