admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

pramod_Enhancement-#420 : Minor UI Enhancements – Modal Size & Responsive Adjustments #165

Merged
pramod.mahajan merged 5 commits from pramod_Enhancement-#420 into Feature_Directory 2025-05-31 06:52:10 +00:00
Conversation 0 Commits 5 Files Changed 6 +68 -51
6 changed files with 68 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/Directory/CardViewDirectory.jsx
View File

@ -94,14 +94,15 @@ const CardViewDirectory = ({
</div> </div>
</div> </div>
<ul className="list-inline m-0 ps-4"> <ul className="list-inline m-0 ps-4 d-flex align-items-start">
<li className="list-inline-item me-1" style={{ fontSize: "10px" }}> <li className="list-inline-item me-1 small">
<i className="fa-solid fa-briefcase me-2"></i> <i className="fa-solid fa-briefcase me-2"></i>
</li> </li>
<li className="list-inline-item text-small"> <li className="list-inline-item text-break small">
{contact.organization} {contact.organization}
</li> </li>
</ul> </ul>
</div> </div>
<div <div
className="card-footer text-start px-1 py-1" className="card-footer text-start px-1 py-1"
@ -113,16 +114,17 @@ const CardViewDirectory = ({
}} }}
> >
<hr className="my-0" /> <hr className="my-0" />
{contact.contactEmails[0] && ( {contact.contactEmails[0] && (
<ul className="list-inline my-1 "> <ul className="list-unstyled my-1 d-flex align-items-start">
<li className="list-inline-item me-2"> <li className="me-2">
<i className="bx bx-envelope bx-xs"></i> <i className="bx bx-envelope bx-xs mt-1"></i>
</li> </li>
<li className="list-inline-item text-small"> <li className="flex-grow-1 text-break small">
{contact.contactEmails[0]?.emailAddress} {contact.contactEmails[0].emailAddress}
</li> </li>
</ul> </ul>
)} )}
{contact.contactPhones[0] && ( {contact.contactPhones[0] && (
<ul className="list-inline m-0 "> <ul className="list-inline m-0 ">

53
src/components/Directory/ProfileContactDirectory.jsx
View File

@ -58,23 +58,22 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
<div style={{ width: "100px", minWidth: "100px" }}> <div style={{ width: "100px", minWidth: "100px" }}>
<p className="m-0">Email:</p> <p className="m-0">Email:</p>
</div> </div>
<div> <div style={{ flex: 1 }}>
<ul className="list-inline mb-0"> <ul className="list-unstyled mb-0">
{contactProfile.contactEmails.map((email, idx) => ( {contactProfile.contactEmails.map((email, idx) => (
<li <li className="d-flex align-items-center mb-1" key={idx}>
className="list-inline-item me-3 d-flex align-items-center" <i className="bx bx-envelope bx-xs me-1 mt-1"></i>
key={idx} <span className="me-1 flex-grow text-break overflow-wrap">
> {email.emailAddress}
<i className="bx bx-envelope bx-xs me-1"></i> </span>
<span className="me-2">{email.emailAddress}</span>
<i <i
className={`bx bx-copy cursor-pointer ${ className={`bx bx-copy-alt cursor-pointer bx-xs text-start ${
copiedIndex === idx copiedIndex === idx
? "text-secondary" ? "text-secondary"
: "text-primary" : "text-primary"
}`} }`}
title={copiedIndex === idx ? "Copied!" : "Copy Email"} title={copiedIndex === idx ? "Copied!" : "Copy Email"}
style={{ fontSize: "16px" }} style={{ flexShrink: 0 }}
onClick={() => handleCopy(email.emailAddress, idx)} onClick={() => handleCopy(email.emailAddress, idx)}
></i> ></i>
</li> </li>
@ -103,33 +102,28 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
)} )}
{contactProfile?.createdAt && ( {contactProfile?.createdAt && (
<div className="d-flex mb-2"> <div className="d-flex mb-2">
<div style={{ width: "100px", minWidth: "100px" }}> <div style={{ width: "100px", minWidth: "100px" }}>
<p className="m-0">Created : </p> <p className="m-0">Created : </p>
</div> </div>
<div> <div className="d-flex align-items-center">
<ul className="list-inline mb-0">
<li className="list-inline-item"> <li className="list-inline-item">
<i className="bx bx-calendar-week bx-xs me-1"></i> <i className="bx bx-calendar-week bx-xs me-1"></i>
{moment(contactProfile.createdAt).format("MMMM, DD YYYY")} {moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
</li> </li>
</ul>
</div> </div>
</div> </div>
)} )}
{contactProfile?.address && ( {contactProfile?.address && (
<div className="d-flex mb-2"> <div className="d-flex mb-2">
<div style={{ width: "100px", minWidth: "100px" }}> <div style={{ width: "100px", minWidth: "100px" }}>
<p className="m-0">Location : </p> <p className="m-0">Location:</p>
</div> </div>
<div> <div className="d-flex align-items-center">
<ul className="list-inline mb-0"> <i className="bx bx-map bx-xs me-1 "></i>
<li className="list-inline-item"> <span className="text-break small">
<i className="bx bx-map bx-xs me-1"></i> {contactProfile.address}
{contactProfile?.address} </span>
</li>
</ul>
</div> </div>
</div> </div>
)} )}
@ -141,13 +135,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
<div style={{ width: "100px", minWidth: "100px" }}> <div style={{ width: "100px", minWidth: "100px" }}>
<p className="m-0">Orgnization : </p> <p className="m-0">Orgnization : </p>
</div> </div>
<div> <div className="d-flex align-items-center">
<ul className="list-inline mb-0"> <i className="fa-solid fa-briefcase me-2"></i>
<li className="list-inline-item">
<i className="fa-solid fa-briefcase me-2"></i> <span style={{ wordBreak: "break-word" }}>
{contactProfile.organization} {contactProfile.organization}
</li> </span>
</ul>
</div> </div>
</div> </div>
)} )}

2
src/components/Project/ProjectNav.jsx
View File

@ -76,7 +76,7 @@ const ProjectNav = ({ onPillClick, activePill }) => {
<i className="bx bxs-file-image bx-sm me-1_5"></i> <span className="d-none d-md-inline">Image Gallary</span> <i className="bx bxs-file-image bx-sm me-1_5"></i> <span className="d-none d-md-inline">Image Gallary</span>
</a> </a>
</li> </li>
{DirAdmin || DireManager || DirUser && ( {(DirAdmin || DireManager || DirUser) && (
<li className="nav-item"> <li className="nav-item">
<a <a
className={`nav-link ${activePill === "directory" ? "active" : ""}`} className={`nav-link ${activePill === "directory" ? "active" : ""}`}

22
src/components/common/TagInput.jsx
View File

@ -77,6 +77,27 @@ useEffect(() => {
setTags((prev) => prev.slice(0, -1)); setTags((prev) => prev.slice(0, -1));
} }
}; };
const handleInputKey = (e) => {
const key = e.key?.toLowerCase();
if ((key === "enter" || key === " " || e.code === "Space") && input.trim() !== "") {
e.preventDefault();
const existing = options.find(
(opt) => opt.name.toLowerCase() === input.trim().toLowerCase()
);
const newTag = existing
? existing
: {
id: null,
name: input.trim(),
description: input.trim(),
};
addTag(newTag);
} else if ((key === "backspace" || e.code === "Backspace") && input === "") {
setTags((prev) => prev.slice(0, -1));
}
};
const handleSuggestionClick = (suggestion) => { const handleSuggestionClick = (suggestion) => {
addTag(suggestion); addTag(suggestion);
@ -122,6 +143,7 @@ useEffect(() => {
value={input} value={input}
onChange={(e) => setInput(e.target.value)} onChange={(e) => setInput(e.target.value)}
onKeyDown={handleInputKeyDown} onKeyDown={handleInputKeyDown}
onKeyUp={handleInputKey}
placeholder={placeholder} placeholder={placeholder}
style={{ style={{
border: "none", border: "none",

2
src/components/common/TextEditor/Editor.css
View File

@ -1,5 +1,5 @@
.editor-wrapper { .editor-wrapper {
max-width: 800px; max-width: 100%;
margin: 1px auto; margin: 1px auto;
background: #fff; background: #fff;

2
src/pages/Directory/Directory.jsx
View File

@ -274,7 +274,7 @@ const handleDeleteContact = async (overrideId = null) => {
setOpen_contact(null); setOpen_contact(null);
setIsOpenModalNote(false); setIsOpenModalNote(false);
}} }}
size="lg" size="xl"
> >
{open_contact && ( {open_contact && (
<ProfileContactDirectory <ProfileContactDirectory