@syncfusion/blazor-themes 20.4.52 → 20.4.54

package/SCSS-Themes/fluent.scss

@@ -36361,12 +36361,12 @@ $gridline-border-radius: $model-radius-small !default;
 
 //default
 $datepicker-icon: '\e901' !default;
-$datepicker-icon-font-size: 18px !default;
+$datepicker-icon-font-size: 16px !default;
 $datepicker-icon-container-min-height: 18px !default;
 $datepicker-icon-container-min-width: 30px !default;
 $datepicker-bigger-icon-container-min-height: 18px !default;
 $datepicker-bigger-icon-container-min-width: 36px !default;
-$datepicker-bigger-icon-font-size: 22px !default;
+$datepicker-bigger-icon-font-size: 18px !default;
 $datepicker-icon-normal-margin: 0 !default;
 $datepicker-icon-bigger-margin: 0 !default;
 $datepicker-icon-border-radius: 50% !default;
@@ -71598,7 +71598,7 @@ $grid-font-family: $font-family !default;
 $grid-header-font-size: $text-sm !default;
 $grid-bigger-header-font-size: $text-base !default;
 $grid-group-text-line-height: 22px !default;
-$grid-wrap-line-height: 18px !default;
+$grid-wrap-line-height: 10px !default;
 $grid-wrap-margin-bottom: 2px !default;
 $grid-wrap-margin-top: 0 !default;
 $grid-header-bottom-padding: 7px !default;
@@ -71629,8 +71629,8 @@ $grid-filterdiv-padding: 0 !default;
 $grid-headercelldiv-height: 29px !default;
 $grid-filterbarcell-input-height: 26px !default;
 $grid-sortnumber-border-radius: 65% !default;
-$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 10px !default;
-$grid-textwrap-srotnumber-margin: 3px 5px 0 2px !default;
+$grid-textwrap-srotnumber-rightalign-margin: 5px 2px 0 15px !default;
+$grid-textwrap-srotnumber-margin: 5px 5px 0 2px !default;
 $grid-textwrap-sorticon-margin: -9px 10px !default;
 $grid-columnchooser-header-padding: 11px 18px 15px !default;
 $grid-columnchooser-toolbar-button-padding: 0 12px !default;
@@ -71841,6 +71841,8 @@ $grid-rtl-group-text-margin-left: 0 !default;
 $grid-rtl-group-sorticon-margin-right: -8px !default;
 $grid-rtl-headercell-border-width: 0 !default;
 $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
+$grid-rtl-headercelldiv-chkbox-padding: 0 4px 0 .35em !default;
+$grid-bigger-rtl-headercelldiv-chkbox-padding: 0 4px 0 .3em !default;
 $grid-ungroup-rtl-padding-right: -14px !default;
 $grid-headercelldiv-padding: 0 20px 0 5px !default;
 $grid-headercell-div-padding: 0 .4em !default;
@@ -71954,12 +71956,12 @@ $grid-grouped-headercell-hover-padding: $grid-grouped-headercell-padding !defaul
 $grid-drag-clone-font-weight: $font-weight-normal !default;
 $grid-bigger-group-headercell-hover-padding: $grid-bigger-group-headercell-padding !default;
 $grid-header-wrap-rightalign-sortfilter-div-margin: -34px -5px !default;
-$grid-header-wrap-filtericon-sortfilter-div-margin: -28px -4px 0 16px !default;
+$grid-header-wrap-filtericon-sortfilter-div-margin: -33px 18px 0 16px !default;
 $grid-bigger-wrap-sortdiv-margin: -31px 8px !default;
 $grid-bigger-wrap-rightalign-sortdiv-margin: -30px -5px !default;
 $grid-bigger-wrap-rightalign-fltricon-sortdiv-margin: -26px -20px 0 0 !default;
 $grid-bigger-wrap-fltricon-sortdiv-margin: -30px 28px -31px 0 !default;
-$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -28px 0 !default;
+$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -33px 14px !default;
 $grid-drag-font-size: $text-base !default;
 $grid-drag-icon-font-weight: $font-weight-bold !default;
 $grid-drag-move-icon: 10px !default;
@@ -72340,9 +72342,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-bigger-rtl-headercelldiv-chkbox-padding;
     }
 
     .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -73898,11 +73898,10 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-rtl-headercelldiv-chkbox-padding;
     }
 
