Compare commits

...

5 Commits

Author SHA1 Message Date
victorAnumudu 7111e81f11 added family account login input icon 2023-07-08 19:22:00 +01:00
CHIEFSOFT\ameye 1c64771dcd Job action area 2023-07-08 11:27:21 -04:00
CHIEFSOFT\ameye ac1a4f895a container max with for 4k screens 2023-07-08 11:05:20 -04:00
CHIEFSOFT\ameye 22f5bd01d2 log in error 2023-07-08 10:53:58 -04:00
ameye 467528835a Merge branch 'valid-email-pattern' of WrenchBoard/Users-Wrench into master 2023-07-08 14:36:10 +00:00
12 changed files with 49 additions and 24 deletions
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="identificationcard"><path fill="#4687ba" d="M0 6v13c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V6" class="color2d98d4 svgShape"></path><path fill="#ff6699" d="M22 3H2a2 2 0 0 0-2 2v2h24V5a2 2 0 0 0-2-2z" class="color0377be svgShape"></path><path fill="#e6e7f9" d="M22 3H2C.897 3 0 3.897 0 5v.25c0-1.103.897-2 2-2h20c1.103 0 2 .897 2 2V5c0-1.103-.897-2-2-2z" opacity=".2" class="colorffffff svgShape"></path><path fill="#4687ba" d="M22 20.75H2c-1.103 0-2-.897-2-2V19c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2v-.25c0 1.103-.897 2-2 2z" opacity=".1" class="color010101 svgShape"></path><path fill="#e6e7f9" d="M13 17h8v1h-8zM13 14h8v1h-8zM13 11h8v1h-8z" class="colorffffff svgShape"></path><circle cx="7" cy="12" r="2" fill="#e6e7f9" class="colorffffff svgShape"></circle><path fill="#e6e7f9" d="M9.987 15.237C9.288 14.9 8.203 14.5 7 14.5s-2.288.4-2.987.737c-.625.3-1.013.9-1.013 1.566V18h8v-1.197c0-.665-.388-1.265-1.013-1.566z" class="colorffffff svgShape"></path><circle cx="17" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M17 4.25a.99.99 0 0 1 .975.875C17.98 5.082 18 5.045 18 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 17 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="a" x1="6.973" x2="21.55" y1="1.973" y2="16.55" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#010101" stop-opacity=".1" class="stopColor010101 svgShape"></stop><stop offset="1" stop-color="#010101" stop-opacity="0" class="stopColor010101 svgShape"></stop></linearGradient><path fill="url(#a)" d="M22 21c1.103 0 2-.897 2-2V7H0l14 14h8z"></path><circle cx="7" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M7 4.25a.99.99 0 0 1 .975.875C7.98 5.082 8 5.045 8 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 7 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="b" x1="-.708" x2="24.708" y1="6.074" y2="17.925" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff" stop-opacity=".2" class="stopColorffffff svgShape"></stop><stop offset="1" stop-color="#ffffff" stop-opacity="0" class="stopColorffffff svgShape"></stop></linearGradient><path fill="url(#b)" d="M22 3H2a2 2 0 0 0-2 2v14c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V5a2 2 0 0 0-2-2z"></path></svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 128 128" viewBox="0 0 128 128" id="Pin"><path fill="#4687ba" d="M106,13.8L91.7,4.6C86.2,1,78.9,2,74.5,7L41.9,46.9c-9.1,0.4-17.9,3.3-25.4,8.7c-0.7,0.5-0.7,1.6,0.1,2.1
l10.2,6.6l0,0L46.4,77l-24,41.4c-1.2,2.1-0.7,4.9,1.4,6.3c2.2,1.6,5.2,1.1,6.7-1.1l28-38.8L78,97.5l0,0l10.2,6.6
c0.7,0.5,1.7,0.1,1.9-0.8c1.8-9,0.9-18.3-2.5-26.8l23.1-46C113.6,24.5,111.5,17.4,106,13.8z" class="color2d3e50 svgShape"></path></svg>

After

Width:  |  Height:  |  Size: 482 B

