import ProductMenu from './menu-product'
import HelpMenu from './menu-help'
import SolutionMenu from './menu-solution'

export type MobileMenuProps = {}

export default function MobileMenu(props: MobileMenuProps) {
  return (
    <div className="flex flex-col gap-8">
      <div className="flex flex-col gap-4">
        <ProductMenu/>
      </div>
      <div className="flex flex-col gap-4">
        <MenuTitle title="帮助中心"/>
        <HelpMenu/>
      </div>
      <div className="flex flex-col gap-4">
        <MenuTitle title="业务场景"/>
        <SolutionMenu/>
      </div>
    </div>
  )
}

function MenuTitle(props: {title: string}) {
  return (
    <h3 className="text-xl text-weak px-4">
      {props.title}
    </h3>
  )
}