ui: fix table cols for dark theme

frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx

@@ -1,9 +1,8 @@
 import React from 'react';
-import { Table, Tooltip } from 'antd';
+import { Table, Tooltip, Dropdown } from 'antd';
 import type { TableProps } from 'antd';
 import Widget from 'App/mstore/types/widget';
 import Funnel from 'App/mstore/types/funnel';
-import { ItemMenu } from 'UI';
 import { EllipsisVertical } from 'lucide-react';
 import { exportAntCsv } from '../../../utils';
 import { useTranslation } from 'react-i18next';
@@ -111,19 +110,20 @@ export function TableExporter({
   const { t } = useTranslation();
   const onClick = () => exportAntCsv(tableColumns, tableData, filename);
   return (
-    <Tooltip title={t('Export Data to CSV')}>
-      <div className={`absolute ${top || 'top-0'} ${right || '-right-1'}`}>
-        <ItemMenu
-          items={[{ icon: 'download', text: 'Export to CSV', onClick }]}
-          bold
-          customTrigger={
-            <div className="flex items-center justify-center bg-gradient-to-r from-[#fafafa] to-neutral-200 cursor-pointer rounded-lg h-[38px]	w-[38px] btn-export-table-data">
-              <EllipsisVertical size={16} />
-            </div>
-          }
-        />
-      </div>
-    </Tooltip>
+    <div
+      className={`absolute ${top || 'top-0'} ${right || '-right-1'}`}
+      style={{ zIndex: 10 }}
+    >
+      <Dropdown
+        menu={{
+          items: [{ key: 'download', label: 'Export to CSV', onClick }],
+        }}
+      >
+        <div className="flex items-center justify-center bg-gray-lighter cursor-pointer rounded-lg h-[38px]	w-[38px] btn-export-table-data">
+          <EllipsisVertical size={16} />
+        </div>
+      </Dropdown>
+    </div>
   );
 }
 

frontend/app/initialize.tsx

@@ -98,8 +98,9 @@ const ThemedApp: React.FC = () => {
         colorBorderSecondary: cssVar('gray-light'),
         headerBg: cssVar('gray-lightest'),
         rowHoverBg: cssVar('gray-lightest'),
-        headerSortHoverBg: cssVar('gray-lighter'),
-        headerSortActiveBg: cssVar('gray-lighter')
+        headerSortHoverBg: cssVar('gray-light'),
+        headerSortActiveBg: cssVar('gray-light'),
+        fixedHeaderSortActiveBg: cssVar('gray-light'),
       },
       Modal: {
         colorBgElevated: cssVar('white'),
@@ -120,8 +121,8 @@ const ThemedApp: React.FC = () => {
       },
       Tag: {
         defaultBg: cssVar('gray-lightest'),
-        defaultColor: cssVar('gray-darkest')
-      }
+        defaultColor: cssVar('gray-darkest'),
+      },
     },
     token: {
       colorPrimary: cssVar('main'),
@@ -143,7 +144,7 @@ const ThemedApp: React.FC = () => {
       fontSize: 14,
       fontFamily: "'Roboto', 'ArialMT', 'Arial'",
       fontWeightStrong: 400,
-      colorSplit: cssVar('gray-light')
+      colorSplit: cssVar('gray-light'),
     },
   };