mobile-safari-fullscreen

---

!Build Statusbuild-badgebuild !Code Coveragecoverage-badgecoverage !versionversion-badgepackage !downloadsdownloads-badgenpmtrends !MIT Licenselicense-badgelicense
!PRs Welcomeprs-badgeprs !Code of Conductcoc-badgecoc
!Watch on GitHubgithub-watch-badgegithub-watch !Star on GitHubgithub-star-badgegithub-star !Tweettwitter-badgetwitter

The problem

There is long standing bug in Mobile Safari https://bugs.webkit.org/showbug.cgi?id=153852.

This solution

This React component implements solution described in https://www.eventbrite.com/engineering/mobile-safari-why/ e.g. it always shows top and bottom bars in the Mobile Safari.

Table of Contents

• Installation
• Usage
• Inspiration
• Other Solutions
• Contributors
• LICENSE

Installation

This module is distributed via npmnpm which is bundled with nodenode and should be installed as one of your project's dependencies:

npm install --save mobile-safari-fullscreen

Usage

import FullScreen from 'mobile-safari-fullscreen'
import styles from 'mobile-safari-fullscreen/index.module.css'

;<FullScreen classNames={styles} isOpen={isOpen}>
  <YourModalHere isOpen={isOpen} />
</FullScreen>

Inspiration

https://www.eventbrite.com/engineering/mobile-safari-why/

Other Solutions

I'm not aware of any, if you are please make a pull requestprs and add it here!

Contributors

Thanks goes to these people (emoji keyemojis):
|
_{stereobooster}
💻 📖 🚇") ⚠️ | | :---: |

This project follows the all-contributorsall-contributors specification. Contributions of any kind welcome!

LICENSE

MIT