import React, {Component} from 'react'
import {NavLink} from "react-router-dom";
import "./MainPage.css"

export default class MainPage extends Component {
    render() {
        const {children} = this.props;
        return (
            <div className={"mainContainer"}>
                <div className={"headerBox"}>
                    <div className={"logoBox"}>LOGO</div>
                    <div className={"navBox"}>
                        <NavLink to='/index'>主页</NavLink>
                        <span className={"divider"}>|</span>
                        <NavLink to='/example'>样例</NavLink>
                        <span className={"divider"}>|</span>
                        <NavLink to='/doc'>文档</NavLink>
                        <span className={"divider"}>|</span>
                        <NavLink to='/aboutUs'>关于我们</NavLink>
                    </div>
                </div>
                <div className={"mainBox"}>
                    {children}
                </div>
            </div>
        )
    }
}