mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
39 lines
1 KiB
JavaScript
39 lines
1 KiB
JavaScript
|
import { PureComponent } from 'react'
|
||
|
|
import PropTypes from 'prop-types'
|
||
|
|
import Head from 'next/head'
|
||
|
|
import { Link } from '../routes'
|
||
|
|
|
||
|
|
// -----------------------------------------------
|
||
|
|
|
||
|
|
export default class Main extends PureComponent {
|
||
|
|
render () {
|
||
|
|
return (<div>
|
||
|
|
<Head>
|
||
|
|
<title>{this.props.pathname} - Page Transitions</title>
|
||
|
|
</Head>
|
||
|
|
|
||
|
|
<header>
|
||
|
|
<Link to='/'>
|
||
|
|
<a className={this.props.pathname === '/' ? 'active' : ''}>Homepage</a>
|
||
|
|
</Link>
|
||
|
|
|
||
|
|
<Link route='main' params={{ slug: 'about' }}>
|
||
|
|
<a className={this.props.pathname === 'about' ? 'active' : ''}>About</a>
|
||
|
|
</Link>
|
||
|
|
|
||
|
|
<Link route='main' params={{ slug: 'contact' }}>
|
||
|
|
<a className={this.props.pathname === 'contact' ? 'active' : ''}>Contact</a>
|
||
|
|
</Link>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<div id='container' className={`page-${this.props.pathname}`}>
|
||
|
|
<h1 dangerouslySetInnerHTML={{ __html: this.props.pathname }} />
|
||
|
|
</div>
|
||
|
|
</div>)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
Main.propTypes = {
|
||
|
|
pathname: PropTypes.string.isRequired
|
||
|
|
}
|