68 lines
2.1 KiB
JavaScript
68 lines
2.1 KiB
JavaScript
import { ExclamationTriangle } from "react-bootstrap-icons";
|
|
const MobileContent = ({ isDashboard }) => {
|
|
const copy = isDashboard ? (
|
|
<>
|
|
<div>
|
|
<p className="mobile-text-dashboard">
|
|
Novodraft is a desktop application. The functionailty of your
|
|
Dashboard in mobile mode is limited to displaying stats and important
|
|
notifications.
|
|
</p>
|
|
<p className="mobile-text-dashboard">
|
|
Please login on your desktop device to use all of the features of your
|
|
Dashboard.
|
|
</p>
|
|
</div>
|
|
</>
|
|
) : (
|
|
"Novodraft is a desktop application. Please login on your desktop device to use this feature."
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<div className="mobile-content-container">
|
|
{!isDashboard ? (
|
|
<>
|
|
<div className="mobile-divider"></div>
|
|
<div className="features-top-mobile-img">
|
|
<img
|
|
className="features-image-one"
|
|
src="https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/79eafada-1517-43a6-99f1-d3e2b0da8200/public"
|
|
/>
|
|
</div>
|
|
</>
|
|
) : (
|
|
<>
|
|
<div>
|
|
<div className="notication-container">
|
|
<strong>Notification Center</strong>
|
|
<div className="notication-text-container">
|
|
<p>
|
|
<ExclamationTriangle
|
|
style={{ color: "red", marginBottom: "5px" }}
|
|
/>
|
|
</p>
|
|
<p className="notification-text">No new notifications</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)}
|
|
<div className="lower-foo">
|
|
{isDashboard ? (
|
|
<>
|
|
<div className="mobile-divider"></div>
|
|
<div className="mobile-info-heading-dashboard">{copy}</div>
|
|
<div className="mobile-divider"></div>
|
|
</>
|
|
) : (
|
|
<div className="mobile-info-heading">{copy}</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default MobileContent;
|