You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by er...@apache.org on 2021/05/12 21:21:17 UTC
[superset] 01/01: feat: Remove uppercase styling on FilterBox
This is an automated email from the ASF dual-hosted git repository.
erikrit pushed a commit to branch erik-ritter--remove-uppercase-styling-filter-box
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 4d27d7de8656522d4d8e150f5289a6392756d7b3
Author: erik_ritter <er...@airbnb.com>
AuthorDate: Wed May 12 14:19:51 2021 -0700
feat: Remove uppercase styling on FilterBox
---
superset-frontend/src/components/Form/FormLabel.tsx | 16 +++++++++-------
.../src/visualizations/FilterBox/FilterBox.jsx | 4 +++-
2 files changed, 12 insertions(+), 8 deletions(-)
diff --git a/superset-frontend/src/components/Form/FormLabel.tsx b/superset-frontend/src/components/Form/FormLabel.tsx
index cb4cba0..0070642 100644
--- a/superset-frontend/src/components/Form/FormLabel.tsx
+++ b/superset-frontend/src/components/Form/FormLabel.tsx
@@ -21,20 +21,21 @@ import { styled } from '@superset-ui/core';
export type FormLabelProps = {
children: ReactNode;
+ className?: string;
htmlFor?: string;
required?: boolean;
- className?: string;
+ uppercase?: boolean;
};
-const Label = styled.label`
- text-transform: uppercase;
+const Label = styled.label<{ uppercase: boolean }>`
+ text-transform: ${({ uppercase }) => (uppercase ? 'uppercase' : 'none')};
font-size: ${({ theme }) => theme.typography.sizes.s}px;
color: ${({ theme }) => theme.colors.grayscale.base};
margin-bottom: ${({ theme }) => theme.gridUnit}px;
`;
-const RequiredLabel = styled.label`
- text-transform: uppercase;
+const RequiredLabel = styled.label<{ uppercase: boolean }>`
+ text-transform: ${({ uppercase }) => (uppercase ? 'uppercase' : 'none')};
font-size: ${({ theme }) => theme.typography.sizes.s}px;
color: ${({ theme }) => theme.colors.grayscale.base};
margin-bottom: ${({ theme }) => theme.gridUnit}px;
@@ -48,13 +49,14 @@ const RequiredLabel = styled.label`
export default function FormLabel({
children,
+ className,
htmlFor,
required = false,
- className,
+ uppercase = true,
}: FormLabelProps) {
const StyledLabel = required ? RequiredLabel : Label;
return (
- <StyledLabel htmlFor={htmlFor} className={className}>
+ <StyledLabel htmlFor={htmlFor} className={className} uppercase={uppercase}>
{children}
</StyledLabel>
);
diff --git a/superset-frontend/src/visualizations/FilterBox/FilterBox.jsx b/superset-frontend/src/visualizations/FilterBox/FilterBox.jsx
index cbe9566..23a8613 100644
--- a/superset-frontend/src/visualizations/FilterBox/FilterBox.jsx
+++ b/superset-frontend/src/visualizations/FilterBox/FilterBox.jsx
@@ -408,7 +408,9 @@ class FilterBox extends React.PureComponent {
const { label, key } = filterConfig;
return (
<div key={key} className="m-b-5 filter-container">
- <FormLabel htmlFor={`LABEL-${key}`}>{label}</FormLabel>
+ <FormLabel htmlFor={`LABEL-${key}`} uppercase={false}>
+ {label}
+ </FormLabel>
{this.renderSelect(filterConfig)}
</div>
);