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

Replaced inline styles with Bootstrap utility classes

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-31 12:08:47 +05:30
parent 0026de943b
commit 49dfc084c0
2 changed files with 43 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
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"
@ -114,16 +115,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 ">
<li className="list-inline-item me-1"> <li className="list-inline-item me-1">

43
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>
@ -107,29 +106,24 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
<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">
<li className="list-inline-item">
<i className="bx bx-map bx-xs me-1 "></i> <i className="bx bx-map bx-xs me-1 "></i>
{contactProfile?.address} <span className="text-break small">
</li> {contactProfile.address}
</ul> </span>
</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">
<li className="list-inline-item">
<i className="fa-solid fa-briefcase me-2"></i> <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>
)} )}