refined react elastic readme

Author: nirajprakash

README.md

@@ -1,4 +1,20 @@
 
+![A Banner](images/swampedtv_banner.webp)
+
+
+
+### Next.js Analytics with Redux: Harnessing Elasticsearch for Actionable Insights
+
+
+Swamped TV Dashboard is a Next.js-powered analytics platform tailored for setup box data analysis. Harnessing the power of Elasticsearch, it offers insights into channel performance, top channels, slow channels, device monitoring, and configuration. Built with a modular Redux store and intuitive UI components.
+
+
+[![A Screen](images/swampedtv_screen.webp)](https://react-elastic.junkielabs.in)
+
+
+
+
+
 ## Project Overview
 
 This dashboard is designed to analyze and visualize data retrieved from an Elasticsearch database. It offers insights into various aspects of setup box data, such as channel performance, top channels, slow channels, device monitoring, and configuration details.

images/swampedtv_banner.webp

@@ -33,10 +33,10 @@ export class UiResourceColor {
         "#f9e370",
 
         //light Blue
-        "#81bDe9",
+        "#67a9d9",
 
         //pink:
-        "#f5afc8",
+        "#fb8eb4",
         //lightClay:
         "#cbc396",
 

images/swampedtv_screen.webp

@@ -162,7 +162,7 @@ const DeviceTableRow: FC<DeviceTableRowProps> = (props) => {
 
   return (
     <React.Fragment>
-      <tr key={row?.id}  onClick={(event) => handleClick(event, row.deviceId)}>
+      <tr key={row?.id} className="td-cursor-pointer"  onClick={(event) => handleClick(event, row.deviceId)}>
         <td>
           <IconButton
             aria-label="expand row"