From 58b8c66a89917e9ff09edcdc3cfcb55386fea887 Mon Sep 17 00:00:00 2001
From: Daan Vanden Bosch <daan.v.d.bosch@gmail.com>
Date: Thu, 13 Jun 2019 13:41:15 +0200
Subject: [PATCH] Fixed bug that made DataTable background and border
 dissappear while antd animates dropdowns in Chrome.

---
 src/ui/dataTable.less | 7 +++++--
 src/ui/dataTable.tsx  | 5 ++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/ui/dataTable.less b/src/ui/dataTable.less
index 4c7c1ae3..93335a38 100644
--- a/src/ui/dataTable.less
+++ b/src/ui/dataTable.less
@@ -1,9 +1,12 @@
 @import "./theme.less";
 
-.DataTable > * {
+.DataTable {
+    // position: relative; necessary to avoid background and border dissappearing while antd
+    // animates dropdowns in Chrome. No idea why this prevents it...
+    position: relative;
     border: solid 1px @border-color-base;
     background-color: lighten(@component-background, 3%);
-    
+
     & * {
         scrollbar-color: @table-scrollbar-thumb-color @table-scrollbar-color;
     }
diff --git a/src/ui/dataTable.tsx b/src/ui/dataTable.tsx
index 28b4efe3..21a50571 100644
--- a/src/ui/dataTable.tsx
+++ b/src/ui/dataTable.tsx
@@ -36,7 +36,10 @@ export class DataTable<T> extends React.Component<{
 }> {
     render() {
         return (
-            <div className="DataTable">
+            <div
+                className="DataTable"
+                style={{ width: this.props.width, height: this.props.height }}
+            >
                 <MultiGrid
                     width={this.props.width}
                     height={this.props.height}