Fixing column delete button css and margin

This commit is contained in:
Satbir Singh 2020-04-03 06:56:13 +00:00
parent 3a12124d47
commit ac27f0f2c6

View File

@ -16,17 +16,15 @@ export interface ColumnAction {
dynamicTrigger: string; dynamicTrigger: string;
} }
const StyledDeleteIcon = styled(FormIcons.DELETE_ICON as AnyStyledComponent)` const StyledDeleteIcon = styled(FormIcons.DELETE_ICON as AnyStyledComponent)`
padding: 5px 5px; padding: 5px 0px;
position: absolute; position: absolute;
right: 8px; right: 8px;
cursor: pointer; cursor: pointer;
top: 0px; top: 0px;
`; `;
const StyledInputText = styled(InputText)` const Wrapper = styled.div`
&& { margin-bottom: 8px;
margin-bottom: 3px;
}
`; `;
class ColumnActionSelectorControl extends BaseControl< class ColumnActionSelectorControl extends BaseControl<
@ -44,24 +42,28 @@ class ColumnActionSelectorControl extends BaseControl<
position: "relative", position: "relative",
}} }}
> >
<StyledInputText <Wrapper>
label={columnAction.label} <InputText
value={columnAction.label} label={columnAction.label}
onChange={this.updateColumnActionLabel.bind( value={columnAction.label}
this, onChange={this.updateColumnActionLabel.bind(
columnAction, this,
)} columnAction,
isValid={true} )}
/> isValid={true}
<DynamicActionCreator />
value={columnAction.dynamicTrigger} </Wrapper>
isValid={(columnAction as any).isValid} <Wrapper>
validationMessage={(columnAction as any).message} <DynamicActionCreator
onValueChange={this.updateColumnActionFunction.bind( value={columnAction.dynamicTrigger}
this, isValid={(columnAction as any).isValid}
columnAction, validationMessage={(columnAction as any).message}
)} onValueChange={this.updateColumnActionFunction.bind(
/> this,
columnAction,
)}
/>
</Wrapper>
<StyledDeleteIcon <StyledDeleteIcon
height={20} height={20}
width={20} width={20}