nmemmertandClaude Sonnet 5.5
a2185ba1dd
Build and Push Docker Image / build-and-push (push) Successful in 5m7s
- Phones get a bottom tab bar (Studies, Bible, Plans, Prayer, Account); wider screens keep the header nav - The Account menu opens upward from the bar; toasts sit above it - Reader and study pages get a labelled Home button instead of a small arrow Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
20 lines
764 B
JavaScript
20 lines
764 B
JavaScript
import { useEffect, useState } from 'react';
|
|
|
|
const QUERY = '(max-width: 639px)';
|
|
const read = () => (typeof window !== 'undefined' && typeof window.matchMedia === 'function' ? window.matchMedia(QUERY).matches : false);
|
|
|
|
// True on a phone-width screen (under Tailwind's `sm`). False where matchMedia is missing (tests), so the full
|
|
// layout is what renders there.
|
|
export function useIsPhone() {
|
|
const [phone, setPhone] = useState(read);
|
|
useEffect(() => {
|
|
if (typeof window.matchMedia !== 'function') return undefined;
|
|
const mq = window.matchMedia(QUERY);
|
|
const update = () => setPhone(mq.matches);
|
|
update();
|
|
mq.addEventListener?.('change', update);
|
|
return () => mq.removeEventListener?.('change', update);
|
|
}, []);
|
|
return phone;
|
|
}
|