File size: 1,522 Bytes
b64de39
 
 
 
 
fc91a5e
b64de39
 
 
 
 
 
 
 
 
 
 
75fda81
b64de39
 
 
 
 
 
fc91a5e
4995d62
 
 
 
 
b64de39
4995d62
 
75fda81
4995d62
b64de39
 
 
4995d62
b64de39
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
75fda81
b64de39
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
/**
 * Layout - Main page layout wrapper.
 *
 * Composes Header, main content area, Footer, BottomNav, and VoiceButton
 * into a consistent full-page structure. Hides footer on mobile
 * when BottomNav is visible.
 */

import PropTypes from "prop-types";
import Header from "./Header";
import Footer from "./Footer";
import BottomNav from "./BottomNav";
import { VoiceButton } from "@components/voice";

function Layout({
  children,
  language,
  onLanguageChange,
  hideHeader = false,
  hideFooter = false,
  hideBottomNav = false,
  className = "",
}) {
  return (
    <div className="flex min-h-screen flex-col">
      {/* Skip-to-content link for accessibility */}
      <a href="#main-content" className="sr-skip-link">
        Skip to main content
      </a>

      {!hideHeader && (
        <Header
          language={language}
          onLanguageChange={onLanguageChange}
        />
      )}

      <main
        id="main-content"
        className={`flex-1 mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8 py-6 ${className}`}
      >
        {children}
      </main>

      {!hideFooter && <Footer className="hidden md:block" />}

      {!hideBottomNav && <BottomNav className="md:hidden" />}

      <VoiceButton />
    </div>
  );
}

Layout.propTypes = {
  children: PropTypes.node.isRequired,
  language: PropTypes.string,
  onLanguageChange: PropTypes.func,
  hideHeader: PropTypes.bool,
  hideFooter: PropTypes.bool,
  hideBottomNav: PropTypes.bool,
  className: PropTypes.string,
};

export default Layout;