align "Add a Note" button to right and switch to left consistently
This commit is contained in:
parent
c3d172ea8e
commit
6e570ee411
@ -88,7 +88,8 @@ const NotesDirectory = ({
|
||||
};
|
||||
|
||||
const onCancel = () => {
|
||||
setValue("note", "");
|
||||
setValue( "note", "" );
|
||||
|
||||
};
|
||||
const handleSwitch = () => {
|
||||
setIsActive(!IsActive);
|
||||
@ -103,48 +104,45 @@ const NotesDirectory = ({
|
||||
<p className="fw-semibold m-0">Notes :</p>
|
||||
</div>
|
||||
<div className="d-flex align-items-center justify-content-between mb-5">
|
||||
{contactNotes?.length > 0 && (
|
||||
<div className="m-0 d-flex aligin-items-center">
|
||||
<label className="switch switch-primary">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="switch-input"
|
||||
onChange={() => handleSwitch(!IsActive)}
|
||||
value={IsActive}
|
||||
/>
|
||||
<span className="switch-toggle-slider">
|
||||
<span className="switch-on">
|
||||
{/* <i class="icon-base bx bx-check"></i> */}
|
||||
</span>
|
||||
<span className="switch-off">
|
||||
{/* <i class="icon-base bx bx-x"></i> */}
|
||||
</span>
|
||||
</span>
|
||||
<span className="switch-label ">Include Deleted Notes</span>
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{!addNote && (
|
||||
<div
|
||||
className={`
|
||||
${
|
||||
contactNotes?.length > 0
|
||||
? "d-flex justify-content-center px-2"
|
||||
: "d-flex justify-content-center px-2w-100"
|
||||
}`}
|
||||
>
|
||||
<span
|
||||
className={`btn btn-sm ${
|
||||
addNote ? "btn-danger" : "btn-primary"
|
||||
}`}
|
||||
onClick={() => setAddNote(!addNote)}
|
||||
>
|
||||
{addNote ? "Hide Editor" : "Add a Note"}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="m-0 d-flex align-items-center">
|
||||
{contactNotes?.length > 0 ? (
|
||||
<label className="switch switch-primary">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="switch-input"
|
||||
onChange={() => handleSwitch(!IsActive)}
|
||||
value={IsActive}
|
||||
/>
|
||||
<span className="switch-toggle-slider">
|
||||
<span className="switch-on"></span>
|
||||
<span className="switch-off"></span>
|
||||
</span>
|
||||
<span className="switch-label">Include Deleted Notes</span>
|
||||
</label>
|
||||
) : (
|
||||
<div style={{ visibility: "hidden" }}>
|
||||
<label className="switch switch-primary">
|
||||
<input type="checkbox" className="switch-input" />
|
||||
<span className="switch-toggle-slider">
|
||||
<span className="switch-on"></span>
|
||||
<span className="switch-off"></span>
|
||||
</span>
|
||||
<span className="switch-label">Include Deleted Notes</span>
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="d-flex justify-content-end">
|
||||
<span
|
||||
className={`btn btn-sm ${addNote ? "btn-danger" : "btn-primary"}`}
|
||||
onClick={() => setAddNote(!addNote)}
|
||||
>
|
||||
{addNote ? "Hide Editor" : "Add a Note"}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{addNote && (
|
||||
<div className="card m-2 mb-5">
|
||||
|
@ -78,7 +78,7 @@ const Editor = ({
|
||||
aria-disabled={loading}
|
||||
onClick={onCancel}
|
||||
>
|
||||
Cancel
|
||||
Clear
|
||||
</span>
|
||||
<span
|
||||
type="submit"
|
||||
|
Loading…
x
Reference in New Issue
Block a user