react-iphone-layout v1.2.0

React-iPhone-Layout

Installation

$ npm install react-iphone-layout --save-dev

$ yarn add react-iphone-layout --dev

Features

• Web App Compatibility: Easily integrate iPhone layout into your web applications.
• Web View Support: Optimize for iPhone on the web to provide a seamless web view.
• Dynamic iPhone View Resizing: You can dynamically adjust the size of the iPhone view.
• Real-Time View Switching: Check the iPhone view and laptop view in real-time through a control box, allowing for seamless testing and optimization of layouts across different devices.
• Rotation iPhone: provide a screen rotation feature for the iPhone. (The internal content does not rotate)

Getting Started

import { IPhoneLayout } from "react-iphone-layout";
import "react-iphone-layout/dist/ReactIPhoneLayout.css"; // ✨

function App() {
  return (
    <IPhoneLayout>
      <p>this is iPhone layout!!!</p>
    </IPhoneLayout>
  );
}

Props

Demo

• CodeSandbox: Try out the react-iphone-layout library in an interactive online editor. Click here to view the demo.

License

MIT