From 6988b9a08655a7a26f2eac5bb91646a433e06f4e Mon Sep 17 00:00:00 2001
From: Balaguru Ragupathi <61746056+Balaguru4580@users.noreply.github.com>
Date: Tue, 6 Apr 2021 06:02:57 +0530
Subject: [PATCH] Improved Header Readability for Songs List (#985)

* style(SongDataGrid): Table Header Definition - #943

Signed-off-by: Balaguru4580 <balaguru4580@gmail.com>

* style(SongDataGrid): Improved Header Readability - #943

Signed-off-by: Balaguru4580 <balaguru4580@gmail.com>

* Shadow Effect

* Shadow Effect Opacity Adjustment

* Fixed Songs Context Menu

* Fixed the Songs Context Menu
---
 ui/src/common/SongDatagrid.js | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/ui/src/common/SongDatagrid.js b/ui/src/common/SongDatagrid.js
index 2a7d35161..6985121e1 100644
--- a/ui/src/common/SongDatagrid.js
+++ b/ui/src/common/SongDatagrid.js
@@ -28,6 +28,15 @@ const useStyles = makeStyles({
       },
     },
   },
+  headerStyle: {
+    '& thead': {
+      boxShadow: '0px 3px 3px rgba(0, 0, 0, 0.15)',
+    },
+    '& th': {
+      fontWeight: 'bold',
+      padding: '15px',
+    },
+  },
   contextMenu: {
     visibility: 'hidden',
   },
@@ -178,8 +187,10 @@ export const SongDatagrid = ({
   showDiscSubtitles,
   ...rest
 }) => {
+  const classes = useStyles()
   return (
     <Datagrid
+      className={classes.headerStyle}
       {...rest}
       body={
         <SongDatagridBody