WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

assign job tabs style changed

Browse Source
This commit was merged in pull request #544.
This commit is contained in:
victorAnumudu
2024-01-09 15:24:14 +01:00
parent 8106f6a049
commit a176e8e6d5
1 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/jobPopout/JobListPopout.jsx
+7 -5
View File
@@ -294,14 +294,16 @@ const [requestStatus, setRequestStatus] = useState({message:'', status:false})
{/* ACTION SECTION */} {/* ACTION SECTION */}
<div className="p-4 w-full md:w-2/4 h-full"> <div className="p-4 w-full md:w-2/4 h-full">
<div className="grid grid-cols-3 my-4 border-b-2"> <div className="grid grid-cols-3 mt-4">
{tabs.map(item => ( {tabs.map(item => (
<button <button
className={`px-4 py-1 rounded-t-2xl ${selectedTab == item ? 'btn-gradient border-[2px] text-white' : 'bg-white text-[#000] border-t-[2px]'}`} // className={`px-4 py-1 rounded-t-2xl ${selectedTab == item ? 'btn-gradient border-[2px] text-white' : 'bg-white text-[#000] border-t-[2px]'}`}
className={`px-4 py-1 rounded-t-2xl border-t-[2px] transition-all duration-200 flex flex-col justify-center items-center ${selectedTab == item ? 'bg-red-50 dark:bg-[#D85A5A] text-slate-600 font-extrabold' : 'bg-white text-[#000]'}`}
value={item} value={item}
name={item} name={item}
onClick={()=>setSelectedTab(item)} onClick={()=>setSelectedTab(item)}
> >
<div className={`mb-[1px] h-6 w-6 border-4 rounded-full transition-all duration-200 ${selectedTab == item ? 'border-white bg-emerald-500' : 'border-red-50 dark:border-[#D85A5A] bg-white'}`}></div>
{item[0].toUpperCase() + item.slice(1)} {item[0].toUpperCase() + item.slice(1)}
</button> </button>
))} ))}
@@ -471,7 +473,7 @@ const JobFieldInput = ({
data, data,
}) => { }) => {
return ( return (
<div className="field w-full p-3 mb-2 bg-red-50 dark:bg-[#D85A5A] rounded-md"> <div className="field w-full p-3 mb-2 bg-red-50 dark:bg-[#D85A5A] rounded-b-2xl">
{select && ( {select && (
<> <>
<div className={`input-com ${parentClass}`}> <div className={`input-com ${parentClass}`}>
@@ -480,7 +482,7 @@ const JobFieldInput = ({
> >
{label && ( {label && (
<label <label
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block tracking-wide" className="input-label border-2 w-full border-sky-700 py-4 px-2 text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block tracking-wide"
htmlFor={inputName} htmlFor={inputName}
> >
{label} {label}
@@ -552,7 +554,7 @@ const JobFieldInput = ({
<InputCom <InputCom
fieldClass="px-6" fieldClass="px-6"
label={label} label={label}
labelClass="tracking-wide" labelClass="tracking-wide border-2 w-full border-sky-700 py-4 px-2"
type="email" type="email"
name={inputName} name={inputName}
placeholder={placeholder} placeholder={placeholder}