mirror of https://github.com/apache/superset.git
fix: Unwinds icon fallout that came along with filters PR (#11474)
* Unwinds icon revamp that came along with filters PR. * cleanup/linting * removing unused import
This commit is contained in:
parent
18658f45be
commit
e024267447
|
@ -17,7 +17,6 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import React, { SVGProps } from 'react';
|
import React, { SVGProps } from 'react';
|
||||||
import { styled } from '@superset-ui/core';
|
|
||||||
|
|
||||||
import { ReactComponent as AlertSolidIcon } from 'images/icons/alert_solid.svg';
|
import { ReactComponent as AlertSolidIcon } from 'images/icons/alert_solid.svg';
|
||||||
import { ReactComponent as AlertIcon } from 'images/icons/alert.svg';
|
import { ReactComponent as AlertIcon } from 'images/icons/alert.svg';
|
||||||
|
@ -380,18 +379,6 @@ interface IconProps extends SVGProps<SVGSVGElement> {
|
||||||
name: IconName;
|
name: IconName;
|
||||||
}
|
}
|
||||||
|
|
||||||
const IconWrapper = styled.span`
|
|
||||||
display: inline-block;
|
|
||||||
width: 1em;
|
|
||||||
height: 1em;
|
|
||||||
svg {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
color: currentColor;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const Icon = ({
|
const Icon = ({
|
||||||
name,
|
name,
|
||||||
color = '#666666',
|
color = '#666666',
|
||||||
|
@ -401,9 +388,7 @@ const Icon = ({
|
||||||
const Component = iconsRegistry[name];
|
const Component = iconsRegistry[name];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<IconWrapper>
|
<Component color={color} viewBox={viewBox} data-test={name} {...rest} />
|
||||||
<Component color={color} viewBox={viewBox} data-test={name} {...rest} />
|
|
||||||
</IconWrapper>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -20,8 +20,8 @@ import { styled } from '@superset-ui/core';
|
||||||
|
|
||||||
export const Pill = styled.div`
|
export const Pill = styled.div`
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background: ${({ theme }) => theme.colors.grayscale.base};
|
|
||||||
color: ${({ theme }) => theme.colors.grayscale.light5};
|
color: ${({ theme }) => theme.colors.grayscale.light5};
|
||||||
|
background: ${({ theme }) => theme.colors.grayscale.base};
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
vertical-align: text-top;
|
vertical-align: text-top;
|
||||||
padding: ${({ theme }) => `${theme.gridUnit}px ${theme.gridUnit * 2}px`};
|
padding: ${({ theme }) => `${theme.gridUnit}px ${theme.gridUnit * 2}px`};
|
||||||
|
@ -36,6 +36,11 @@ export const Pill = styled.div`
|
||||||
svg {
|
svg {
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -1px;
|
top: -1px;
|
||||||
|
color: ${({ theme }) => theme.colors.grayscale.light5};
|
||||||
|
width: 1em;
|
||||||
|
height: 1em;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
@ -49,6 +54,9 @@ export const Pill = styled.div`
|
||||||
&:hover {
|
&:hover {
|
||||||
background: ${({ theme }) => theme.colors.alert.dark1};
|
background: ${({ theme }) => theme.colors.alert.dark1};
|
||||||
}
|
}
|
||||||
|
svg {
|
||||||
|
color: ${({ theme }) => theme.colors.grayscale.dark2};
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.filters-inactive {
|
&.filters-inactive {
|
||||||
|
|
Loading…
Reference in New Issue