From 6d10a5dd4c9464928f47c2b16285a82dfb6e5c92 Mon Sep 17 00:00:00 2001
From: aquarium <peter@vashevko.com>
Date: Mon, 21 Oct 2019 03:27:06 -0400
Subject: [PATCH] Split data table background color into separate theme
 variable (#4031)

* Split data table background color into separate theme variable

* Remove reference to MDC in data table theme variable name
---
 src/components/data-table/ha-data-table.ts | 2 +-
 src/resources/ha-style.ts                  | 3 +++
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/data-table/ha-data-table.ts b/src/components/data-table/ha-data-table.ts
index d009bd8c77..0fa519b4d9 100644
--- a/src/components/data-table/ha-data-table.ts
+++ b/src/components/data-table/ha-data-table.ts
@@ -427,7 +427,7 @@ export class HaDataTable extends BaseElement {
       }
 
       .mdc-data-table {
-        background-color: var(--card-background-color);
+        background-color: var(--data-table-background-color);
         border-radius: 4px;
         border-width: 1px;
         border-style: solid;
diff --git a/src/resources/ha-style.ts b/src/resources/ha-style.ts
index 88b9552598..0ab68dbaa2 100644
--- a/src/resources/ha-style.ts
+++ b/src/resources/ha-style.ts
@@ -123,6 +123,9 @@ documentContainer.innerHTML = `<custom-style>
       --paper-slider-container-color: var(--slider-bar-color);
       --ha-paper-slider-pin-font-size: 15px;
 
+      /* set data table style */
+      --data-table-background-color: var(--card-background-color);
+
       /* rgb */
       --rgb-primary-color: 3, 169, 244;
       --rgb-accent-color: 255, 152, 0;