Use the below CSS to customize the Grid edited and added row table elements
.e-grid .e-editedrow table,
.e-grid .e-addedrow table {
background-color: #deecf9;
}
Grid edited row input elements can be customized using the below CSS.
.e-grid .e-gridform .e-rowcell .e-input-group .e-input.e-field {
font-family: cursive;
}
Use the below CSS to customize the Grid edit dialog header element
.e-edit-dialog .e-dlg-header-content {
background-color: #deecf9;
}
Below CSS customizes the Grid edited row input element in Dialog edit mode
.e-gridform .e-rowcell .e-float-input .e-field {
font-family: cursive;
}
Use the below CSS to customize the command column buttons such as edit, delete, update, and cancel.
.e-grid .e-edit::before, .e-grid .e-delete::before {
color: #FF8787;
}
.e-grid .e-update::before, .e-grid .e-cancel-icon::before {
color: #0078d7;
}