🎨 Fluent: Insert group header indicator (#25598)

DevExpress · Sep 15, 2023 · 82afa9b · 82afa9b
1 parent 2c7122f
commit 82afa9b
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 11 deletions.
diff --git a/...s/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts b/...s/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts
@@ -359,7 +359,7 @@ class BlockSeparatorView extends SeparatorView {
     if ($element && !that._isShown) {
       switch (targetLocation) {
         case 'group':
-          startAnimate({ width: '50px', display: 'inline-block' });
+          this.element().css('display', 'block');
           break;
         case 'columnChooser':
           startAnimate({ width: '100%', display: 'block' });

diff --git a/packages/devextreme/scss/widgets/base/dataGrid/_common.scss b/packages/devextreme/scss/widgets/base/dataGrid/_common.scss
@@ -44,11 +44,8 @@
   }
 
   .dx-block-separator {
-    @include dx-group-panel-item();
-
-    color: transparent;
     position: relative;
-    min-width: 0;
+    border-radius: 3px;
   }
 }
 

diff --git a/packages/devextreme/scss/widgets/fluent/dataGrid/_index.scss b/packages/devextreme/scss/widgets/fluent/dataGrid/_index.scss
@@ -55,8 +55,7 @@
     margin-right: $fluent-grid-base-grouppanel-item-margin;
     color: $datagrid-columnchooser-item-color;
     font-weight: $datagrid-columnchooser-font-weight;
-    padding: $fluent-datagrid-cell-padding;
-    background-color: $datagrid-block-separator-bg;
+    background-color: $base-accent;
   }
 
   .dx-sort {

diff --git a/packages/devextreme/scss/widgets/generic/dataGrid/_index.scss b/packages/devextreme/scss/widgets/generic/dataGrid/_index.scss
@@ -52,8 +52,7 @@
     margin-right: $generic-grid-base-grouppanel-item-margin;
     color: $datagrid-columnchooser-item-color;
     font-weight: $datagrid-columnchooser-font-weight;
-    padding: $generic-datagrid-cell-padding + 1;
-    background-color: $datagrid-block-separator-bg;
+    background-color: $base-accent;
   }
 
   .dx-sort {

diff --git a/packages/devextreme/scss/widgets/material/dataGrid/_index.scss b/packages/devextreme/scss/widgets/material/dataGrid/_index.scss
@@ -55,8 +55,7 @@
     margin-right: $material-grid-base-grouppanel-item-margin;
     color: $datagrid-columnchooser-item-color;
     font-weight: $datagrid-columnchooser-font-weight;
-    padding: $material-datagrid-cell-padding;
-    background-color: $datagrid-block-separator-bg;
+    background-color: $base-accent;
   }
 
   .dx-sort {