super-productivity/capacitor.config.ts
Johannes Millan a046c347d4 feat(ios): add safe area, keyboard, and status bar handling
Add iOS-specific UX improvements:

Safe Areas:
- Add CSS variables for safe area insets (notch, home indicator)
- Add body classes: isNativeMobile, isIOS, isKeyboardVisible
- Apply safe area padding on native mobile platforms

Keyboard Handling:
- Install @capacitor/keyboard plugin
- Track keyboard visibility via keyboardWillShow/Hide events
- Set --keyboard-height CSS variable for layout adjustments
- Remove bottom safe area padding when keyboard is visible

Status Bar:
- Install @capacitor/status-bar plugin
- Sync status bar style with app dark/light theme
- Configure overlaysWebView: false in capacitor.config.ts

These changes ensure proper display on iPhone devices with
notch/Dynamic Island and home indicator.
2026-01-14 13:45:42 +01:00

36 lines
900 B
TypeScript

import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.superproductivity.superproductivity',
appName: 'Super Productivity',
webDir: 'dist/browser',
plugins: {
CapacitorHttp: {
enabled: true,
},
LocalNotifications: {
// Android-specific: small icon for notification
smallIcon: 'ic_stat_sp',
},
Keyboard: {
// Resize the web view when keyboard appears (iOS)
resize: 'body',
// Style keyboard accessory bar
resizeOnFullScreen: true,
},
StatusBar: {
// Status bar overlays webview (iOS)
overlaysWebView: false,
},
},
ios: {
// Content inset for safe areas (notch, home indicator)
contentInset: 'automatic',
// Allow inline media playback
allowsLinkPreview: true,
// Scroll behavior
scrollEnabled: true,
},
};
export default config;