jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: fix table cols for dark theme

Browse source
This commit is contained in:
nick-delirium 2025-05-26 13:58:53 +02:00
parent be9ef3bd18
commit effee41321
No known key found for this signature in database
GPG key ID: 93ABD695DF5FDBA0
2 changed files with 21 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx
View file

@ -1,9 +1,8 @@
import React from 'react'; import React from 'react';
import { Table, Tooltip } from 'antd'; import { Table, Tooltip, Dropdown } from 'antd';
import type { TableProps } from 'antd'; import type { TableProps } from 'antd';
import Widget from 'App/mstore/types/widget'; import Widget from 'App/mstore/types/widget';
import Funnel from 'App/mstore/types/funnel'; import Funnel from 'App/mstore/types/funnel';
import { ItemMenu } from 'UI';
import { EllipsisVertical } from 'lucide-react'; import { EllipsisVertical } from 'lucide-react';
import { exportAntCsv } from '../../../utils'; import { exportAntCsv } from '../../../utils';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -111,19 +110,20 @@ export function TableExporter({
const { t } = useTranslation(); const { t } = useTranslation();
const onClick = () => exportAntCsv(tableColumns, tableData, filename); const onClick = () => exportAntCsv(tableColumns, tableData, filename);
return ( return (
<Tooltip title={t('Export Data to CSV')}> <div
<div className={`absolute ${top || 'top-0'} ${right || '-right-1'}`}> className={`absolute ${top || 'top-0'} ${right || '-right-1'}`}
<ItemMenu style={{ zIndex: 10 }}
items={[{ icon: 'download', text: 'Export to CSV', onClick }]} >
bold <Dropdown
customTrigger={ menu={{
<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"> items: [{ key: 'download', label: 'Export to CSV', onClick }],
<EllipsisVertical size={16} /> }}
</div> >
} <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> </div>
</Tooltip> </Dropdown>
</div>
); );
} }

11
frontend/app/initialize.tsx
View file

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