upadating directory filter in design.
This commit is contained in:
parent
77cd8357cd
commit
45dadc88a2
@ -115,7 +115,7 @@ const NoteCardDirectoryEditable = ({
|
||||
</GlobalModel>
|
||||
)}
|
||||
<div
|
||||
className="card p-1 shadow-sm border-1 mb-4 rounded"
|
||||
className="card p-1 shadow-sm border-1 mb-4 p-4 rounded"
|
||||
style={{
|
||||
width: "100%",
|
||||
background: noteItem.isActive ? "#fff" : "#f8f6f6",
|
||||
|
@ -299,40 +299,61 @@ const DirectoryPageHeader = ({
|
||||
{/* Removed the numerical badge for notes filter */}
|
||||
</a>
|
||||
|
||||
<div className="dropdown-menu p-3" style={{ width: "300px", maxHeight: "400px", overflowY: "auto" }}>
|
||||
<p className="text-muted mb-1">Created By</p>
|
||||
{allCreators.map((name, idx) => (
|
||||
<div className="form-check mb-1" key={`creator-${idx}`}>
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
id={`creator-${idx}`}
|
||||
checked={selectedCreators.includes(name)}
|
||||
onChange={() => handleToggleCreator(name)}
|
||||
/>
|
||||
<label className="form-check-label" htmlFor={`creator-${idx}`}>
|
||||
{name}
|
||||
</label>
|
||||
<div
|
||||
className="dropdown-menu p-3"
|
||||
style={{
|
||||
minWidth: "600px",
|
||||
maxHeight: "400px",
|
||||
overflowY: "auto",
|
||||
overflowX: "hidden",
|
||||
whiteSpace: "normal"
|
||||
}}
|
||||
>
|
||||
<div className="d-flex">
|
||||
{/* Created By */}
|
||||
<div className="pe-3" style={{ flex: 1 }}>
|
||||
<p className="text-muted mb-1">Created By</p>
|
||||
{allCreators.map((name, idx) => (
|
||||
<div className="form-check mb-1" key={`creator-${idx}`}>
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
id={`creator-${idx}`}
|
||||
checked={selectedCreators.includes(name)}
|
||||
onChange={() => handleToggleCreator(name)}
|
||||
/>
|
||||
<label className="form-check-label text-nowrap" htmlFor={`creator-${idx}`}>
|
||||
{name}
|
||||
</label>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
|
||||
<p className="text-muted mt-3 mb-1">Organization</p>
|
||||
{filteredOrganizations.map((org, idx) => (
|
||||
<div className="form-check mb-1" key={`org-${idx}`}>
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
id={`org-${idx}`}
|
||||
checked={selectedOrgs.includes(org)}
|
||||
onChange={() => handleToggleOrg(org)}
|
||||
/>
|
||||
<label className="form-check-label" htmlFor={`org-${idx}`}>
|
||||
{org}
|
||||
</label>
|
||||
{/* Divider */}
|
||||
<div style={{ width: "1px", backgroundColor: "#dee2e6", margin: "0 12px" }}></div>
|
||||
|
||||
{/* Organization */}
|
||||
<div className="ps-3" style={{ flex: 1 }}>
|
||||
<p className="text-muted mb-1">Organization</p>
|
||||
{filteredOrganizations.map((org, idx) => (
|
||||
<div className="form-check mb-1" key={`org-${idx}`}>
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
id={`org-${idx}`}
|
||||
checked={selectedOrgs.includes(org)}
|
||||
onChange={() => handleToggleOrg(org)}
|
||||
/>
|
||||
<label className="form-check-label text-nowrap" htmlFor={`org-${idx}`}>
|
||||
{org}
|
||||
</label>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="d-flex justify-content-between mt-2">
|
||||
{/* Buttons */}
|
||||
<div className="d-flex justify-content-between mt-3">
|
||||
<button
|
||||
className="btn btn-sm btn-outline-danger"
|
||||
onClick={() => {
|
||||
@ -340,7 +361,6 @@ const DirectoryPageHeader = ({
|
||||
setSelectedOrgs([]);
|
||||
setFilteredOrganizations(allOrganizations);
|
||||
setFilterAppliedNotes(notesForFilter);
|
||||
|
||||
}}
|
||||
>
|
||||
Clear
|
||||
@ -350,6 +370,7 @@ const DirectoryPageHeader = ({
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user