- Notifications
You must be signed in to change notification settings - Fork0
Universal media queries for React Native and web
License
NotificationsYou must be signed in to change notification settings
kiurchv/react-native-web-responsive
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Universal media queries for React Native and web.
Using npm:
npm install --save react-native-web-responsive
or yarn:
yarn add react-native-web-responsive
Since MediaQuery component built on components fromreact-responsive andreact-native-responsive it can utilize any props supported by them with next limitations:
- There is no difference between viewport- and device-based measurements on native.
- The only supported unit for the resolution property is dppx.
- Child function, properties
aspectRatio,component,color,colorIndex,monochrome,scanandtypeare unsupported on native.
importReactfrom"react";import{View,Text}from"react-primitives";importMediaQueryfrom"react-native-web-responsive";functionResponsiveExample(){return(<View><Text>Device Test!</Text><MediaQueryminWidth={1224}><Text>You are a desktop or laptop</Text><MediaQueryminWidth={1824}><Text>You also have a huge screen</Text></MediaQuery></MediaQuery><MediaQuerymaxWidth={1224}><Text>You are a tablet or mobile phone</Text></MediaQuery><MediaQueryorientation="portrait"><Text>You are portrait</Text></MediaQuery><MediaQueryorientation="landscape"><Text>You are landscape</Text></MediaQuery><MediaQueryminPixelRatio={2}><Text>You are retina</Text></MediaQuery></View>);}
About
Universal media queries for React Native and web
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Releases
No releases published
Packages0
No packages published
Uh oh!
There was an error while loading.Please reload this page.