From 9effb75c73529b8c685c5d7d5fa0136ae4849b10 Mon Sep 17 00:00:00 2001
From: Timmy Crawford <timmydcrawford@gmail.com>
Date: Thu, 9 Aug 2018 11:16:30 -0700
Subject: [PATCH] Add table styling.

---
 .../dashboard/top-selling-products/index.js   | 21 +++++++------------
 .../dashboard/top-selling-products/style.scss | 13 ++++++++++++
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/plugins/woocommerce-admin/client/dashboard/top-selling-products/index.js b/plugins/woocommerce-admin/client/dashboard/top-selling-products/index.js
index 9df89e08582..1dcf002464c 100644
--- a/plugins/woocommerce-admin/client/dashboard/top-selling-products/index.js
+++ b/plugins/woocommerce-admin/client/dashboard/top-selling-products/index.js
@@ -4,15 +4,16 @@
  */
 import { __ } from '@wordpress/i18n';
 import { Component } from '@wordpress/element';
-import { map, noop } from 'lodash';
+import { map } from 'lodash';
 
 /**
  * Internal dependencies
  */
+import Card from 'components/card';
 import { getAdminLink } from 'lib/nav-utils';
 import { numberFormat } from 'lib/number';
 import { formatCurrency, getCurrencyFormatDecimal } from 'lib/currency';
-import { TableCard } from 'components/table';
+import { Table } from 'components/table';
 import './style.scss';
 
 // Mock data until we fetch from an API
@@ -83,20 +84,12 @@ class TopSellingProducts extends Component {
 	render() {
 		const rows = this.getRowsContent( mockData ) || [];
 		const headers = this.getHeadersContent();
-		const query = {
-			per_page: 5,
-			total: 5,
-		};
+		const title = __( 'Top Selling Products', 'wc-admin' );
 
 		return (
-			<TableCard
-				title={ __( 'Top Selling Products', 'wc-admin' ) }
-				rows={ rows }
-				headers={ headers }
-				onQueryChange={ noop }
-				query={ query }
-				isCompact
-			/>
+			<Card title={ title } className="woocommerce-top-selling-products">
+				<Table caption={ title } rows={ rows } headers={ headers } />
+			</Card>
 		);
 	}
 }
diff --git a/plugins/woocommerce-admin/client/dashboard/top-selling-products/style.scss b/plugins/woocommerce-admin/client/dashboard/top-selling-products/style.scss
index 1a1f0eb8760..0591b7c8bd4 100644
--- a/plugins/woocommerce-admin/client/dashboard/top-selling-products/style.scss
+++ b/plugins/woocommerce-admin/client/dashboard/top-selling-products/style.scss
@@ -1 +1,14 @@
 /** @format */
+.woocommerce-top-selling-products {
+	.woocommerce-card__body {
+		padding: 0;
+	}
+
+	.woocommerce-table__table {
+		margin-bottom: 0;
+
+		tr:last-child {
+			border-bottom-style: none;
+		}
+	}
+}