button.tsx

import React, { ReactElement } from "react"
import { Content, Link, Button } from "@onegeo/gatsby-theme-onegeo"

function button(): ReactElement {
    return (
        <Content>
            <div className="prose">
                <Link to="/doc/core">Retour</Link>

                <h1>Button</h1>
                <h2>Props</h2>
                <div className="mockup-code">
                    <pre>
                        <code>
                            {`interface Props {
    children?: React.ReactNode;
    title?: string;
    to?: string;
    className?: string;
}`}
                        </code>
                    </pre>
                </div>

                <h2>Example</h2>
            </div>
            <div className="flex gap-6 m-4">
                <Button title="A Button..." />
                <Button
                    title="A Primary Button..."
                    className="btn-primary btn-lg"
                />
                <Button
                    title="A Secondary Button..."
                    className="btn-secondary btn-xl"
                />
                <Button
                    title="A Accent Button..."
                    className="btn-accent btn-sm"
                />
                <Button className="btn-ghost btn-xs">A Ghost Button</Button>
            </div>
            <div className="prose">
                <h2>More example</h2>
                <a href="https://daisyui.com/components/button/">Daisy UI</a>
            </div>
        </Content>
    )
}

export default button