Job actions

src/components/MyActiveJobs/JobActions/CurrentJobAction.jsx

@@ -2,8 +2,8 @@ import React from 'react'
 
 function CurrentJobAction() {
   return (
-    <div className=''>
-      <p className="my-3 py-1 text-base">
+    <div className='job-action'>
+      <p className="my-3 py-1 text-base active-owner">
           <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
               <tbody>
               <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">

src/components/MyActiveJobs/JobActions/CurrentTaskAction.jsx

@@ -33,12 +33,11 @@ function CurrentTaskAction({jobDetails}) {
     }
 
   return (
-    <div className=''>
-
-          <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
+    <div className='job-action'>
+          <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 active-worker">
               <tbody>
               <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
-                  <td className=" py-4">
+                  <td>
                       <div className="flex space-x-2 items-center w-full">
                           <div className="flex flex-col flex-[0.9]">
                               <h1 className="font-bold text-xl text-dark-gray dark:text-white">
@@ -48,7 +47,7 @@ function CurrentTaskAction({jobDetails}) {
                       </div>
                   </td>
 
-                  <td className="text-right py-4 px-2">
+                  <td className="text-right px-2">
                       <div className="flex justify-center items-center">
                           <button onClick={popUpHandler} type="button" className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white">
                               Set Status

src/components/MyActiveJobs/JobActions/PastDueJobAction.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 
 function PastDueJobAction() {
   return (
-    <div className=''>
+    <div className='job-action'>
       <p className="my-3 py-1 text-base">
         Waiting for the completion message from the client before you can approve. Owner True & PastDue
       </p>

src/components/MyActiveJobs/JobActions/PastDueTaskAction.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 
 function PastDueTaskAction() {
   return (
-    <div className=''>
+    <div className='job-action'>
       <p className="my-3 py-1 text-base">
         Waiting for the completion message from the client before you can approve. Worker True & PastDue
       </p>

src/components/MyActiveJobs/JobActions/ReviewJobAction.jsx

@@ -2,9 +2,9 @@ import React from 'react'
 
 function ReviewJobAction() {
   return (
-    <div className=''>
+    <div className='job-action'>
       <p className="my-3 py-1 text-base">
-          <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
+          <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 review-owner">
               <tbody>
               <tr className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50">
                   <td className=" py-4">

src/components/MyActiveJobs/JobActions/ReviewTaskAction.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 
 function ReviewTaskAction() {
   return (
-    <div className=''>
+    <div className='job-action'>
       <p className="my-3 py-1 text-base">
         Waiting for the completion message from the client before you can approve. Worker True & Review Job
       </p>

src/index.css

@@ -9,6 +9,12 @@
   font-family: "Product Sans";
   src: url("./assets/fonts/Product Sans Bold.ttf");
 }
+.job-action{
+  background-color: lightgoldenrodyellow;
+  height: 100px;
+  border-radius: 15px;
+}
+
 .msg_box{
   background-color: aliceblue;
   margin: 5px;