menu.tsx

import React from 'react'
import { Content } from "@onegeo/gatsby-theme-onegeo";
import { Menu, MenuMobile } from "@onegeo/gatsby-theme-onegeo";
import { Link } from "gatsby";

const menu = () => {
  return (
    <Content>
      <div className="prose">
        <Link to="/doc/core">Retour</Link>

        <h1>Menu</h1>
        <h2>Props</h2>
        <div className="mockup-code">
          <pre>
            <code>
              {`const menu = [
    {
      title: "Decouvrir",
    },
    {
      title: "Actualités",
    },
    {
      title: "A propos",
    },
    {
      title: "Mentions légales",
    },
    {
      title: "Parents",
      subMenu: [
        {
          title: "sousmenu1",
        },
        {
          title: "sousmenu2",
        },
      ],
    },
  ];`}
            </code>
          </pre>
        </div>

        <h2>Example</h2>
      </div>
      <div className='mt-5'>
        <h3 className='underline underline-offset-1'>Menu classique</h3>
        <div className="flex gap-6 m-4">
          <Menu />
        </div>
      </div>

      <div>
        <h3 className='underline underline-offset-1'>Menu mobile</h3>
        <div className="flex gap-6 m-4">
          <MenuMobile />
        </div>
      </div>
    </Content>
  )
}

export default menu