Skip to content

Instantly share code, notes, and snippets.

@jamesplease
Last active April 11, 2018 16:37
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jamesplease/d195e29b008677d9d15767dab44402ba to your computer and use it in GitHub Desktop.
Save jamesplease/d195e29b008677d9d15767dab44402ba to your computer and use it in GitHub Desktop.
PWA Thoughts

All /General

  • Scrolling down when the page is at the top should not move the header. In iOS, this can be fixed by avoiding position:sticky and using position:fixed. However, macOS PWAs via Chrome always scroll the header, even with position:fixed. This may(?) be an OS-level thing, since Safari on macOS also scrolls position:fixed

  • Likewise, that applies to anything pinned to the bottom of the page, such as a nav

  • Landing page for web should likely be different than landing page for standalone.

  • Hide dat footer

  • Consider entirely different nav as standalone. Websites tend to have menus in the header, iOS apps tend to have bottom menu bars, even at large resolutions

  • Different OS should possibly have different layouts. Android/macOS/iOS. iOS app on macOS can look weird. Maybe bestiejs/platform.js is the solution here?

macOS (via Chrome Canary)

  • Problem: Links show the URL in the bottom left corner on desktop when hovering. pokedex.org gets around this by using buttons everywhere. I wonder if there is a way to programmatically switch everything to buttons?

  • Even if the above is true, then you lose the ability to do "Open in new {APP_NAME} window," which is neat

  • Cursor should probably never be pointer

  • Problem: No minimum app width setting

  • Heads up: No HTTPS means that a URL bar will display

iOS (via Safari)

  • Grey highlight on tap needs to be disabled

  • Problem: Status bar cannot currently be colored, although there are some workarounds (around April 2018)

  • Most UI text should not be selectable (headers and buttons and stuff)

  • Problem: Split view does not work

  • Disable user scaling

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment