@syncfusion/ej2-angular-grids 21.2.10 → 22.1.34

package/styles/grid/material3.scss

@@ -0,0 +1,22 @@
+@import 'ej2-base/styles/material3-definition.scss';
+
+@import 'ej2-navigations/styles/pager/material3-definition.scss';
+@import '../excel-filter/material3-definition.scss';
+@import 'ej2-inputs/styles/input/material3-definition.scss';
+@import 'ej2-inputs/styles/numerictextbox/material3-definition.scss';
+@import 'ej2-buttons/styles/button/material3-definition.scss';
+@import 'ej2-buttons/styles/radio-button/material3-definition.scss';
+@import 'ej2-buttons/styles/check-box/material3-definition.scss';
+@import 'ej2-dropdowns/styles/auto-complete/material3-definition.scss';
+@import 'ej2-dropdowns/styles/drop-down-list/material3-definition.scss';
+@import 'ej2-popups/styles/dialog/material3-definition.scss';
+@import 'ej2-popups/styles/spinner/material3-definition.scss';
+@import 'ej2-popups/styles/tooltip/material3-definition.scss';
+@import 'ej2-calendars/styles/datepicker/material3-definition.scss';
+@import 'ej2-calendars/styles/datetimepicker/material3-definition.scss';
+@import 'ej2-navigations/styles/toolbar/material3-definition.scss';
+@import 'ej2-navigations/styles/context-menu/material3-definition.scss';
+@import 'ej2-notifications/styles/skeleton/material3-definition.scss';
+@import 'material3-definition.scss';
+@import 'icons/material3.scss';
+@import 'all.scss';

package/styles/grid/tailwind-dark.css

@@ -681,7 +681,7 @@
 .e-bigger .e-grid.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber,
 .e-grid.e-bigger.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
   margin: 0 6px 0 5px;
-  margin-left: 32px;
+  margin-left: 0;
 }
 .e-bigger .e-grid .e-rowcell,
 .e-bigger .e-grid .e-summarycell,
@@ -770,7 +770,11 @@
 .e-bigger .e-grid.e-bigger .e-columnmenu,
 .e-grid.e-bigger.e-bigger .e-columnmenu {
   bottom: 13px;
-  margin: -14px -15px;
+  margin: -13px -18px -13px 4px;
+}
+.e-bigger .e-grid.e-device .e-columnmenu,
+.e-grid.e-bigger.e-device .e-columnmenu {
+  margin: -18px -15px;
 }
 .e-bigger .e-grid .e-columnmenu,
 .e-grid.e-bigger .e-columnmenu {
@@ -802,7 +806,7 @@
 .e-bigger .e-grid .e-groupheadercell span,
 .e-grid.e-bigger .e-groupheadercell span {
   height: 24px;
-  line-height: 24px;
+  line-height: 22px;
   padding: 0 0 0 8px;
 }
 .e-bigger .e-grid .e-groupheadercell .e-ungroupbutton,
@@ -879,7 +883,7 @@
 }
 .e-bigger .e-grid.e-device .e-groupheadercell .e-ungroupbutton,
 .e-grid.e-bigger.e-device .e-groupheadercell .e-ungroupbutton {
-  line-height: 37px;
+  line-height: 33px;
 }
 .e-bigger .e-grid.e-device .e-normaledit .e-rowcell,
 .e-grid.e-bigger.e-device .e-normaledit .e-rowcell {
@@ -916,16 +920,16 @@
 .e-grid.e-bigger .e-groupsort,
 .e-grid.e-bigger span.e-ungroupbutton,
 .e-grid.e-bigger .e-toggleungroup {
-  margin-left: -8px;
+  margin-left: -6px;
   margin-top: 0;
 }
 .e-bigger .e-grid span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger span.e-ungroupbutton.e-icons {
   font-size: 16px;
   margin-left: 0;
+  padding-top: 0;
   margin-top: 0;
   margin-right: 0;
-  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1069,7 +1073,6 @@
       -ms-user-select: none;
           user-select: none;
 }
-
 .e-grid {
   border-radius: 4px;
   border-style: none solid solid;
@@ -1237,7 +1240,6 @@
   padding-right: 16px;
 }
 .e-grid .e-res-toolbar .e-toolbar-items .e-toolbar-right .e-search-wrapper .e-search-icon {
-  font-size: 18px;
   font-size: 16px;
   margin-top: 4px;
 }
@@ -1470,6 +1472,7 @@
   border-collapse: separate;
   table-layout: fixed;
   width: 100%;
+  border-spacing: 0.25px;
 }
 .e-grid .e-tableborder {
   border-right: 1px solid;
@@ -2108,12 +2111,22 @@
   font-size: 14px;
   padding: 4px;
 }
