View Full Version : [CLOSED] Changing the grid inline editor height in Material Theme

Jan 23, 2020, 7:50 PM
We have changed the grid row height, material theme, using css.
First, we defined a height on the x-grid-item class but that didn't help, and when we changed the padding on x-grid-cell-inner we were able to get the height we wanted.

.x-grid-cell-inner {
padding: 6px 6px !important;

the issue is that the inline editors in the grid still have a very large height to fit the old row height (you can see that in the image).
what is the correct way to overwrite the row height so it applies to the editors as well?

Jan 24, 2020, 12:49 AM
Hello @baruch.gabo!

This one's pretty tricky, but I could get the behavior for what I deem to be close to what you need by also making this CSS override:

.x-grid-cell-editor, .x-grid-editor .x-form-item-body {
padding: 0px 6px;

Hope this helps!

p.s.: as you didn't provide any test case, I used the GridPanel > Editable > Editor with DirectMethod example (https://examples5.ext.net/#/GridPanel/Editable/Editor_with_DirectMethod/) as a base to reproduce the effects change in the Material theme.

Jan 24, 2020, 9:13 AM
Great. That's exactly what we were looking for.

Jan 24, 2020, 5:43 PM
Glad it helped, thanks for the feedback!