import * as React from 'react';
import {Link} from 'gatsby';
import Layout from "../../components/Layout/Layout";

import '../../styles/styles.scss';

function Home() {
    return (
        <Layout>
            <h1>Insights</h1>
            <p className="text-container p-b-56">
                Upcoming fashion insights, enabling you to make informed procurement and
                manufacturing decisions that align with consumer preferences and market
                demands
            </p>
            <div className="center p-b-56 flex flex--center flex--gap-32">
                <Link
                    to="/insights/"
                    className="button button__primary"
                    style={{pointerEvents: 'none'}}
                >
                    Men’s Fashion
                </Link>
                <Link
                    to="/insights/"
                    className="button button__primary"
                    style={{pointerEvents: 'none'}}
                >
                    Women’s Fashion
                </Link>
                <Link
                    to="/insights/"
                    className="button button__primary"
                    style={{pointerEvents: 'none'}}
                >
                    Kid’s Fashion
                </Link>
            </div>
            <div className="box center p-b-80">
                <Link to="/insights/" className="button button__secondary m-t-80">
                    Generate Insights
                </Link>
            </div>
        </Layout>
    );
}

export default Home;