-.e-grid .e-lastsummarycell {
+.e-grid .e-footerpadding .e-lastsummarycell {
+  border-left: none;
   border-right: 1px solid;
 }
+.e-grid.e-rtl .e-footerpadding tr.e-summaryrow td.e-lastsummarycell:last-child {
+  border-right: none;
+  border-left: 1px solid #4b5563;
+}
 .e-grid .e-footerpadding {
+  padding-left: 0;
   padding-right: 14px;
 }
+.e-grid.e-rtl .e-footerpadding {
+  padding-left: 14px;
+  padding-right: 0;
+}
 .e-grid .e-gridpopup span {
   border: 1px solid transparent;
   cursor: pointer;
@@ -2230,6 +2243,7 @@
 .e-grid td.e-active {
   font-weight: 400;
 }
+.e-grid:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
 .e-grid td.e-cellselectionbackground {
   font-weight: 400;
 }
@@ -2327,7 +2341,10 @@
   line-height: 26px;
 }
 .e-grid.e-device .e-groupheadercell .e-ungroupbutton {
-  line-height: 28px;
+  line-height: 20px;
+}
+.e-grid.e-device .e-groupheadercell .e-groupsort {
+  margin-top: 0;
 }
 .e-grid .e-groupheadercell .e-cancel {
   padding-right: 14px;
@@ -2339,14 +2356,14 @@
 .e-grid .e-ungroupbutton,
 .e-grid .e-toggleungroup {
   font-size: 14px;
-  margin-left: -8px;
+  margin-left: -7px;
 }
 .e-grid .e-groupsort {
   margin-right: 0;
   margin-top: -2px;
 }
 .e-grid span.e-ungroupbutton.e-icons {
-  margin-left: -9px;
+  margin-left: -8px;
   margin-top: -2px;
   padding-top: 4px;
   padding-right: 8px;
@@ -2741,7 +2758,7 @@
 .e-grid.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv.e-headerchkcelldiv .e-sortnumber, .e-grid.e-rtl .e-detailheadercell.e-fltr-icon .e-headercelldiv .e-sortnumber,
 .e-grid.e-rtl .e-detailheadercell.e-fltr-icon .e-headercelldiv.e-headerchkcelldiv .e-sortnumber {
   float: left;
-  margin: 0 4px 0 32px;
+  margin: 0 4px 0 4px;
 }
 .e-grid.e-rtl .e-headercell .e-headercelldiv,
 .e-grid.e-rtl .e-headercell .e-headercelldiv.e-headerchkcelldiv, .e-grid.e-rtl .e-detailheadercell .e-headercelldiv,
@@ -2753,7 +2770,7 @@
 .e-grid.e-rtl .e-headercell .e-headercelldiv.e-headerchkcelldiv .e-sortnumber, .e-grid.e-rtl .e-detailheadercell .e-headercelldiv .e-sortnumber,
 .e-grid.e-rtl .e-detailheadercell .e-headercelldiv.e-headerchkcelldiv .e-sortnumber {
   float: left;
-  margin: 0 4px 0 5px;
+  margin: 0 4px 0 -18px;
 }
 .e-grid.e-rtl .e-headercell .e-filterbarcell input, .e-grid.e-rtl .e-detailheadercell .e-filterbarcell input {
   border-width: 0;
@@ -2839,7 +2856,7 @@
   border-top: 2px solid;
 }
 .e-grid.e-rtl .e-groupheadercell span.e-grouptext {
-  margin-left: -8px;
+  margin-left: -7px;
   margin-right: 0;
 }
 .e-grid.e-rtl .e-groupheadercell span {
@@ -2943,7 +2960,7 @@
 }
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
-  margin-right: -9px;
+  margin-right: -8px;
   padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
@@ -3271,10 +3288,18 @@
 .e-bigger.e-grid .e-ccdlg span.e-ccsearch-icon.e-cc-cancel {
   font-size: 16px;
 }
+.e-bigger .e-grid .e-columnmenu,
+.e-bigger.e-grid .e-columnmenu {
+  margin: -13px -18px -13px 4px;
+}
 .e-bigger .e-grid.e-rtl .e-columnmenu,
 .e-bigger.e-grid.e-rtl .e-columnmenu {
   margin: -13px 6px -13px -16px;
 }
+.e-bigger .e-grid.e-rtl.e-device .e-columnmenu,
+.e-bigger.e-grid.e-rtl.e-device .e-columnmenu {
+  margin: -18px 6px -13px -16px;
+}
 .e-bigger .e-grid.e-rtl .e-groupheadercell span,
 .e-bigger.e-grid.e-rtl .e-groupheadercell span {
   padding: 0 0 0 8px;
@@ -3587,9 +3612,9 @@
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header {
-  font-weight: 500;
   padding-top: 2px;
   width: 100%;
+  font-weight: 500;
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn {
@@ -3902,6 +3927,8 @@
 }
 .e-grid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
 .e-grid .e-gridcontent .e-rowcell.e-dragborder,
+.e-grid .e-gridcontent .e-groupcaption.e-dragborder,
+.e-grid .e-gridcontent .e-summarycell.e-dragborder,
 .e-grid .e-gridcontent .e-rowdragdrop.e-dragborder, .e-grid .e-gridheader thead tr th.e-firstrowdragborder, .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
   box-shadow: 0 2px 0 0 #22d3ee;
   position: relative;
@@ -3978,7 +4005,8 @@
 .e-grid .e-summaryrow .e-summarycell,
 .e-grid .e-summaryrow .e-templatecell,
 .e-grid .e-summarycontent .e-indentcell,
-.e-grid .e-indentcell.e-detailindentcelltop {
+.e-grid .e-indentcell.e-detailindentcelltop,
+.e-grid .e-groupfooterrow.e-summaryrow .e-indentcell.e-indentcelltop {
   background-color: #232e3e;
   border-color: #4b5563;
   color: #9ca3af;

package/styles/grid/tailwind.css

@@ -681,7 +681,7 @@
 .e-bigger .e-grid.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber,
 .e-grid.e-bigger.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
   margin: 0 6px 0 5px;
-  margin-left: 32px;
+  margin-left: 0;
 }
 .e-bigger .e-grid .e-rowcell,
 .e-bigger .e-grid .e-summarycell,
@@ -770,7 +770,11 @@
 .e-bigger .e-grid.e-bigger .e-columnmenu,
 .e-grid.e-bigger.e-bigger .e-columnmenu {
   bottom: 13px;
-  margin: -14px -15px;
+  margin: -13px -18px -13px 4px;
+}
+.e-bigger .e-grid.e-device .e-columnmenu,
+.e-grid.e-bigger.e-device .e-columnmenu {
+  margin: -18px -15px;
 }
 .e-bigger .e-grid .e-columnmenu,
 .e-grid.e-bigger .e-columnmenu {
@@ -802,7 +806,7 @@
 .e-bigger .e-grid .e-groupheadercell span,
 .e-grid.e-bigger .e-groupheadercell span {
   height: 24px;
-  line-height: 24px;
+  line-height: 22px;
   padding: 0 0 0 8px;
 }
 .e-bigger .e-grid .e-groupheadercell .e-ungroupbutton,
@@ -879,7 +883,7 @@
 }
 .e-bigger .e-grid.e-device .e-groupheadercell .e-ungroupbutton,
 .e-grid.e-bigger.e-device .e-groupheadercell .e-ungroupbutton {
-  line-height: 37px;
+  line-height: 33px;
 }
 .e-bigger .e-grid.e-device .e-normaledit .e-rowcell,
 .e-grid.e-bigger.e-device .e-normaledit .e-rowcell {
@@ -916,16 +920,16 @@
 .e-grid.e-bigger .e-groupsort,
 .e-grid.e-bigger span.e-ungroupbutton,
 .e-grid.e-bigger .e-toggleungroup {
-  margin-left: -8px;
+  margin-left: -6px;
   margin-top: 0;
 }
 .e-bigger .e-grid span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger span.e-ungroupbutton.e-icons {
   font-size: 16px;
   margin-left: 0;
+  padding-top: 0;
   margin-top: 0;
   margin-right: 0;
-  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1069,7 +1073,6 @@
       -ms-user-select: none;
           user-select: none;
 }
-
 .e-grid {
   border-radius: 4px;
   border-style: none solid solid;
@@ -1237,7 +1240,6 @@
   padding-right: 16px;
 }
 .e-grid .e-res-toolbar .e-toolbar-items .e-toolbar-right .e-search-wrapper .e-search-icon {
-  font-size: 18px;
   font-size: 16px;
   margin-top: 4px;
 }
@@ -1470,6 +1472,7 @@
   border-collapse: separate;
   table-layout: fixed;
   width: 100%;
+  border-spacing: 0.25px;
 }
 .e-grid .e-tableborder {
   border-right: 1px solid;
@@ -2108,12 +2111,22 @@
   font-size: 14px;
   padding: 4px;
 }
-.e-grid .e-lastsummarycell {
+.e-grid .e-footerpadding .e-lastsummarycell {
+  border-left: none;
   border-right: 1px solid;
 }
+.e-grid.e-rtl .e-footerpadding tr.e-summaryrow td.e-lastsummarycell:last-child {
+  border-right: none;
+  border-left: 1px solid #e5e7eb;
+}
 .e-grid .e-footerpadding {
+  padding-left: 0;
   padding-right: 14px;
 }
+.e-grid.e-rtl .e-footerpadding {
+  padding-left: 14px;
+  padding-right: 0;
+}
 .e-grid .e-gridpopup span {
   border: 1px solid transparent;
   cursor: pointer;
@@ -2230,6 +2243,7 @@
 .e-grid td.e-active {
   font-weight: 400;
 }
+.e-grid:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
 .e-grid td.e-cellselectionbackground {
   font-weight: 400;
 }
@@ -2327,7 +2341,10 @@
   line-height: 26px;
 }
 .e-grid.e-device .e-groupheadercell .e-ungroupbutton {
-  line-height: 28px;
+  line-height: 20px;
+}
+.e-grid.e-device .e-groupheadercell .e-groupsort {
+  margin-top: 0;
 }
 .e-grid .e-groupheadercell .e-cancel {
   padding-right: 14px;
@@ -2339,14 +2356,14 @@
 .e-grid .e-ungroupbutton,
 .e-grid .e-toggleungroup {
   font-size: 14px;
-  margin-left: -8px;
+  margin-left: -7px;
 }
 .e-grid .e-groupsort {
   margin-right: 0;
   margin-top: -2px;
 }
 .e-grid span.e-ungroupbutton.e-icons {
-  margin-left: -9px;
+  margin-left: -8px;
   margin-top: -2px;
   padding-top: 4px;
   padding-right: 8px;
@@ -2741,7 +2758,7 @@
 .e-grid.e-rtl .e-headercell.e-fltr-icon .e-headercelldiv.e-headerchkcelldiv .e-sortnumber, .e-grid.e-rtl .e-detailheadercell.e-fltr-icon .e-headercelldiv .e-sortnumber,
 .e-grid.e-rtl .e-detailheadercell.e-fltr-icon .e-headercelldiv.e-headerchkcelldiv .e-sortnumber {
   float: left;
-  margin: 0 4px 0 32px;
+  margin: 0 4px 0 4px;
 }
 .e-grid.e-rtl .e-headercell .e-headercelldiv,
 .e-grid.e-rtl .e-headercell .e-headercelldiv.e-headerchkcelldiv, .e-grid.e-rtl .e-detailheadercell .e-headercelldiv,
@@ -2753,7 +2770,7 @@
 .e-grid.e-rtl .e-headercell .e-headercelldiv.e-headerchkcelldiv .e-sortnumber, .e-grid.e-rtl .e-detailheadercell .e-headercelldiv .e-sortnumber,
 .e-grid.e-rtl .e-detailheadercell .e-headercelldiv.e-headerchkcelldiv .e-sortnumber {
   float: left;
-  margin: 0 4px 0 5px;
+  margin: 0 4px 0 -18px;
 }
 .e-grid.e-rtl .e-headercell .e-filterbarcell input, .e-grid.e-rtl .e-detailheadercell .e-filterbarcell input {
   border-width: 0;
@@ -2839,7 +2856,7 @@
   border-top: 2px solid;
 }
 .e-grid.e-rtl .e-groupheadercell span.e-grouptext {
-  margin-left: -8px;
+  margin-left: -7px;
   margin-right: 0;
 }
 .e-grid.e-rtl .e-groupheadercell span {
@@ -2943,7 +2960,7 @@
 }
 .e-grid.e-rtl span.e-ungroupbutton.e-icons {
   margin-left: 0;
-  margin-right: -9px;
+  margin-right: -8px;
   padding-top: 4px;
 }
 .e-grid.e-rtl.e-default.e-bothlines .e-headercell, .e-grid.e-rtl.e-default.e-bothlines .e-detailheadercell {
@@ -3271,10 +3288,18 @@
 .e-bigger.e-grid .e-ccdlg span.e-ccsearch-icon.e-cc-cancel {
   font-size: 16px;
 }
+.e-bigger .e-grid .e-columnmenu,
+.e-bigger.e-grid .e-columnmenu {
+  margin: -13px -18px -13px 4px;
+}
 .e-bigger .e-grid.e-rtl .e-columnmenu,
 .e-bigger.e-grid.e-rtl .e-columnmenu {
   margin: -13px 6px -13px -16px;
 }
+.e-bigger .e-grid.e-rtl.e-device .e-columnmenu,
+.e-bigger.e-grid.e-rtl.e-device .e-columnmenu {
+  margin: -18px 6px -13px -16px;
+}
 .e-bigger .e-grid.e-rtl .e-groupheadercell span,
 .e-bigger.e-grid.e-rtl .e-groupheadercell span {
   padding: 0 0 0 8px;
@@ -3587,9 +3612,9 @@
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header {
-  font-weight: 500;
   padding-top: 2px;
   width: 100%;
+  font-weight: 500;
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn {
@@ -3902,6 +3927,8 @@
 }
 .e-grid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
 .e-grid .e-gridcontent .e-rowcell.e-dragborder,
+.e-grid .e-gridcontent .e-groupcaption.e-dragborder,
+.e-grid .e-gridcontent .e-summarycell.e-dragborder,
 .e-grid .e-gridcontent .e-rowdragdrop.e-dragborder, .e-grid .e-gridheader thead tr th.e-firstrowdragborder, .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
   box-shadow: 0 2px 0 0 #4f46e5;
   position: relative;
@@ -3978,7 +4005,8 @@
 .e-grid .e-summaryrow .e-summarycell,
 .e-grid .e-summaryrow .e-templatecell,
 .e-grid .e-summarycontent .e-indentcell,
-.e-grid .e-indentcell.e-detailindentcelltop {
+.e-grid .e-indentcell.e-detailindentcelltop,
+.e-grid .e-groupfooterrow.e-summaryrow .e-indentcell.e-indentcelltop {
   background-color: #f9fafb;
   border-color: #e5e7eb;
   color: #6b7280;

package/styles/highcontrast-light.css

@@ -946,7 +946,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-grid .e-filtermenudiv,
 .e-grid.e-bigger .e-filtermenudiv {
-  margin: -23px -7px;
+  margin: -25px -7px;
 }
 .e-bigger .e-grid .e-sortfilterdiv,
 .e-grid.e-bigger .e-sortfilterdiv {
@@ -954,7 +954,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-grid .e-gridheader .e-fltr-icon .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -23px 20px 0 0;
+  margin: -22px 20px 0 0;
 }
 .e-bigger .e-grid.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv,
 .e-grid.e-bigger.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
@@ -1018,7 +1018,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-grid .e-gridheader .e-rightalign.e-fltr-icon .e-sortfilterdiv,
 .e-grid.e-bigger .e-gridheader .e-rightalign.e-fltr-icon .e-sortfilterdiv {
-  margin: -23px 11px 0 0;
+  margin: -22px 11px 0 0;
 }
 .e-bigger .e-grid.e-rtl .e-headercell .e-sortfilterdiv, .e-bigger .e-grid.e-rtl .e-detailheadercell .e-sortfilterdiv,
 .e-grid.e-bigger.e-rtl .e-headercell .e-sortfilterdiv,
@@ -1031,19 +1031,19 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-grid.e-rtl .e-gridheader .e-fltr-icon .e-sortfilterdiv,
 .e-grid.e-bigger.e-rtl .e-gridheader .e-fltr-icon .e-sortfilterdiv {
-  margin: -17px 0 0 -7px;
+  margin: -15px 0 0 7px;
 }
 .e-bigger .e-grid.e-rtl .e-gridheader .e-rightalign.e-fltr-icon .e-sortfilterdiv,
 .e-grid.e-bigger.e-rtl .e-gridheader .e-rightalign.e-fltr-icon .e-sortfilterdiv {
-  margin: -17px 0 0 8px;
+  margin: -15px 0 0 8px;
 }
 .e-bigger .e-grid.e-rtl .e-filtermenudiv,
 .e-grid.e-bigger.e-rtl .e-filtermenudiv {
-  margin: -20px -7px;
+  margin: -18px -33px;
 }
 .e-bigger .e-grid.e-rtl .e-rightalign .e-filtermenudiv,
 .e-grid.e-bigger.e-rtl .e-rightalign .e-filtermenudiv {
-  margin: -20px -7px;
+  margin: -18px -33px;
 }
 .e-bigger .e-grid.e-rtl .e-headercell .e-headercelldiv .e-sortnumber, .e-bigger .e-grid.e-rtl .e-detailheadercell .e-headercelldiv .e-sortnumber,
 .e-grid.e-bigger.e-rtl .e-headercell .e-headercelldiv .e-sortnumber,
@@ -1116,6 +1116,10 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-bigger .e-grid.e-bigger .e-columnmenu,
 .e-grid.e-bigger.e-bigger .e-columnmenu {
   bottom: 16px;
+  margin: -25px -24px;
+}
+.e-bigger .e-grid.e-device .e-columnmenu,
+.e-grid.e-bigger.e-device .e-columnmenu {
   margin: -26px -20px;
 }
 .e-bigger .e-grid .e-columnmenu,
@@ -1269,9 +1273,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-bigger span.e-ungroupbutton.e-icons {
   font-size: 13px;
   margin-left: 0;
+  padding-top: 0;
   margin-top: 1px;
   margin-right: 0;
-  padding-top: 0;
 }
 .e-bigger .e-grid.e-device span.e-ungroupbutton.e-icons,
 .e-grid.e-bigger.e-device span.e-ungroupbutton.e-icons {
@@ -1411,7 +1415,6 @@ li.e-separator.e-menu-item.e-excel-separator {
       -ms-user-select: none;
           user-select: none;
 }
-
 .e-grid {
   border-radius: 0;
   border-style: none solid solid;
@@ -1807,6 +1810,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   border-collapse: separate;
   table-layout: fixed;
   width: 100%;
+  border-spacing: 0.25px;
 }
 .e-grid .e-tableborder {
   border-right: 1px solid;
@@ -2213,7 +2217,7 @@ li.e-separator.e-menu-item.e-excel-separator {
   position: absolute;
   right: 23px;
   float: right;
-  margin: -24px;
+  margin: -25px -24px;
   padding: 6px;
 }
 .e-grid.e-wrap .e-columnmenu {
@@ -2222,7 +2226,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-rtl .e-columnmenu {
   left: 5px;
   right: auto;
-  margin: -26px -18px -18px -6px;
+  margin: -18px -18px -18px -6px;
 }
 .e-grid.e-wrap.e-rtl .e-columnmenu {
   line-height: 18px;
@@ -2428,12 +2432,22 @@ li.e-separator.e-menu-item.e-excel-separator {
   font-size: 14px;
   padding: 4px;
 }
-.e-grid .e-lastsummarycell {
+.e-grid .e-footerpadding .e-lastsummarycell {
+  border-left: none;
   border-right: 1px solid;
 }
+.e-grid.e-rtl .e-footerpadding tr.e-summaryrow td.e-lastsummarycell:last-child {
+  border-right: none;
+  border-left: 1px solid #757575;
+}
 .e-grid .e-footerpadding {
+  padding-left: 0;
   padding-right: 14px;
 }
+.e-grid.e-rtl .e-footerpadding {
+  padding-left: 14px;
+  padding-right: 0;
+}
 .e-grid .e-gridpopup span {
   border: 1px solid transparent;
   cursor: pointer;
@@ -2549,6 +2563,7 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid td.e-active {
   font-weight: normal;
 }
+.e-grid:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
 .e-grid td.e-cellselectionbackground {
   font-weight: normal;
 }
@@ -2645,6 +2660,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid.e-device .e-groupheadercell .e-ungroupbutton {
   line-height: 28px;
 }
+.e-grid.e-device .e-groupheadercell .e-groupsort {
+  margin-top: 0;
+}
 .e-grid .e-groupheadercell .e-cancel {
   padding-right: 12px;
 }
@@ -3575,10 +3593,18 @@ li.e-separator.e-menu-item.e-excel-separator {
   padding-left: 0;
   padding-right: 7px;
 }
+.e-bigger .e-grid .e-columnmenu,
+.e-bigger.e-grid .e-columnmenu {
+  margin: -25px -24px;
+}
 .e-bigger .e-grid.e-rtl .e-columnmenu,
 .e-bigger.e-grid.e-rtl .e-columnmenu {
   margin: -26px -18px -18px -6px;
 }
+.e-bigger .e-grid.e-rtl.e-device .e-columnmenu,
+.e-bigger.e-grid.e-rtl.e-device .e-columnmenu {
+  margin: -26px -18px -18px -6px;
+}
 .e-bigger .e-grid.e-rtl .e-groupheadercell span,
 .e-bigger.e-grid.e-rtl .e-groupheadercell span {
   padding: 0;
@@ -3886,9 +3912,9 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-dlg-custom-header {
-  font-weight: 500;
   padding-top: 6px;
   width: 100%;
+  font-weight: 500;
 }
 .e-bigger .e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn,
 .e-bigger.e-responsive-dialog .e-dlg-header-content .e-dlg-header .e-res-custom-element .e-res-filter-clear-btn {
@@ -4197,6 +4223,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 }
 .e-grid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
 .e-grid .e-gridcontent .e-rowcell.e-dragborder,
+.e-grid .e-gridcontent .e-groupcaption.e-dragborder,
+.e-grid .e-gridcontent .e-summarycell.e-dragborder,
 .e-grid .e-gridcontent .e-rowdragdrop.e-dragborder, .e-grid .e-gridheader thead tr th.e-firstrowdragborder, .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowcell.e-dragborder, .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
   box-shadow: 0 2px 0 0 #400074;
   position: relative;
@@ -4273,7 +4301,8 @@ li.e-separator.e-menu-item.e-excel-separator {
 .e-grid .e-summaryrow .e-summarycell,
 .e-grid .e-summaryrow .e-templatecell,
 .e-grid .e-summarycontent .e-indentcell,
-.e-grid .e-indentcell.e-detailindentcelltop {
+.e-grid .e-indentcell.e-detailindentcelltop,
+.e-grid .e-groupfooterrow.e-summaryrow .e-indentcell.e-indentcelltop {
   background-color: #e4e4e4;
   border-color: #757575;
   color: #000;