tbg-ecomm-nextjs/components/Header/HeaderLinks.js

/*eslint-disable*/
import React from "react";
import Link from "next/link";

// @material-ui/core components
import { makeStyles } from "@material-ui/core/styles";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import Icon from "@material-ui/core/Icon";
import Chart from "@material-ui/icons/LocalGroceryStore";

// @material-ui/icons
import { Apps, ShareTwoTone } from "@material-ui/icons";

// core components
import CustomDropdown from "components/CustomDropdown/CustomDropdown.js";
import Button from "components/CustomButtons/Button.js";
import styles from "assets/jss/nextjs-material-kit/components/headerLinksStyle.js";

const useStyles = makeStyles(styles);

export default function HeaderLinks(props) {
  const classes = useStyles();
  return (
    <List className={classes.list}>
      <ListItem className={classes.listItem}>
      <Link href="/yamaha/home">
      <Button color="transparent" className={classes.navLink}>
          <img
            src="https://1.bp.blogspot.com/-J9AsxdwrF-Y/Wn70KyBApaI/AAAAAAAACRo/LTy3zrALzhckryd9QPi_KuVyWvwFMZyMQCLcBGAs/s640/TG.png" width="180px"
          />
          </Button>
      </Link>
      </ListItem>
      <ListItem className={classes.listItem}>
        <Link href="/yamaha/home">
          <Button color="transparent" className={classes.navLink} style={{marginTop:"10px"}}>
            <Icon className={classes.icons}>home</Icon> Home
          </Button>
        </Link>
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <CustomDropdown
          noLiPadding
          navDropdown
          buttonText="Product"
          buttonProps={{
            className: classes.navLink,
            color: "transparent",
          }}
          buttonIcon={Apps}
          dropdownList={[
            <a href="/yamaha/product/product" className={classes.dropdownLink}>Motor</a>,
            <a href="/yamaha/product/ygp" className={classes.dropdownLink}>YGP</a>,
            <a href="/yamaha/product/yamalube" className={classes.dropdownLink}>Yamalube</a>,
            <a href="/yamaha/product/helmet" className={classes.dropdownLink}>Helmet</a>,
            <a href="/yamaha/product/apparel" className={classes.dropdownLink}>Apparel</a>,
            <a href="/yamaha/product/accessories" className={classes.dropdownLink}>Accessories</a>,
            <a href="https://booking.thamrin.co.id/" className={classes.dropdownLink}>Service</a>,
            <a href="/yamaha/dealers" className={classes.dropdownLink}>Dealers</a>,
          ]}
        />
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <Link href="/yamaha/latestnews">
          <Button color="transparent" className={classes.navLink}>
            <Icon className={classes.icons}>event</Icon> Latest News
          </Button>
        </Link>
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <Button href="/yamaha/carrer" color="transparent" className={classes.navLink}>
          <Icon className={classes.icons}>wallet_travel</Icon> Career
        </Button>
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <CustomDropdown
          noLiPadding
          navDropdown
          buttonText="Partner"
          buttonProps={{
            className: classes.navLink,
            color: "transparent",
          }}
          buttonIcon={ShareTwoTone}
          dropdownList={[
            <a href="https://www.yamaha-motor.co.id/" className={classes.dropdownLink}>Yamaha</a>,
            <a href="https://www.suzuki.co.id/" className={classes.dropdownLink}>Suzuki</a>,
            <a href="https://www.honda-indonesia.com/" className={classes.dropdownLink}>Honda</a>,
            <a href="https://www.hino.co.id/" className={classes.dropdownLink}>Hino</a>,
            <a href="https://www.mercedes-benz.co.id/passengercars.html" className={classes.dropdownLink}>Mercedes-Benz</a>,
            <a href="http://bprberkatsejati.com/" className={classes.dropdownLink}>BPR Berkat Sejati</a>,
            <a href="https://www.hino.co.id/" className={classes.dropdownLink}>Palembang Indah Mall</a>,
            <a href="http://www.emilia-hotel.com/" className={classes.dropdownLink}>Hotel Emilia</a>,
            <a href="http://homes.thamrin.xyz/" className={classes.dropdownLink}>Thamrin Home</a>,
            <a href="https://www.hino.co.id/" className={classes.dropdownLink}>Ketty Resto</a>,
          ]}
        />
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <Button
          href="/yamaha/abous_us/aboutus"
          color="transparent"
          className={classes.navLink}
        >
          <Icon className={classes.icons}>account_balance</Icon> About Us
        </Button>
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <Button href="/yamaha/cart/cart" color="transparent" className={classes.navLink}>
          <Chart className={classes.icons} />
        </Button>
      </ListItem>
      <ListItem className={classes.listItem} style={{marginTop:"10px"}}>
        <Button
          href="/yamaha/login"
          className={classes.registerNavLink}
          color="info"
          round
        >
          <Icon className={classes.icons}>input</Icon> Login
        </Button>
      </ListItem>
    </List>
  );
}