Commit 23f193d8 authored by Patrick Lehner's avatar Patrick Lehner
Browse files

Restrict Safari detection to iOS-only

parent 6e646414
......@@ -742,13 +742,12 @@ body:not(.ios) .recording #background-container {
transition: transform 0.2s linear;
}
@media (max-width: 600px) {
.safari #install-app {
body.mobile-safari #install-app {
transform: translateY(0);
}
.safari #install-app.hide {
}
body.mobile-safari #install-app.hide {
transform: translateY(3rem);
}
}
#install-app a {
......
......@@ -2,7 +2,7 @@ import { h, render } from 'preact';
import User from './user';
import API from './api';
import Pages from './components/pages';
import { isSafari, isFocus, isNativeIOS } from './utility';
import { isMobileSafari, isFocus, isNativeIOS } from './utility';
import DebugBox from './components/debug-box';
const LOAD_DELAY = 500; // before pulling the curtain
......@@ -54,8 +54,8 @@ export default class App {
document.body.classList.add('focus');
}
if (isSafari()) {
document.body.classList.add('safari');
if (isMobileSafari()) {
document.body.classList.add('mobile-safari');
}
this.user = new User();
......
......@@ -46,8 +46,18 @@ export function isFocus(): boolean {
return navigator.userAgent.indexOf('Focus') !== -1;
}
export function isSafari(): boolean {
return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
/**
* Check whether the browser is mobile Safari (i.e. on iOS).
*
* The logic is collected from answers to this SO question: https://stackoverflow.com/q/3007480
*/
export function isMobileSafari(): boolean {
const userAgent = window.navigator.userAgent;
const isIOS = /(iPod|iPhone|iPad)/i.test(userAgent);
const isWebkit = /AppleWebKit/i.test(userAgent);
const isIOSSafari =
isIOS && isWebkit && !/(Chrome|CriOS|OPiOS)/.test(userAgent);
return isIOSSafari;
}
export function isProduction(): boolean {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment