// ============================================================================
// MobileNav — top header + bottom tab bar. Shown only on <=768px via CSS.
// Slot at the top & bottom of every page. Desktop SiteNav continues to work
// (hidden by mobile.css on narrow viewports).
// ============================================================================
(function () {
// -------------------- SVG icons (stroke-based, 24) --------------------
const iconProps = { width: 22, height: 22, viewBox: '0 0 24 24', fill: 'none',
stroke: 'currentColor', strokeWidth: 1.8, strokeLinecap: 'round', strokeLinejoin: 'round' };
const IconHome = () => (
);
const IconGrid = () => (
);
const IconRadar = () => (
);
const IconUser = () => (
);
const IconPlus = () => (
);
const IconMenu = () => (
);
// -------------------- Top mobile header --------------------
// Compact: logo left, hamburger right.
function MobileTopBar({ homeHref = 'Homepage.html' }) {
return (
);
}
// -------------------- Bottom tab bar --------------------
// current: 'home' | 'services' | 'track' | 'account' (the CTA is separate)
function MobileTabBar({ current = 'home', quoteHref = '#quote' }) {
const home = 'Homepage.html';
const services = 'services/index.html';
// Detect subpage so relative hrefs resolve from services/*
const isSubpage = /services\//.test(window.location.pathname);
const prefix = isSubpage ? '../' : '';
const Tab = ({ id, label, href, Icon }) => {
const active = current === id;
return (
{label}
);
};
return (
);
}
window.MobileTopBar = MobileTopBar;
window.MobileTabBar = MobileTabBar;
})();