BuzzbeeSCD/openchamber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: align iPad PWA window controls spacing

Browse Source 
Adds tablet standalone PWA detection
Aligns header and sidebar action padding
Extends safe-area handling for tablet PWAs
This commit is contained in:
Bohdan Triapitsyn
2026-05-04 00:04:29 +03:00
parent fc2f4746e5
commit 581f7c34dc
5 changed files with 85 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/lib/device.ts
+18 -2
View File
@@ -28,6 +28,21 @@ export const BREAKPOINTS = {
'2xl': 1536,
} as const;
const getNavigatorDeviceHints = (maxTouchPoints: number) => {
if (typeof navigator === 'undefined') {
return { isExplicitTablet: false };
}
const userAgent = navigator.userAgent || '';
const platform = navigator.platform || '';
const isIPad = /iPad/i.test(userAgent)
|| ((/Macintosh|MacIntel/i.test(userAgent) || /MacIntel/i.test(platform)) && maxTouchPoints > 1);
const isAndroidTablet = /Android/i.test(userAgent) && !/Mobile/i.test(userAgent);
const isGenericTablet = /Tablet/i.test(userAgent);
return { isExplicitTablet: isIPad || isAndroidTablet || isGenericTablet };
};
const setRootDeviceAttributes = (
isTauriShellRuntime: boolean,
deviceType: DeviceType,
@@ -82,6 +97,7 @@ export function getDeviceInfo(): DeviceInfo {
const noHover = hoverQuery?.matches ?? false;
const maxTouchPoints = typeof navigator !== 'undefined' ? navigator.maxTouchPoints ?? 0 : 0;
const isDesktopShellRuntime = isDesktopShell();
const { isExplicitTablet } = getNavigatorDeviceHints(maxTouchPoints);
const hasTouchInput = prefersCoarsePointer || noHover || maxTouchPoints > 0;
@@ -89,8 +105,8 @@ export function getDeviceInfo(): DeviceInfo {
const isMobileWidth = width <= BREAKPOINTS.md;
let isMobile = hasTouchInput && isMobileWidth;
let isTablet = hasTouchInput && !isMobile && isTabletWidth;
let isDesktop = !hasTouchInput || width > BREAKPOINTS.lg;
let isTablet = hasTouchInput && !isMobile && (isTabletWidth || isExplicitTablet);
let isDesktop = !hasTouchInput || (!isTablet && width > BREAKPOINTS.lg);
let deviceType: DeviceType = 'desktop';
if (isDesktopShellRuntime) {