import React from 'react';
import { Link } from 'react-router-dom';

class Navbar extends React.Component {
  render() {
    return (
      <div className="navbar-fixed">
        <nav className="light-blue lighten-1" role="navigation">
          <div className="nav-wrapper">
            <Link id="logo-container" to="/" className="brand-logo">
              <span className="icon-library" />
            </Link>
            <ul className="right hide-on-med-and-down">
              <li><Link to="/about">About</Link></li>
            </ul>

            <ul id="nav-mobile" className="side-nav">
              <li><Link to="/about">About</Link></li>
            </ul>
            <a href="#" data-activates="nav-mobile" className="button-collapse"><i className="material-icons">menu</i></a>
          </div>
        </nav>
      </div>
    );
  }
}

export default Navbar;