+19 -11
View File
@@ -22,6 +22,8 @@ export default function Login() {
const [checked, setValue] = useState(false);
const [loginLoading, setLoginLoading] = useState(false);
const [showPassword, setShowPassword] = useState(false);
//login error state
const [loginError, setLoginError] = useState(false);
// for the catch error
@@ -31,6 +33,11 @@ export default function Login() {
setValue(!checked);
};
// To Show and Hide Password
const togglePasswordVisibility = () => {
setShowPassword(!showPassword);
};
//FUNCTION TO DETERMINE/CHANGE LOGIN COMPONENT
const handleLoginType = ({ target: { name } }) => {
setLoginType(name);
@@ -189,7 +196,7 @@ export default function Login() {
/>
</Link>
</div>
<div className="content-wrapper login shadow-md w-full lg:max-w-[500px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5">
<div className="content-wrapper login shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5">
<div className="w-full">
<div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
{/* <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
@@ -211,7 +218,7 @@ export default function Login() {
<button
name="full"
className={`login-type-btn px-4 py-1 rounded-t-2xl ${
loginType=='full' ? "bg-white text-[#000] border-t-[2px]" : "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
loginType=='full' ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
}`}
onClick={handleLoginType}
>
@@ -220,7 +227,7 @@ export default function Login() {
<button
name="family"
className={`login-type-btn px-4 py-1 rounded-t-2xl ${
loginType=='family' ? "bg-white text-[#000] border-t-[2px]" : "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
loginType=='family' ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
}`}
onClick={handleLoginType}
>
@@ -234,7 +241,7 @@ export default function Login() {
{
loginType == 'full' ? (
//user login component
<div className="p-2 input-area login-area border-2 border-[#4687ba] rounded-2xl">
<div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
<div className="input-item mb-5">
<InputCom
labelClass="tracking-wider"
@@ -258,8 +265,9 @@ export default function Login() {
placeholder="● ● ● ● ● ●"
label="Password"
name="password"
type="password"
iconName="password"
type={showPassword ? "text" : "password"}
onClick={togglePasswordVisibility}
passIcon={showPassword ? "password" : "password"}
forgotPassword
/>
</div>
@@ -322,7 +330,7 @@ export default function Login() {
) : (
// END of user login compoenent
// family login compoenent
<div className="p-2 input-area login-area border-2 border-[#4687ba] rounded-2xl">
<div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
<div className="input-item mb-5">
<InputCom
labelClass="tracking-wider"
@@ -333,7 +341,7 @@ export default function Login() {
label="Username"
name="email"
type="email"
iconName="message"
iconName="family-id"
/>
</div>
@@ -346,9 +354,9 @@ export default function Login() {
placeholder="● ● ● ● ● ●"
label="Pin"
name="password"
type="password"
iconName="password"
// forgotPassword
type={showPassword ? "text" : "password"}
onClick={togglePasswordVisibility}
passIcon={showPassword ? "family-pin" : "family-pin"}
/>
</div>
{loginError && (
+10 -4
View File
@@ -72,6 +72,12 @@ export default function SignUp() {
return setTimeout(()=>{setMsgError("");},3000)
}
//checks if terms and condition is checked
if (!checked) {
setMsgError("Terms and condition required");
return setTimeout(()=>{setMsgError("");},3000)
}
setSignUpLoading(true);
const reqData = {
country: country,
@@ -89,7 +95,7 @@ export default function SignUp() {
if (res.status === 200) {
const { data } = res;
if (data && data.acc === "DULPICATE") {
setMsgError("This account has been already created");
setMsgError("Unable to use this username. Please try another username.");
setSignUpLoading(false);
}
if (data && data.status === "1") {
@@ -131,7 +137,7 @@ export default function SignUp() {
/>
</Link>
</div>
<div className="content-wrapper login shadow-md w-full lg:max-w-[500px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5 mb-0">
<div className="content-wrapper login relative shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5 mb-0">
<div>
<div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
<h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
@@ -213,7 +219,7 @@ export default function SignUp() {
/>
</div>
{msgError && (
<div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
<div className="p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
{msgError}
</div>
)}
@@ -298,7 +304,7 @@ const SelectOption = ({
<select
name={name}
id={name}
className="input-wrapper border border-[#f5f8fa]] dark:border-[#5e6278] w-full rounded-[0.475rem] h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
onChange={inputHandler}
value={value}
>
+5 -1
View File
@@ -519,7 +519,11 @@ export default function Icons({ name }) {
<img className="w-[17px] h-[17px]" src={localImgLoad('images/icons/market.svg')} alt="market" />
) : name === "new-mytask" ? (
<img className="w-[17px] h-[17px]" src={localImgLoad('images/icons/my-task.svg')} alt="task" />
) : (
) : name === "family-id" ? (
<img className="w-[20px] h-[20px]" src={localImgLoad('images/icons/family-id.svg')} alt="family-id" />
) : name === "family-pin" ? (
<img className="w-[20px] h-[20px]" src={localImgLoad('images/icons/family-pin.svg')} alt="family-pin" />
): (
""
)}
</>
@@ -2,7 +2,7 @@ import React from 'react'
function CurrentJobAction() {
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<p className="my-3 py-1 text-base active-owner">
<table className="w-full text-sm text-left text-gray-500">
<tbody>
@@ -60,7 +60,7 @@ function CurrentTaskAction({jobDetails}) {
}
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<table className="w-full text-sm text-left text-gray-500 active-worker">
<tbody>
@@ -101,7 +101,7 @@ function PastDueJobAction({jobDetails}) {
}
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<table className="w-full text-sm text-left text-gray-500 owner-pastdue">
<tbody>
@@ -2,7 +2,7 @@ import React from 'react'
function PastDueTaskAction() {
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<table className="w-full text-sm text-left text-gray-500 worker-pastdue">
<tbody>
@@ -90,7 +90,7 @@ function ReviewJobAction({jobDetails}) {
})
}
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<div className="my-3 py-1 text-base">
<table className="w-full text-sm text-left text-gray-500 review-owner">
<tbody>
@@ -2,7 +2,7 @@ import React from 'react'
function ReviewTaskAction() {
return (
<div className='job-action bg-white dark:bg-black'>
<div className='job-action dark:bg-black'>
<p className="my-3 py-1 text-base text-dark-gray dark:text-white">
Waiting for the completion message from the client before you can approve. Worker True & Review Job
</p>
+5 -2
View File
@@ -3,7 +3,9 @@
font-family: "Product Sans";
src: url("./assets/fonts/Product Sans Regular.ttf");
}
.nft-main-container{
max-width: 1200px;
}
/* Bold Weight */
@font-face {
font-family: "Product Sans";
@@ -30,9 +32,10 @@
}
.job-action{
background-color: lightgoldenrodyellow;
background-color: aliceblue;
height: 100px;
border-radius: 15px;
padding: 5px;
}
.msg_box{