From 42fea9b6802af712ccf090377eb159b04155feef Mon Sep 17 00:00:00 2001
From: Shashank Yadav <97789487+Shashank2104125@users.noreply.github.com>
Date: Wed, 22 Mar 2023 16:30:07 +0530
Subject: [PATCH 1/2] improve UI of userDetail page

---
 src/pages/index.js                            |  6 +++++-
 .../src/component/userDetail/index.js         | 19 ++++++++++++++++++-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/pages/index.js b/src/pages/index.js
index 114555bb..95d68e01 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,7 +1,10 @@
 import React from "react"
+import Report from "../../themes/learning-management-system/learning-management-theme/src/component/report"
+import UserDetail from "../../themes/learning-management-system/learning-management-theme/src/component/userDetail"
 
 const ExamplePage = () => {
-  return (
+  return (<>
+    <UserDetail/>
     <div
       style={{
         position: "absolute",
@@ -15,6 +18,7 @@ const ExamplePage = () => {
         Start editing the 'pages/index.js' file to import and show component
       </h3>
     </div>
+    </>
   )
 }
 
diff --git a/themes/learning-management-system/learning-management-theme/src/component/userDetail/index.js b/themes/learning-management-system/learning-management-theme/src/component/userDetail/index.js
index 1ca57fa2..b309776d 100644
--- a/themes/learning-management-system/learning-management-theme/src/component/userDetail/index.js
+++ b/themes/learning-management-system/learning-management-theme/src/component/userDetail/index.js
@@ -9,6 +9,17 @@ import Styles from "./styles"
 import { useMediaQuery } from "@material-ui/core"
 
 const UserDetail = () => {
+  
+  const [isHovering, setIsHovering] = useState(false);
+
+  const handleMouseEnter = () => {
+    setIsHovering(true);
+  };
+
+  const handleMouseLeave = () => {
+    setIsHovering(false);
+  };
+
   const classes = Styles()
   const matchesMD = useMediaQuery(theme => theme.breakpoints.down("sm"))
   const [inputValues, setInputValues] = useState({
@@ -97,7 +108,13 @@ const UserDetail = () => {
       </Grid>
       <Grid item container justifyContent="center">
         <Grid item>
-          <Button onClick={() => {}} classes={{ root: classes.logoutBtnStyle }}>
+          <Button onClick={() => {}} classes={{ root: classes.logoutBtnStyle }}
+           style={{
+            backgroundColor: isHovering ? 'red' : '',
+          }}
+          onMouseEnter={handleMouseEnter}
+          onMouseLeave={handleMouseLeave}
+          >
             <Typography variant="h6">Log out</Typography>
           </Button>
         </Grid>

From a13a0a244d9dc7c034b86dc58b7fc25e2fd0e12c Mon Sep 17 00:00:00 2001
From: Shashank Yadav <97789487+Shashank2104125@users.noreply.github.com>
Date: Mon, 27 Mar 2023 15:58:53 +0530
Subject: [PATCH 2/2] handling ui of complain section of customer-service-theme

---
 src/pages/index.js                            |  4 --
 .../src/components/complain/index.js          | 38 ++++++++++++++-----
 .../src/components/complain/styles.js         |  2 +-
 3 files changed, 30 insertions(+), 14 deletions(-)

diff --git a/src/pages/index.js b/src/pages/index.js
index 95d68e01..dbfa68a4 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,10 +1,6 @@
 import React from "react"
-import Report from "../../themes/learning-management-system/learning-management-theme/src/component/report"
-import UserDetail from "../../themes/learning-management-system/learning-management-theme/src/component/userDetail"
-
 const ExamplePage = () => {
   return (<>
-    <UserDetail/>
     <div
       style={{
         position: "absolute",
diff --git a/themes/customer-service/customer-service-theme/src/components/complain/index.js b/themes/customer-service/customer-service-theme/src/components/complain/index.js
index 6281d91a..da2132a8 100644
--- a/themes/customer-service/customer-service-theme/src/components/complain/index.js
+++ b/themes/customer-service/customer-service-theme/src/components/complain/index.js
@@ -16,16 +16,24 @@ const Complain = () => {
     setInputDetails({ issue: "", message: "", name: "" })
   }
   return (
-    <Grid container direction="column" classes={{ root: classes.container }}>
-      <Grid item>
+    <Grid container direction="column" classes={{ root: classes.container }}
+   
+    >
+      <Grid item  style={{
+      margin:"auto"
+    }}>
         <Typography variant="h4">Submit a complaint</Typography>
       </Grid>
+
       <Grid
         item
         container
         direction="row"
         justifyContent="space-between"
         classes={{ root: classes.wrapper }}
+        style={{
+          margin:"auto"
+        }}
       >
         <Grid item>
           <Grid
@@ -33,11 +41,19 @@ const Complain = () => {
             direction="column"
             alignItems="center"
             classes={{ root: classes.space }}
-          >
-            <Grid item>
-              <Typography variant="h4">What is about?</Typography>
+            style={{
+              margin:"auto"
+            }}>
+            <Grid item  style={{
+      margin:"auto"
+    }}>
+              <Typography variant="h4"  style={{
+      margin:"auto"
+    }}>What is about?</Typography>
             </Grid>
-            <Grid item>
+            <Grid item  style={{
+      margin:"auto"
+    }}>
               <TextField
                 value={inputDetails.issue}
                 placeholder="Eg: payment issue"
@@ -90,7 +106,7 @@ const Complain = () => {
               Username related to the complaint(optional)
             </Typography>
           </Grid>
-          <Grid item>
+          <Grid item >
             <TextField
               value={inputDetails.name}
               placeholder="Eg: Type name here"
@@ -108,8 +124,12 @@ const Complain = () => {
           </Grid>
         </Grid>
       </Grid>
-      <Grid item>
-        <Button classes={{ root: classes.btnStyle }} onClick={btnHandler}>
+      <Grid item  style={{
+      margin:"auto"
+    }}>
+        <Button classes={{ root: classes.btnStyle }} onClick={btnHandler}  style={{
+      margin:"auto"
+    }}>
           <Typography variant="h3">Submit</Typography>
         </Button>
       </Grid>
diff --git a/themes/customer-service/customer-service-theme/src/components/complain/styles.js b/themes/customer-service/customer-service-theme/src/components/complain/styles.js
index 1b3adcbb..e01990de 100644
--- a/themes/customer-service/customer-service-theme/src/components/complain/styles.js
+++ b/themes/customer-service/customer-service-theme/src/components/complain/styles.js
@@ -42,7 +42,7 @@ const Styles = makeStyles(theme => ({
     borderRadius: 10,
     backgroundColor: theme.palette.primary.light,
     textTransform: "none",
-    "&:hover": { backgroundColor: theme.palette.primary.light },
+    "&:hover": { backgroundColor: theme.palette.primary.main },
   },
   "@global": {
     ".MuiInput-underline:before, .MuiInput-underline:hover:not(.Mui-disabled):before": {