42 lines
1.5 KiB
TypeScript
42 lines
1.5 KiB
TypeScript
/**
|
|
* Mobile Safari Fixes Plugin
|
|
* Applies mobile Safari specific optimizations on client side
|
|
* Uses static mobile detection to prevent reactive loops
|
|
*/
|
|
|
|
// Track if fixes have been applied to prevent duplicate execution
|
|
let fixesApplied = false;
|
|
|
|
export default defineNuxtPlugin(() => {
|
|
// Apply mobile Safari fixes on client-side mount
|
|
if (typeof window !== 'undefined' && !fixesApplied) {
|
|
// Static mobile detection - no reactive dependencies
|
|
const userAgent = navigator.userAgent;
|
|
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
|
|
const isIOS = /iPad|iPhone|iPod/.test(userAgent) && !(window as any).MSStream;
|
|
const isSafari = /^((?!chrome|android).)*safari/i.test(userAgent);
|
|
const isMobileSafari = isIOS && isSafari;
|
|
|
|
// Apply initial fixes only for mobile Safari
|
|
if (isMobileSafari) {
|
|
// Set initial viewport height CSS variable
|
|
const vh = window.innerHeight * 0.01;
|
|
document.documentElement.style.setProperty('--vh', `${vh}px`);
|
|
|
|
// Add optimization classes
|
|
const classes = [];
|
|
if (isMobile) classes.push('is-mobile');
|
|
if (isMobileSafari) classes.push('is-mobile-safari');
|
|
if (isIOS) classes.push('is-ios');
|
|
|
|
// Add classes to document element
|
|
if (classes.length > 0) {
|
|
document.documentElement.classList.add(...classes);
|
|
}
|
|
}
|
|
|
|
// Mark fixes as applied
|
|
fixesApplied = true;
|
|
}
|
|
});
|