https://dataflows.com.au/js/responsive-fix.js

1/**
2 * DataFlows Responsive Design Fixes
3 * This script helps ensure consistent display across all devices
4 */
5
6document.addEventListener('DOMContentLoaded', function() {
7  // Fix viewport height issues on mobile devices (especially iOS)
8  const viewportHeight = () => {
9    const vh = window.innerHeight * 0.01;
10    document.documentElement.style.setProperty('--vh', `${vh}px`);
11  };
12  
13  // Run on page load and resize
14  viewportHeight();
15  window.addEventListener('resize', viewportHeight);
16  window.addEventListener('orientationchange', viewportHeight);
17  
18  // Add responsive classes to containers
19  const containers = document.querySelectorAll('.home-container, .privacy-policy-container, [class*="-container"]');
20  containers.forEach(container => {
21    container.classList.add('responsive-container');
22  });
23  
24  // Fix images that might be causing overflow
25  const images = document.querySelectorAll('img');
26  images.forEach(img => {
27    if (!img.hasAttribute('width') && !img.hasAttribute('height')) {
28      img.style.maxWidth = '100%';
29      img.style.height = 'auto';
30    }
31  });
32  
33  // Add any device-specific fixes
34  const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
35  if (isMobile) {
36    document.body.classList.add('mobile-device');
37    
38    // Fix iOS specific issues
39    const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
40    if (isIOS) {
41      document.body.classList.add('ios-device');
42    }
43  }
44});