replace add phone & email button with icon-only element for cleaner UI
This commit is contained in:
parent
597fa279ea
commit
3a6be65a48
@ -204,23 +204,22 @@ useEffect(() => {
|
|||||||
placeholder="email@example.com"
|
placeholder="email@example.com"
|
||||||
/>
|
/>
|
||||||
{index === emailFields.length - 1 ? (
|
{index === emailFields.length - 1 ? (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-primary ms-1"
|
// className="btn btn-xs btn-primary ms-1"
|
||||||
onClick={handleAddEmail}
|
// onClick={handleAddEmail}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-plus-circle bx-xs" />
|
<i className="bx bx-plus-circle bx-xs ms-1 cursor-pointer" onClick={handleAddEmail} />
|
||||||
</button>
|
|
||||||
) : (
|
) : (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-danger ms-1 p-0"
|
// className="btn btn-xs btn-danger ms-1 p-0"
|
||||||
onClick={() => removeEmail(index)}
|
// onClick={() => removeEmail(index)}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-minus-circle bx-xs" />
|
<i className="bx bx-minus-circle bx-xs ms-1 cursor-pointer" onClick={() => removeEmail(index)} />
|
||||||
</button>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.contactEmails?.[index]?.emailAddress && (
|
{errors.contactEmails?.[index]?.emailAddress && (
|
||||||
@ -264,23 +263,23 @@ useEffect(() => {
|
|||||||
placeholder="9876543210"
|
placeholder="9876543210"
|
||||||
/>
|
/>
|
||||||
{index === phoneFields.length - 1 ? (
|
{index === phoneFields.length - 1 ? (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-primary ms-1"
|
// className="btn btn-xs btn-primary ms-1"
|
||||||
onClick={handleAddPhone}
|
// onClick={handleAddPhone}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-plus-circle bx-xs" />
|
<i className="bx bx-plus-circle bx-xs ms-1 cursor-pointer" onClick={handleAddPhone} />
|
||||||
</button>
|
|
||||||
) : (
|
) : (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-danger ms-1"
|
// className="btn btn-xs btn-danger ms-1"
|
||||||
onClick={() => removePhone(index)}
|
// onClick={() => removePhone(index)}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-minus-circle bx-xs" />
|
<i className="bx bx-minus-circle bx-xs ms-1 cursor-pointer" onClick={() => removePhone(index)} />
|
||||||
</button>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.contactPhones?.[index]?.phoneNumber && (
|
{errors.contactPhones?.[index]?.phoneNumber && (
|
||||||
|
|||||||
@ -239,23 +239,23 @@ await submitContact({ ...cleaned, id: existingContact.id });
|
|||||||
placeholder="email@example.com"
|
placeholder="email@example.com"
|
||||||
/>
|
/>
|
||||||
{index === emailFields.length - 1 ? (
|
{index === emailFields.length - 1 ? (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-primary ms-1"
|
// className="btn btn-xs btn-primary ms-1"
|
||||||
onClick={handleAddEmail}
|
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-plus-circle bx-xs" />
|
<i className="bx bx-plus-circle bx-xs ms-1 cursor-pointer" onClick={handleAddEmail}/>
|
||||||
</button>
|
|
||||||
) : (
|
) : (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-danger ms-1 p-0"
|
// className="btn btn-xs btn-danger ms-1 p-0"
|
||||||
onClick={() => removeEmail(index)}
|
// onClick={() => removeEmail(index)}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-minus-circle bx-xs" />
|
<i className="bx bx-minus-circle bx-xs ms-1 cursor-pointer" />
|
||||||
</button>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.contactEmails?.[index]?.emailAddress && (
|
{errors.contactEmails?.[index]?.emailAddress && (
|
||||||
@ -299,23 +299,21 @@ await submitContact({ ...cleaned, id: existingContact.id });
|
|||||||
placeholder="9876543210"
|
placeholder="9876543210"
|
||||||
/>
|
/>
|
||||||
{index === phoneFields.length - 1 ? (
|
{index === phoneFields.length - 1 ? (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-primary ms-1"
|
// className="btn btn-xs btn-primary ms-1"
|
||||||
onClick={handleAddPhone}
|
// onClick={handleAddPhone}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-plus-circle bx-xs" />
|
<i className="bx bx-plus-circle bx-xs ms-1 cursor-pointer" onClick={handleAddPhone} />
|
||||||
</button>
|
|
||||||
) : (
|
) : (
|
||||||
<button
|
// <button
|
||||||
type="button"
|
// type="button"
|
||||||
className="btn btn-xs btn-danger ms-1"
|
// className="btn btn-xs btn-danger ms-1"
|
||||||
onClick={() => removePhone(index)}
|
// onClick={() => removePhone(index)}
|
||||||
style={{ width: "24px", height: "24px" }}
|
// style={{ width: "24px", height: "24px" }}
|
||||||
>
|
// >
|
||||||
<i className="bx bx-minus-circle bx-xs" />
|
<i className="bx bx-minus-circle bx-xs ms-1 cursor-pointer" onClick={() => removePhone(index)} />
|
||||||
</button>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.contactPhones?.[index]?.phoneNumber && (
|
{errors.contactPhones?.[index]?.phoneNumber && (
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user