fix(react-grid-bootstrap-4): fix the 'Nothing to show' message (#816)

DevExpress · Mar 6, 2018 · 34167bb · 34167bb
1 parent 209d1c9
commit 34167bb
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/packages/dx-react-grid-bootstrap4/src/templates/empty-message.jsx b/packages/dx-react-grid-bootstrap4/src/templates/empty-message.jsx
@@ -4,10 +4,10 @@ import classNames from 'classnames';
 
 export const EmptyMessage = ({ getMessage, className, ...restProps }) => (
   <div
-    className={classNames('card-body', className)}
+    className={classNames('py-5 text-center', className)}
     {...restProps}
   >
-    {getMessage('noColumns')}
+    <big className="text-muted">{getMessage('noColumns')}</big>
   </div>
 );
 

diff --git a/packages/dx-react-grid-bootstrap4/src/templates/empty-message.test.jsx b/packages/dx-react-grid-bootstrap4/src/templates/empty-message.test.jsx
@@ -8,7 +8,7 @@ describe('EmptyMessage', () => {
       <EmptyMessage getMessage={key => key} />
     ));
 
-    expect(tree.find('.card-body').text()).toBe('noColumns');
+    expect(tree.find('div big.text-muted').text()).toBe('noColumns');
   });
 
   it('should pass the className prop to the root element', () => {
@@ -19,7 +19,7 @@ describe('EmptyMessage', () => {
       />
     ));
 
-    expect(tree.is('.card-body.custom-class'))
+    expect(tree.is('.py-5.text-center.custom-class'))
       .toBeTruthy();
   });