fleet/frontend/layouts/UnsupportedScreenSize/UnsupportedScreenSize.tsx
jacobshandling 21175ea706
Render unsupported screen size on My device page (#22643)
## #22490 

- Componentize relevant UI
- Apply to both core layout and My device page
<img width="876" alt="Screenshot 2024-10-03 at 4 28 18 PM"
src="https://github.com/user-attachments/assets/931ccd78-e525-43d9-8a5d-169e2bf6624b">

- [x] Changes file added for user-visible changes in `changes/`,
- [x] Manual QA for all new/changed functionality

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2024-10-04 10:25:08 -07:00

19 lines
548 B
TypeScript

import React from "react";
import smallScreenImage from "../../../assets/images/small-screen-160x80@2x.png";
const baseClass = "unsupported-screen-size";
const UnsupportedScreenSize = () => {
return (
<div className={baseClass}>
<img src={smallScreenImage} alt="Unsupported screen size" />
<div className={`${baseClass}__text`}>
<h1>This screen size is not supported yet.</h1>
<p>Please enlarge your browser or try again on a computer.</p>
</div>
</div>
);
};
export default UnsupportedScreenSize;