diff --git a/packages/ra-ui-materialui/src/input/FileInput.js b/packages/ra-ui-materialui/src/input/FileInput.js index ba6f038ffa8..3f56b8fe6ed 100644 --- a/packages/ra-ui-materialui/src/input/FileInput.js +++ b/packages/ra-ui-materialui/src/input/FileInput.js @@ -12,18 +12,19 @@ import Labeled from './Labeled'; import FileInputPreview from './FileInputPreview'; import sanitizeRestProps from './sanitizeRestProps'; -const styles = createStyles({ - dropZone: { - background: '#efefef', - cursor: 'pointer', - padding: '1rem', - textAlign: 'center', - color: '#999', - }, - preview: {}, - removeButton: {}, - root: { width: '100%' }, -}); +const styles = theme => + createStyles({ + dropZone: { + background: theme.palette.background.default, + cursor: 'pointer', + padding: '1rem', + textAlign: 'center', + color: theme.palette.text.hint, + }, + preview: {}, + removeButton: {}, + root: { width: '100%' }, + }); export class FileInput extends Component { static propTypes = { diff --git a/packages/ra-ui-materialui/src/input/ImageInput.js b/packages/ra-ui-materialui/src/input/ImageInput.js index ce046745038..26d2b526f48 100644 --- a/packages/ra-ui-materialui/src/input/ImageInput.js +++ b/packages/ra-ui-materialui/src/input/ImageInput.js @@ -4,32 +4,33 @@ import { addField, translate } from 'ra-core'; import { FileInput } from './FileInput'; -const styles = createStyles({ - root: { width: '100%' }, - dropZone: { - background: '#efefef', - cursor: 'pointer', - padding: '1rem', - textAlign: 'center', - color: '#999', - }, - preview: {}, - removeButton: { - display: 'inline-block', - position: 'relative', - float: 'left', - '& button': { - position: 'absolute', - top: '0.5rem', - right: '0.5rem', - minWidth: '2rem', - opacity: 0, +const styles = theme => + createStyles({ + root: { width: '100%' }, + dropZone: { + background: theme.palette.background.default, + cursor: 'pointer', + padding: '1rem', + textAlign: 'center', + color: theme.palette.text.hint, }, - '&:hover button': { - opacity: 1, + preview: {}, + removeButton: { + display: 'inline-block', + position: 'relative', + float: 'left', + '& button': { + position: 'absolute', + top: '0.5rem', + right: '0.5rem', + minWidth: '2rem', + opacity: 0, + }, + '&:hover button': { + opacity: 1, + }, }, - }, -}); + }); export class ImageInput extends FileInput { static defaultProps = {