diff options
| author | fragosti <francesco.agosti93@gmail.com> | 2018-12-04 09:37:32 +0800 |
|---|---|---|
| committer | fragosti <francesco.agosti93@gmail.com> | 2018-12-04 09:37:32 +0800 |
| commit | cd44dc7beb1697ec76dccba4711b3ce8057ba6e4 (patch) | |
| tree | ccc6233864ccf720c561e2e5f3d42972ca1204ac | |
| parent | db21ae3af1513f696b5c5ec0f4a1a3434cb4546d (diff) | |
| download | dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar.gz dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar.bz2 dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar.lz dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar.xz dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.tar.zst dexon-sol-tools-cd44dc7beb1697ec76dccba4711b3ce8057ba6e4.zip | |
polish: make configurator inputs look more like mocks
| -rw-r--r-- | packages/website/ts/components/ui/input.tsx | 4 | ||||
| -rw-r--r-- | packages/website/ts/components/ui/select.tsx | 4 | ||||
| -rw-r--r-- | packages/website/ts/pages/instant/config_generator_address_input.tsx | 1 |
3 files changed, 6 insertions, 3 deletions
diff --git a/packages/website/ts/components/ui/input.tsx b/packages/website/ts/components/ui/input.tsx index 1f56c814f..d21b9fd0e 100644 --- a/packages/website/ts/components/ui/input.tsx +++ b/packages/website/ts/components/ui/input.tsx @@ -9,6 +9,7 @@ export interface InputProps { fontSize?: string; fontColor?: string; border?: string; + padding?: string; placeholderColor?: string; placeholder?: string; backgroundColor?: string; @@ -22,7 +23,7 @@ const PlainInput: React.StatelessComponent<InputProps> = ({ value, className, pl export const Input = styled(PlainInput)` font-size: ${props => props.fontSize}; width: ${props => props.width}; - padding: 0.8em 1.2em; + padding: ${props => props.padding}; border-radius: 3px; box-sizing: border-box; font-family: 'Roboto Mono'; @@ -42,6 +43,7 @@ Input.defaultProps = { placeholderColor: colors.darkGrey, fontSize: '12px', border: 'none', + padding: '0.8em 1.2em', }; Input.displayName = 'Input'; diff --git a/packages/website/ts/components/ui/select.tsx b/packages/website/ts/components/ui/select.tsx index 743b082b0..e4fb50f59 100644 --- a/packages/website/ts/components/ui/select.tsx +++ b/packages/website/ts/components/ui/select.tsx @@ -65,7 +65,7 @@ export class Select extends React.Component<SelectProps, SelectState> { hasBoxShadow={isOpen} border={border} backgroundColor={backgroundColor} - padding="0.8em" + padding="0.5em 0.8em" width="100%" > <Container className="flex justify-between"> @@ -79,7 +79,7 @@ export class Select extends React.Component<SelectProps, SelectState> { </Text> )} {hasItems && ( - <Container marginLeft="5px" display="inline-block" position="relative" bottom="2px"> + <Container marginLeft="5px" display="inline-block"> <i className="zmdi zmdi-chevron-down" style={{ fontSize: iconSize, color: colors.darkGrey }} diff --git a/packages/website/ts/pages/instant/config_generator_address_input.tsx b/packages/website/ts/pages/instant/config_generator_address_input.tsx index 2e5a6e533..c208fe52a 100644 --- a/packages/website/ts/pages/instant/config_generator_address_input.tsx +++ b/packages/website/ts/pages/instant/config_generator_address_input.tsx @@ -32,6 +32,7 @@ export class ConfigGeneratorAddressInput extends React.Component< <Input width="100%" fontSize="16px" + padding="0.7em 1em" value={this.props.value} onChange={this._handleChange} placeholder="0xe99...aa8da4" |