diff --git a/src/fields/color.jsx b/src/fields/color.jsx index 26ad8fb..27d2e1a 100644 --- a/src/fields/color.jsx +++ b/src/fields/color.jsx @@ -1,5 +1,6 @@ import React from 'react' -import { Select, Input } from 'rebass' +import { Label, Input } from 'rebass' +import {inputBase} from '../theme' /*** Number fields with support for min, max and units and documentation*/ class ColorField extends React.Component { @@ -16,12 +17,16 @@ static propTypes = { } render() { - return + return
+
} } diff --git a/src/fields/number.jsx b/src/fields/number.jsx index 996325c..7a3ce7f 100644 --- a/src/fields/number.jsx +++ b/src/fields/number.jsx @@ -1,5 +1,6 @@ import React from 'react' -import { Select, Input } from 'rebass' +import { Label, Input } from 'rebass' +import {inputBase} from '../theme' /*** Number fields with support for min, max and units and documentation*/ class NumberField extends React.Component { @@ -19,13 +20,17 @@ class NumberField extends React.Component { } render() { - return + return
+
} } diff --git a/src/fields/string.jsx b/src/fields/string.jsx index 191e2b3..79e938e 100644 --- a/src/fields/string.jsx +++ b/src/fields/string.jsx @@ -1,5 +1,6 @@ import React from 'react' -import { Input } from 'rebass' +import { Label, Input } from 'rebass' +import {inputBase} from '../theme' /*** Number fields with support for min, max and units and documentation*/ class StringField extends React.Component { @@ -16,12 +17,16 @@ static propTypes = { } render() { - return + return
+
} } diff --git a/src/sources/list.jsx b/src/sources/list.jsx index 3cbee9d..33a5a56 100644 --- a/src/sources/list.jsx +++ b/src/sources/list.jsx @@ -28,7 +28,7 @@ export class SourceList extends React.Component { return
- Layers + Sources diff --git a/src/theme.js b/src/theme.js index 1a6658b..cc8f5fa 100644 --- a/src/theme.js +++ b/src/theme.js @@ -37,6 +37,16 @@ export const colors = { ...themeColors } +export const inputBase = { + display: 'block', + border: '1px solid rgb(36, 36, 36)', + height: 30, + width: '100%', + paddingLeft: 5, + paddingRight: 5, + backgroundColor: colors.gray, +} + const scale = [3, 5, 10, 30, 40] const fontSizes = [28, 24, 20, 16, 14, 12, 10]