diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
index 1315ddfa60..5b589f0972 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
@@ -39,12 +39,12 @@ export default function Option(props: OptionProps) {
data-test="remove-control-button"
onClick={() => props.clickClose(props.index)}
>
-
+
{props.withCaret && (
-
+
)}
diff --git a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
index 216d606ddc..58d3d4856a 100644
--- a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
+++ b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
@@ -47,19 +47,27 @@ export const OptionControlContainer = styled.div<{
`;
export const Label = styled.div`
- display: flex;
- max-width: 100%;
- overflow: hidden;
- text-overflow: ellipsis;
- align-items: center;
- white-space: nowrap;
- padding-left: ${({ theme }) => theme.gridUnit}px;
- svg {
- margin-right: ${({ theme }) => theme.gridUnit}px;
- }
- .option-label {
- display: inline;
- }
+ ${({ theme }) => `
+ display: flex;
+ max-width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ align-items: center;
+ white-space: nowrap;
+ padding-left: ${theme.gridUnit}px;
+ svg {
+ margin-right: ${theme.gridUnit}px;
+ margin-left: ${theme.gridUnit}px;
+ }
+ .type-label {
+ margin-right: ${theme.gridUnit}px;
+ margin-left: ${theme.gridUnit}px;
+ font-weight: ${theme.typography.weights.normal};
+ }
+ .option-label {
+ display: inline;
+ }
+ `}
`;
export const CaretContainer = styled.div`
diff --git a/superset-frontend/src/explore/components/optionRenderers.tsx b/superset-frontend/src/explore/components/optionRenderers.tsx
index 16f3908c60..aa6bd9327c 100644
--- a/superset-frontend/src/explore/components/optionRenderers.tsx
+++ b/superset-frontend/src/explore/components/optionRenderers.tsx
@@ -42,8 +42,9 @@ const OptionContainer = styled.div`
}
}
.type-label {
- margin-right: ${({ theme }) => theme.gridUnit * 2}px;
- width: ${({ theme }) => theme.gridUnit * 7}px;
+ margin-right: ${({ theme }) => theme.gridUnit * 3}px;
+ margin-left: ${({ theme }) => theme.gridUnit * 3}px;
+ width: ${({ theme }) => theme.gridUnit * 4}px;
display: inline-block;
text-align: center;
font-weight: ${({ theme }) => theme.typography.weights.bold};