diff --git a/docs/src/pages/components/text-fields/FilledTextFields.js b/docs/src/pages/components/text-fields/FilledTextFields.js index 46c5312217c2bb..4174c4ee9a561b 100644 --- a/docs/src/pages/components/text-fields/FilledTextFields.js +++ b/docs/src/pages/components/text-fields/FilledTextFields.js @@ -136,6 +136,15 @@ function FilledTextFields() { margin="dense" variant="filled" /> + + + + { }, /* Styles applied to the root element if `error={true}`. */ error: {}, + /* Styles applied to the `input` element if `margin="dense"`. */ + marginDense: {}, /* Styles applied to the root element if `multiline={true}`. */ multiline: { padding: '27px 12px 10px', + '&$marginDense': { + paddingTop: 23, + paddingBottom: 6, + }, }, /* Styles applied to the `input` element. */ input: { @@ -102,7 +108,7 @@ export const styles = theme => { }, /* Styles applied to the `input` element if `margin="dense"`. */ inputMarginDense: { - paddingTop: 24, + paddingTop: 23, paddingBottom: 6, }, /* Styles applied to the `input` element if `multiline={true}`. */ diff --git a/packages/material-ui/src/InputBase/InputBase.js b/packages/material-ui/src/InputBase/InputBase.js index ec78e68bb6fc5e..2d5ac0ec2f2603 100644 --- a/packages/material-ui/src/InputBase/InputBase.js +++ b/packages/material-ui/src/InputBase/InputBase.js @@ -61,6 +61,9 @@ export const styles = theme => { /* Styles applied to the root element if `multiline={true}`. */ multiline: { padding: `${8 - 2}px 0 ${8 - 1}px`, + '&$marginDense': { + paddingTop: 4 - 1, + }, }, /* Styles applied to the root element if `fullWidth={true}`. */ fullWidth: { diff --git a/packages/material-ui/src/InputLabel/InputLabel.js b/packages/material-ui/src/InputLabel/InputLabel.js index 60b3c1bfc8ab06..068c964e7f633e 100644 --- a/packages/material-ui/src/InputLabel/InputLabel.js +++ b/packages/material-ui/src/InputLabel/InputLabel.js @@ -73,7 +73,7 @@ export const styles = theme => ({ pointerEvents: 'none', transform: 'translate(14px, 20px) scale(1)', '&$marginDense': { - transform: 'translate(14px, 17px) scale(1)', + transform: 'translate(14px, 12px) scale(1)', }, '&$shrink': { transform: 'translate(14px, -6px) scale(0.75)', diff --git a/packages/material-ui/src/OutlinedInput/OutlinedInput.js b/packages/material-ui/src/OutlinedInput/OutlinedInput.js index 7ae2891166b4a9..e15bbea9ae1e30 100644 --- a/packages/material-ui/src/OutlinedInput/OutlinedInput.js +++ b/packages/material-ui/src/OutlinedInput/OutlinedInput.js @@ -48,9 +48,15 @@ export const styles = theme => { }, /* Styles applied to the root element if `error={true}`. */ error: {}, + /* Styles applied to the `input` element if `margin="dense"`. */ + marginDense: {}, /* Styles applied to the root element if `multiline={true}`. */ multiline: { padding: '18.5px 14px', + '&$marginDense': { + paddingTop: 10.5, + paddingBottom: 10.5, + }, }, /* Styles applied to the `NotchedOutline` element. */ notchedOutline: {}, @@ -60,8 +66,8 @@ export const styles = theme => { }, /* Styles applied to the `input` element if `margin="dense"`. */ inputMarginDense: { - paddingTop: 15, - paddingBottom: 15, + paddingTop: 10.5, + paddingBottom: 10.5, }, /* Styles applied to the `input` element if `multiline={true}`. */ inputMultiline: { diff --git a/pages/api/filled-input.md b/pages/api/filled-input.md index 4ec5b0d5d5b032..95e7ca66914820 100644 --- a/pages/api/filled-input.md +++ b/pages/api/filled-input.md @@ -64,6 +64,7 @@ This property accepts the following keys: | adornedStart | Styles applied to the root element if `startAdornment` is provided. | adornedEnd | Styles applied to the root element if `endAdornment` is provided. | error | Styles applied to the root element if `error={true}`. +| marginDense | Styles applied to the `input` element if `margin="dense"`. | multiline | Styles applied to the root element if `multiline={true}`. | input | Styles applied to the `input` element. | inputMarginDense | Styles applied to the `input` element if `margin="dense"`. diff --git a/pages/api/outlined-input.md b/pages/api/outlined-input.md index a6d4f5587adaec..2c3fea414ffd02 100644 --- a/pages/api/outlined-input.md +++ b/pages/api/outlined-input.md @@ -64,6 +64,7 @@ This property accepts the following keys: | adornedStart | Styles applied to the root element if `startAdornment` is provided. | adornedEnd | Styles applied to the root element if `endAdornment` is provided. | error | Styles applied to the root element if `error={true}`. +| marginDense | Styles applied to the `input` element if `margin="dense"`. | multiline | Styles applied to the root element if `multiline={true}`. | notchedOutline | Styles applied to the `NotchedOutline` element. | input | Styles applied to the `input` element.