+
     .e-filtermenudiv {
       float: $grid-fltrdiv-float;
       margin: $grid-fltrdiv-margin;
@@ -74015,7 +74014,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnmenu {
-      margin: $grid-textwrap-column-menu-margin;
+      line-height: $grid-wrap-line-height;
     }
 
     &.e-rtl .e-columnmenu {
@@ -74029,7 +74028,7 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-wrap {
       &.e-rtl  .e-columnmenu {
-        margin: $grid-rtl-textwrap-column-menu-margin;
+        line-height: $grid-wrap-line-height;
       }
     }
 
@@ -75211,6 +75210,13 @@ $grid-dropitems-count-margin-left: -8px !default;
         margin: $grid-rtl-headercelldiv-rightalign-fltricon-margin;
       }
 
+      &.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv,
+      & .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+        height: auto;
+        margin-bottom: $grid-wrap-margin-bottom;
+        margin-top: $grid-wrap-margin-top;
+      }
+
       & .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
         margin: $grid-rtl-headercelldiv-fltricon-margin;
       }
@@ -75529,7 +75535,8 @@ $grid-dropitems-count-margin-left: -8px !default;
     &.e-wrap {
       & .e-rowcell,
       & .e-columnheader .e-stackedheadercelldiv,
-      & .e-columnheader .e-headercelldiv {
+      & .e-columnheader .e-headercelldiv,
+      & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
         height: Auto;
         line-height: $grid-rowcell-wrap-height;
         overflow-wrap: break-word;
@@ -75545,25 +75552,30 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnheader .e-headercelldiv,
-    & .e-columnheader.e-wrap .e-headercelldiv {
+    &.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
       margin-bottom: $grid-wrap-margin-bottom;
       margin-top: $grid-wrap-margin-top;
     }
 
-    &.e-wrap .e-columnheader .e-filtermenudiv {
+    &.e-wrap .e-columnheader .e-filtermenudiv,
+    &.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
-    & .e-columnheader.e-wrap .e-filtermenudiv {
+    & .e-columnheader.e-wrap .e-filtermenudiv,
+    & .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
     & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv,
     & .e-columnheader.e-wrap .e-stackedheadercelldiv,
     & .e-gridcontent.e-wrap .e-rowcell,
     & .e-frozenhdrcont.e-wrap .e-rowcell {
       height: Auto;
-      line-height: $grid-wrap-line-height;
+      line-height: $grid-rowcell-wrap-height;
       overflow-wrap: break-word;
       text-overflow: clip;
       white-space: normal;
@@ -76750,8 +76762,8 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
-    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
-    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
+    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
+    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
       &:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
         background-color: $grid-hover-bg-color;

package/SCSS-Themes/grids/grid/bootstrap-dark.scss

@@ -54,7 +54,7 @@ $grid-group-broder-color:  $content-border-color !default;
 $grid-group-hover-broder-color: $content-border-color !default;
 $grid-group-text-line-height: 24px !default;
 $filter-text-color: $content-font-color !default;
-$grid-wrap-line-height: 18px !default;
+$grid-wrap-line-height:10px !default;
 $grid-wrap-margin-bottom: 2px !default;
 $grid-wrap-margin-top: 0 !default;
 
@@ -87,8 +87,8 @@ $grid-filterdiv-padding: 0 !default;
 $grid-headercelldiv-height: 29px !default;
 $grid-filterbarcell-input-height: 26px !default;
 $grid-sortnumber-border-radius: 65% !default;
-$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 5px !default;
-$grid-textwrap-srotnumber-margin: 3px 5px 0 2px !default;
+$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 20px !default;
+$grid-textwrap-srotnumber-margin: 3px -3px 0 2px !default;
 $grid-textwrap-sorticon-margin: -9px 10px !default;
 $grid-columnchooser-header-padding: 11px 18px 15px !default;
 $grid-columnchooser-toolbar-button-padding: 0 12px !default;
@@ -332,6 +332,8 @@ $grid-rtl-group-text-margin-left: 0 !default;
 $grid-rtl-group-sorticon-margin-right: -5px !default;
 $grid-rtl-headercell-border-width: 0 !default;
 $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
+$grid-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
+$grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
 $grid-ungroup-rtl-padding-right: -10px !default;
 $grid-headercelldiv-padding: 0 1.8em 0 .4em !default;
 $grid-headercell-div-padding: 0 .4em !default;
@@ -458,12 +460,12 @@ $grid-content-batch-font-color: $grid-content-font-color !default;
 $grid-bigger-group-headercell-hover-padding: $grid-bigger-group-headercell-padding !default;
 
 $grid-header-wrap-rightalign-sortfilter-div-margin: -30px -5px !default;
-$grid-header-wrap-filtericon-sortfilter-div-margin: -24px 28px -29px 0 !default;
+$grid-header-wrap-filtericon-sortfilter-div-margin: -30px 14px -29px 14px !default;
 $grid-bigger-wrap-sortdiv-margin: -31px 8px !default;
 $grid-bigger-wrap-rightalign-sortdiv-margin: -30px -5px !default;
 $grid-bigger-wrap-rightalign-fltricon-sortdiv-margin: -26px -20px 0 0 !default;
 $grid-bigger-wrap-fltricon-sortdiv-margin: -30px 28px -31px 0 !default;
-$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -24px 0 !default;
+$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -30px 14px !default;
 
 $grid-drag-font-size: 12px !default;
 $grid-drag-icon-font-weight: bold !default;
@@ -499,7 +501,7 @@ $grid-bigger-fltr-sortnumber-margin: $grid-bigger-sortnumber-margin !default;
 $grid-rtl-searchclear: 0 !default;
 $grid-column-chosser-searchdiv-top: -46px !default;
 $grid-reorderarrow-font-size: 10px !default;
-$grid-bigger-wrap-line-height: $grid-wrap-line-height !default;
+$grid-bigger-wrap-line-height:18px !default;
 $grid-bigger-clone-padding: $grid-clone-padding !default;
 $grid-bigger-draganddrop-clone-padding: 0 !default;
 $grouped-bigger-text-font-size: 16px !default;
@@ -863,9 +865,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-bigger-rtl-headercelldiv-chkbox-padding;
     }
 
     .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2421,11 +2421,10 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-rtl-headercelldiv-chkbox-padding;
     }
 
+
     .e-filtermenudiv {
       float: $grid-fltrdiv-float;
       margin: $grid-fltrdiv-margin;
@@ -2538,7 +2537,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnmenu {
-      margin: $grid-textwrap-column-menu-margin;
+      line-height: $grid-wrap-line-height;
     }
 
     &.e-rtl .e-columnmenu {
@@ -2552,7 +2551,7 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-wrap {
       &.e-rtl  .e-columnmenu {
-        margin: $grid-rtl-textwrap-column-menu-margin;
+        line-height: $grid-wrap-line-height;
       }
     }
 
@@ -3734,6 +3733,13 @@ $grid-dropitems-count-margin-left: -8px !default;
         margin: $grid-rtl-headercelldiv-rightalign-fltricon-margin;
       }
 
+      &.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv,
+      & .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+        height: auto;
+        margin-bottom: $grid-wrap-margin-bottom;
+        margin-top: $grid-wrap-margin-top;
+      }
+
       & .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
         margin: $grid-rtl-headercelldiv-fltricon-margin;
       }
@@ -4052,7 +4058,8 @@ $grid-dropitems-count-margin-left: -8px !default;
     &.e-wrap {
       & .e-rowcell,
       & .e-columnheader .e-stackedheadercelldiv,
-      & .e-columnheader .e-headercelldiv {
+      & .e-columnheader .e-headercelldiv,
+      & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
         height: Auto;
         line-height: $grid-rowcell-wrap-height;
         overflow-wrap: break-word;
@@ -4068,25 +4075,30 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnheader .e-headercelldiv,
-    & .e-columnheader.e-wrap .e-headercelldiv {
+    &.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
       margin-bottom: $grid-wrap-margin-bottom;
       margin-top: $grid-wrap-margin-top;
     }
 
-    &.e-wrap .e-columnheader .e-filtermenudiv {
+    &.e-wrap .e-columnheader .e-filtermenudiv,
+    &.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
-    & .e-columnheader.e-wrap .e-filtermenudiv {
+    & .e-columnheader.e-wrap .e-filtermenudiv,
+    & .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
     & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv,
     & .e-columnheader.e-wrap .e-stackedheadercelldiv,
     & .e-gridcontent.e-wrap .e-rowcell,
     & .e-frozenhdrcont.e-wrap .e-rowcell {
       height: Auto;
-      line-height: $grid-wrap-line-height;
+      line-height: $grid-rowcell-wrap-height;
       overflow-wrap: break-word;
       text-overflow: clip;
       white-space: normal;
@@ -5273,8 +5285,8 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
-    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
-    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
+    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
+    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
       &:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
         background-color: $grid-hover-bg-color;

package/SCSS-Themes/grids/grid/bootstrap.scss

@@ -61,7 +61,7 @@ $grid-group-broder-color:  $content-border-color !default;
 $grid-group-hover-broder-color: $content-border-color !default;
 $grid-group-text-line-height: 24px !default;
 $filter-text-color: $content-font-color !default;
-$grid-wrap-line-height: 18px !default;
+$grid-wrap-line-height: 10px !default;
 $grid-wrap-margin-bottom: 2px !default;
 $grid-wrap-margin-top: 0 !default;
 
@@ -94,8 +94,8 @@ $grid-filterdiv-padding: 0 !default;
 $grid-headercelldiv-height: 29px !default;
 $grid-filterbarcell-input-height: 26px !default;
 $grid-sortnumber-border-radius: 65% !default;
-$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 5px !default;
-$grid-textwrap-srotnumber-margin: 3px 5px 0 2px !default;
+$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 20px !default;
+$grid-textwrap-srotnumber-margin: 3px -3px 0 2px !default;
 $grid-textwrap-sorticon-margin: -9px 10px !default;
 $grid-columnchooser-header-padding: 11px 18px 15px !default;
 $grid-columnchooser-toolbar-button-padding: 0 12px !default;
@@ -336,6 +336,8 @@ $grid-rtl-group-text-margin-left: 0 !default;
 $grid-rtl-group-sorticon-margin-right: -5px !default;
 $grid-rtl-headercell-border-width: 0 !default;
 $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
+$grid-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
+$grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
 $grid-ungroup-rtl-padding-right: -10px !default;
 $grid-headercelldiv-padding: 0 1.8em 0 .4em !default;
 $grid-headercell-div-padding: 0 .4em !default;
@@ -461,12 +463,12 @@ $grid-content-batch-font-color: $grid-content-font-color !default;
 $grid-bigger-group-headercell-hover-padding: $grid-bigger-group-headercell-padding !default;
 
 $grid-header-wrap-rightalign-sortfilter-div-margin: -30px -5px !default;
-$grid-header-wrap-filtericon-sortfilter-div-margin: -24px 28px -29px 0 !default;
+$grid-header-wrap-filtericon-sortfilter-div-margin: -30px 14px -29px 14px !default;
 $grid-bigger-wrap-sortdiv-margin: -31px 8px !default;
 $grid-bigger-wrap-rightalign-sortdiv-margin: -30px -5px !default;
 $grid-bigger-wrap-rightalign-fltricon-sortdiv-margin: -26px -20px 0 0 !default;
 $grid-bigger-wrap-fltricon-sortdiv-margin: -30px 28px -31px 0 !default;
-$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -24px 0 !default;
+$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -30px 14px !default;
 
 $grid-drag-font-size: 12px !default;
 $grid-drag-icon-font-weight: bold !default;
@@ -501,7 +503,7 @@ $grid-bigger-fltr-sortnumber-margin: $grid-bigger-sortnumber-margin !default;
 $grid-rtl-searchclear: 0 !default;
 $grid-column-chosser-searchdiv-top: -46px !default;
 $grid-reorderarrow-font-size: 10px !default;
-$grid-bigger-wrap-line-height: $grid-wrap-line-height !default;
+$grid-bigger-wrap-line-height: 18px !default;
 $grid-bigger-clone-padding: $grid-clone-padding !default;
 $grid-bigger-draganddrop-clone-padding: $grid-clone-padding !default;
 $grouped-bigger-text-font-size: 16px !default;
@@ -865,9 +867,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-bigger-rtl-headercelldiv-chkbox-padding;
     }
 
     .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2423,11 +2423,10 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-rtl-headercelldiv-chkbox-padding;
     }
 
+
     .e-filtermenudiv {
       float: $grid-fltrdiv-float;
       margin: $grid-fltrdiv-margin;
@@ -2540,7 +2539,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnmenu {
-      margin: $grid-textwrap-column-menu-margin;
+      line-height: $grid-wrap-line-height;
     }
 
     &.e-rtl .e-columnmenu {
@@ -2554,7 +2553,7 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-wrap {
       &.e-rtl  .e-columnmenu {
-        margin: $grid-rtl-textwrap-column-menu-margin;
+        line-height: $grid-wrap-line-height;
       }
     }
 
@@ -3736,6 +3735,13 @@ $grid-dropitems-count-margin-left: -8px !default;
         margin: $grid-rtl-headercelldiv-rightalign-fltricon-margin;
       }
 
+      &.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv,
+      & .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+        height: auto;
+        margin-bottom: $grid-wrap-margin-bottom;
+        margin-top: $grid-wrap-margin-top;
+      }
+
       & .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
         margin: $grid-rtl-headercelldiv-fltricon-margin;
       }
@@ -4054,7 +4060,8 @@ $grid-dropitems-count-margin-left: -8px !default;
     &.e-wrap {
       & .e-rowcell,
       & .e-columnheader .e-stackedheadercelldiv,
-      & .e-columnheader .e-headercelldiv {
+      & .e-columnheader .e-headercelldiv,
+      & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
         height: Auto;
         line-height: $grid-rowcell-wrap-height;
         overflow-wrap: break-word;
@@ -4070,25 +4077,30 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnheader .e-headercelldiv,
-    & .e-columnheader.e-wrap .e-headercelldiv {
+    &.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
       margin-bottom: $grid-wrap-margin-bottom;
       margin-top: $grid-wrap-margin-top;
     }
 
-    &.e-wrap .e-columnheader .e-filtermenudiv {
+    &.e-wrap .e-columnheader .e-filtermenudiv,
+    &.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
-    & .e-columnheader.e-wrap .e-filtermenudiv {
+    & .e-columnheader.e-wrap .e-filtermenudiv,
+    & .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
     & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv,
     & .e-columnheader.e-wrap .e-stackedheadercelldiv,
     & .e-gridcontent.e-wrap .e-rowcell,
     & .e-frozenhdrcont.e-wrap .e-rowcell {
       height: Auto;
-      line-height: $grid-wrap-line-height;
+      line-height: $grid-rowcell-wrap-height;
       overflow-wrap: break-word;
       text-overflow: clip;
       white-space: normal;
@@ -5275,8 +5287,8 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
-    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
-    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
+    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
+    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
       &:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
         background-color: $grid-hover-bg-color;

package/SCSS-Themes/grids/grid/bootstrap4.scss

@@ -59,7 +59,7 @@ $grid-group-broder-color:  $gray-600 !default;
 $grid-group-hover-broder-color: $gray-100 !default;
 $grid-group-text-line-height: 19px !default;
 $filter-text-color: #333 !default;
-$grid-wrap-line-height: 18px !default;
+$grid-wrap-line-height: 3px !default;
 $grid-wrap-margin-bottom: 2px !default;
 $grid-wrap-margin-top: 0 !default;
 
@@ -92,7 +92,7 @@ $grid-filterdiv-padding: 0 !default;
 $grid-headercelldiv-height: 29px !default;
 $grid-filterbarcell-input-height: 26px !default;
 $grid-sortnumber-border-radius: 65% !default;
-$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 10px !default;
+$grid-textwrap-srotnumber-rightalign-margin: 3px 2px 0 25px !default;
 $grid-textwrap-srotnumber-margin: 3px 5px 0 2px !default;
 $grid-textwrap-sorticon-margin: -9px 10px !default;
 $grid-columnchooser-header-padding: 11px 18px 15px !default;
@@ -337,6 +337,8 @@ $grid-rtl-group-text-margin-left: 0 !default;
 $grid-rtl-group-sorticon-margin-right: -10px !default;
 $grid-rtl-headercell-border-width: 0 !default;
 $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
+$grid-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
+$grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
 $grid-ungroup-rtl-padding-right: -12px !default;
 $grid-headercelldiv-padding: 0 20px 0 5px !default;
 $grid-headercell-div-padding: 0 .4em !default;
@@ -466,12 +468,12 @@ $grid-content-batch-font-color: $grid-content-font-color !default;
 $grid-bigger-group-headercell-hover-padding: $grid-bigger-group-headercell-padding !default;
 
 $grid-header-wrap-rightalign-sortfilter-div-margin: -34px -5px !default;
-$grid-header-wrap-filtericon-sortfilter-div-margin: -27px 20px -29px 0 !default;
+$grid-header-wrap-filtericon-sortfilter-div-margin: -35px 18px -29px 14px !default;
 $grid-bigger-wrap-sortdiv-margin: -31px 8px !default;
 $grid-bigger-wrap-rightalign-sortdiv-margin: -30px -5px !default;
 $grid-bigger-wrap-rightalign-fltricon-sortdiv-margin: -26px -20px 0 0 !default;
 $grid-bigger-wrap-fltricon-sortdiv-margin: -30px 28px -31px 0 !default;
-$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -28px 0 !default;
+$grid-header-wrap-filtericon-rightalign-sortfilter-div-margin: -35px 14px !default;
 $grid-drag-font-size: 12px !default;
 $grid-drag-icon-font-weight: bold !default;
 $grid-drag-move-icon: 10px !default;
@@ -869,9 +871,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-bigger-rtl-headercelldiv-chkbox-padding;
     }
 
     .e-gridheader .e-columnheader.e-wrap .e-sortfilterdiv,
@@ -2427,11 +2427,10 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-rtl .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-      @if $grid-skin == 'fluent' {
-        padding-right: 4px;
-      }
+      padding: $grid-rtl-headercelldiv-chkbox-padding;
     }
 
+
     .e-filtermenudiv {
       float: $grid-fltrdiv-float;
       margin: $grid-fltrdiv-margin;
@@ -2544,7 +2543,7 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnmenu {
-      margin: $grid-textwrap-column-menu-margin;
+      line-height: $grid-wrap-line-height;
     }
 
     &.e-rtl .e-columnmenu {
@@ -2558,7 +2557,7 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-wrap {
       &.e-rtl  .e-columnmenu {
-        margin: $grid-rtl-textwrap-column-menu-margin;
+        line-height: $grid-wrap-line-height;
       }
     }
 
@@ -3740,6 +3739,13 @@ $grid-dropitems-count-margin-left: -8px !default;
         margin: $grid-rtl-headercelldiv-rightalign-fltricon-margin;
       }
 
+      &.e-wrap .e-columnheader .e-rightalign.e-fltr-icon .e-headercelldiv,
+      & .e-columnheader.e-wrap .e-rightalign.e-fltr-icon .e-headercelldiv {
+        height: auto;
+        margin-bottom: $grid-wrap-margin-bottom;
+        margin-top: $grid-wrap-margin-top;
+      }
+
       & .e-gridheader .e-sortfilter .e-fltr-icon .e-headercelldiv {
         margin: $grid-rtl-headercelldiv-fltricon-margin;
       }
@@ -4058,7 +4064,8 @@ $grid-dropitems-count-margin-left: -8px !default;
     &.e-wrap {
       & .e-rowcell,
       & .e-columnheader .e-stackedheadercelldiv,
-      & .e-columnheader .e-headercelldiv {
+      & .e-columnheader .e-headercelldiv,
+      & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
         height: Auto;
         line-height: $grid-rowcell-wrap-height;
         overflow-wrap: break-word;
@@ -4074,25 +4081,30 @@ $grid-dropitems-count-margin-left: -8px !default;
     }
 
     &.e-wrap .e-columnheader .e-headercelldiv,
-    & .e-columnheader.e-wrap .e-headercelldiv {
+    &.e-wrap .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv {
       margin-bottom: $grid-wrap-margin-bottom;
       margin-top: $grid-wrap-margin-top;
     }
 
-    &.e-wrap .e-columnheader .e-filtermenudiv {
+    &.e-wrap .e-columnheader .e-filtermenudiv,
+    &.e-wrap .e-columnheader .e-sortfilterdiv .e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
-    & .e-columnheader.e-wrap .e-filtermenudiv {
+    & .e-columnheader.e-wrap .e-filtermenudiv,
+    & .e-columnheader.e-wrap .e-sortfilterdiv.e-filtermenudiv {
       line-height: $grid-wrap-line-height;
     }
 
     & .e-columnheader.e-wrap .e-headercelldiv,
+    & .e-columnheader.e-wrap .e-headercell.e-fltr-icon .e-headercelldiv,
     & .e-columnheader.e-wrap .e-stackedheadercelldiv,
     & .e-gridcontent.e-wrap .e-rowcell,
     & .e-frozenhdrcont.e-wrap .e-rowcell {
       height: Auto;
-      line-height: $grid-wrap-line-height;
+      line-height: $grid-rowcell-wrap-height;
       overflow-wrap: break-word;
       text-overflow: clip;
       white-space: normal;
@@ -5279,8 +5291,8 @@ $grid-dropitems-count-margin-left: -8px !default;
 
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
-    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
-    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):hover .e-rowdragdrop,
+    &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
+    &.e-rtl .e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
     &.e-gridhover tr[role = 'row']:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
       &:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
         background-color: $grid-hover-bg-color;