mirror of
https://github.com/apache/superset.git
synced 2026-06-02 06:09:21 +00:00
feat(theming): land Ant Design v5 overhaul — dynamic themes, real dark mode + massive styling refactor (#31590)
Co-authored-by: Enzo Martellucci <52219496+EnxDev@users.noreply.github.com> Co-authored-by: Diego Pucci <diegopucci.me@gmail.com> Co-authored-by: Mehmet Salih Yavuz <salih.yavuz@proton.me> Co-authored-by: Geido <60598000+geido@users.noreply.github.com> Co-authored-by: Alexandru Soare <37236580+alexandrusoare@users.noreply.github.com> Co-authored-by: Damian Pendrak <dpendrak@gmail.com> Co-authored-by: Pius Iniobong <67148161+payose@users.noreply.github.com> Co-authored-by: Enzo Martellucci <enzomartellucci@gmail.com> Co-authored-by: Kamil Gabryjelski <kamil.gabryjelski@gmail.com>
This commit is contained in:
committed by
GitHub
parent
2cc1ef88c8
commit
dd129fa403
@@ -22,7 +22,7 @@ import {
|
||||
userEvent,
|
||||
waitFor,
|
||||
} from 'spec/helpers/testing-library';
|
||||
import { Menu } from 'src/components/Menu';
|
||||
import { Menu } from '@superset-ui/core/components/Menu';
|
||||
import DashboardItems from './DashboardsSubMenu';
|
||||
|
||||
const asyncRender = (numberOfItems: number) => {
|
||||
|
||||
@@ -18,9 +18,9 @@
|
||||
*/
|
||||
import { useState } from 'react';
|
||||
import { css, t, useTheme } from '@superset-ui/core';
|
||||
import { Input } from 'src/components/Input';
|
||||
import { Icons } from 'src/components/Icons';
|
||||
import { Menu } from 'src/components/Menu';
|
||||
import { Input } from '@superset-ui/core/components';
|
||||
import { Icons } from '@superset-ui/core/components/Icons';
|
||||
import { Menu } from '@superset-ui/core/components/Menu';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
export interface DashboardsSubMenuProps {
|
||||
@@ -60,7 +60,7 @@ const DashboardsSubMenu = ({
|
||||
prefix={<Icons.StarOutlined iconSize="l" />}
|
||||
css={css`
|
||||
width: ${WIDTH}px;
|
||||
margin: ${theme.gridUnit * 2}px ${theme.gridUnit * 3}px;
|
||||
margin: ${theme.sizeUnit * 2}px ${theme.sizeUnit * 3}px;
|
||||
`}
|
||||
value={dashboardSearch}
|
||||
onChange={e => setDashboardSearch(e.currentTarget.value)}
|
||||
@@ -106,7 +106,7 @@ const DashboardsSubMenu = ({
|
||||
<Icons.Full
|
||||
iconSize="l"
|
||||
css={css`
|
||||
margin-left: ${theme.gridUnit * 2}px;
|
||||
margin-left: ${theme.sizeUnit * 2}px;
|
||||
visibility: ${hoveredItem === dashboard.id
|
||||
? 'visible'
|
||||
: 'hidden'};
|
||||
@@ -119,8 +119,8 @@ const DashboardsSubMenu = ({
|
||||
{noResultsFound && (
|
||||
<div
|
||||
css={css`
|
||||
margin-left: ${theme.gridUnit * 3}px;
|
||||
margin-bottom: ${theme.gridUnit}px;
|
||||
margin-left: ${theme.sizeUnit * 3}px;
|
||||
margin-bottom: ${theme.sizeUnit}px;
|
||||
`}
|
||||
>
|
||||
{t('No results found')}
|
||||
|
||||
@@ -27,10 +27,8 @@ import {
|
||||
useTheme,
|
||||
VizType,
|
||||
} from '@superset-ui/core';
|
||||
import { Icons } from 'src/components/Icons';
|
||||
import { Menu } from 'src/components/Menu';
|
||||
import ModalTrigger from 'src/components/ModalTrigger';
|
||||
import Button from 'src/components/Button';
|
||||
import { Icons, ModalTrigger, Button } from '@superset-ui/core/components';
|
||||
import { Menu } from '@superset-ui/core/components/Menu';
|
||||
import { useToasts } from 'src/components/MessageToasts/withToasts';
|
||||
import { exportChart, getChartKey } from 'src/explore/exploreUtils';
|
||||
import downloadAsImage from 'src/utils/downloadAsImage';
|
||||
@@ -79,25 +77,25 @@ export const MenuItemWithCheckboxContainer = styled.div`
|
||||
align-items: center;
|
||||
|
||||
& svg {
|
||||
width: ${theme.gridUnit * 3}px;
|
||||
height: ${theme.gridUnit * 3}px;
|
||||
width: ${theme.sizeUnit * 3}px;
|
||||
height: ${theme.sizeUnit * 3}px;
|
||||
}
|
||||
|
||||
& span[role='checkbox'] {
|
||||
display: inline-flex;
|
||||
margin-right: ${theme.gridUnit}px;
|
||||
margin-right: ${theme.sizeUnit}px;
|
||||
}
|
||||
`}
|
||||
`;
|
||||
|
||||
export const MenuTrigger = styled(Button)`
|
||||
${({ theme }) => css`
|
||||
width: ${theme.gridUnit * 8}px;
|
||||
height: ${theme.gridUnit * 8}px;
|
||||
width: ${theme.sizeUnit * 8}px;
|
||||
height: ${theme.sizeUnit * 8}px;
|
||||
padding: 0;
|
||||
border: 1px solid ${theme.colors.primary.dark2};
|
||||
|
||||
&.antd5-btn > span.anticon {
|
||||
&.ant-btn > span.anticon {
|
||||
line-height: 0;
|
||||
transition: inherit;
|
||||
}
|
||||
@@ -388,7 +386,7 @@ export const useExploreAdditionalActionsMenu = (
|
||||
addDangerToast={addDangerToast}
|
||||
/>
|
||||
}
|
||||
maxWidth={`${theme.gridUnit * 100}px`}
|
||||
maxWidth={`${theme.sizeUnit * 100}px`}
|
||||
destroyOnClose
|
||||
responsive
|
||||
/>
|
||||
@@ -449,7 +447,7 @@ export const useExploreAdditionalActionsMenu = (
|
||||
latestQueryFormData,
|
||||
showReportSubMenu,
|
||||
slice,
|
||||
theme.gridUnit,
|
||||
theme.sizeUnit,
|
||||
],
|
||||
);
|
||||
return [menu, isDropdownVisible, setIsDropdownVisible];
|
||||
|
||||
Reference in New Issue
Block a user