From 0f5ab33ffe7db83255313f38629d4c6fe6fa5c1e Mon Sep 17 00:00:00 2001
From: Joshua T Flowers <joshuatf@gmail.com>
Date: Thu, 18 Oct 2018 14:45:06 -0400
Subject: [PATCH] Update sorted column background color
 (https://github.com/woocommerce/woocommerce-admin/pull/571)

---
 .../woocommerce-admin/client/components/table/style.scss   | 7 +++++++
 plugins/woocommerce-admin/client/components/table/table.js | 1 +
 2 files changed, 8 insertions(+)

diff --git a/plugins/woocommerce-admin/client/components/table/style.scss b/plugins/woocommerce-admin/client/components/table/style.scss
index 15e991a4080..b5260576bc3 100644
--- a/plugins/woocommerce-admin/client/components/table/style.scss
+++ b/plugins/woocommerce-admin/client/components/table/style.scss
@@ -80,6 +80,9 @@
 	tr:hover,
 	tr:focus-within {
 		background-color: $core-grey-light-200;
+		td {
+			background: transparent;
+		}
 	}
 }
 
@@ -125,6 +128,10 @@
 		max-width: 40px;
 	}
 
+	&.is-sorted {
+		background-color: $core-grey-light-100;
+  }
+  
 	&.is-checkbox-column {
 		width: 33px;
 		max-width: 33px;
diff --git a/plugins/woocommerce-admin/client/components/table/table.js b/plugins/woocommerce-admin/client/components/table/table.js
index babfca831cd..6dde99d1caf 100644
--- a/plugins/woocommerce-admin/client/components/table/table.js
+++ b/plugins/woocommerce-admin/client/components/table/table.js
@@ -198,6 +198,7 @@ class Table extends Component {
 									const cellClasses = classnames( 'woocommerce-table__item', cellClassName, {
 										'is-left-aligned': isLeftAligned,
 										'is-numeric': isNumeric,
+										'is-sorted': sortedBy === headers[ j ].key,
 									} );
 									return (
 										<Cell scope={ isHeader ? 'row' : null } key={ j } className={ cellClasses }>