Improve selection color of datatable

Summary:
DataTable selected rows are a bit hard to spot when changing search, scrolling etc, so give them a bit more prominent background

Changelog: DataTable: more pronounced background color for selections

Reviewed By: aigoncharov

Differential Revision: D36736495

fbshipit-source-id: 2cab9eb99594ffaaccdd9ebe0d922691adb27bdc

desktop/flipper-plugin/src/ui/data-table/TableRow.tsx

@@ -26,7 +26,7 @@ type TableBodyRowContainerProps = {
 
 const backgroundColor = (props: TableBodyRowContainerProps) => {
   if (props.highlighted) {
-    return theme.backgroundWash;
+    return theme.selectionBackgroundColor;
   }
   return undefined;
 };

desktop/flipper-plugin/src/ui/theme.tsx

@@ -22,6 +22,7 @@ export const theme = {
   textColorPlaceholder: 'var(--flipper-text-color-placeholder)',
   textColorActive: 'var(--light-color-button-active)',
   searchHighlightBackground: antColors.yellow[3],
+  selectionBackgroundColor: 'var(--flipper-primary-background-wash)',
   disabledColor: 'var(--flipper-disabled-color)',
   backgroundDefault: 'var(--flipper-background-default)',
   backgroundWash: 'var(--flipper-background-wash)',

desktop/themes/base.less

@@ -52,6 +52,7 @@
   --flipper-disabled-color: @disabled-color;
   --flipper-background-default: @background-default;
   --flipper-background-wash: @background-wash;
+  --flipper-primary-background-wash: mix(@primary-color, @background-default, 25%);
   --flipper-button-default-background: @button-default-background;
   --flipper-background-transparent-hover: @background-transparent-hover;
   --flipper-divider-color: @divider-color;