media-query-react-ts
v0.0.2
Published
use MediaQuery in react hook
Downloads
10
Maintainers
Readme
Installation
First, in your terminal while in the root directory of your project:
npm i media-query-react-ts
Usage
Then you can import the react component:
import MediaQuery from "media-query-react-ts";
Usage example:
<MediaQuery minResolution={2}>
{(matches: boolean) =>
matches ? <p>You are retina</p> : <p>You are not retina</p>
}
</MediaQuery>
or
<MediaQuery minWidth={1824}>
<p>You also have a huge screen</p>
</MediaQuery>
And you can also import as a hook:
import { useMediaQuery } from "media-query-react-ts";
Usage example:
const isDesktopOrLaptop = useMediaQuery({ query: "(min-width: 1224px" });