Skip to content
This repository was archived by the owner on Apr 26, 2024. It is now read-only.

Commit da919e8

Browse files
amiller-ghamiller-gh
committed
feat: Learn page styles and functional side nav.
1 parent ebf4ad9 commit da919e8

7 files changed

Lines changed: 523 additions & 117 deletions

File tree

‎gatsby-config.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ if (process.env.ENVIROMENT !== 'production') {
99

1010
module.exports = {
1111
siteMetadata: {
12-
title: 'Nodejs.dev Working Site',
12+
title: 'Node.js',
1313
},
1414
plugins: [
1515
'gatsby-plugin-catch-links',

‎gatsby-node.js‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
/**
2-
* Implement Gatsby's Node APIs in this file.
3-
*
4-
* See: https://www.gatsbyjs.org/docs/node-apis/
5-
*/
1+
exports.onCreatePage = async ({ page, actions }) => {
2+
const { createPage } = actions
63

7-
// You can delete this file if you're not using it
4+
// If this is the learn page, accept all following paths.
5+
if (page.path.match(/^\/learn/)) {
6+
page.matchPath = "/learn/*";
7+
8+
// Update the page.
9+
createPage(page)
10+
}
11+
}

‎src/components/header.tsx‎

Lines changed: 11 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -8,35 +8,23 @@ type Props = {
88
}
99

1010
const Header = ({ siteTitle }: Props) => (
11-
<div
12-
style={{
13-
borderBottom: '1px solid var(--gray2)',
14-
marginBottom: '1.4rem',
15-
}}
16-
>
17-
<div
11+
<nav className="nav">
12+
<ul
1813
style={{
1914
margin: '0 auto',
20-
maxWidth: 1024,
21-
padding: '1.4rem 1.2rem',
15+
padding: '1.4rem 4.8rem',
2216
display: 'flex',
23-
alignItems: 'center'
17+
alignItems: 'center',
18+
listStyle: 'none',
2419
}}
2520
>
26-
<img src={logo} style={{ width: '120px', margin: '14px 24px 0 0' }} />
27-
<h1 style={{ margin: 0 }}>
28-
<Link
29-
to="/"
30-
style={{
31-
color: 'var(--gray9)',
32-
textDecoration: 'none',
33-
}}
34-
>
35-
{siteTitle}
21+
<li>
22+
<Link to="/">
23+
<img src={logo} alt={siteTitle} style={{ height: '62px', margin: '-6px 24px 0 0' }} />
3624
</Link>
37-
</h1>
38-
</div>
39-
</div>
25+
</li>
26+
</ul>
27+
</nav>
4028
)
4129

4230
export default Header

0 commit comments

Comments
 (0)