-
-
Notifications
You must be signed in to change notification settings - Fork 1.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
35fac28
commit a01d100
Showing
23 changed files
with
326 additions
and
109 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
37 changes: 27 additions & 10 deletions
37
core/gatsby-theme-docz/src/docz/components/Layout/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +1,33 @@ | ||
/** @jsx jsx */ | ||
import { jsx, css, Layout as BaseLayout, Main, Container } from 'theme-ui' | ||
import { useRef, useState } from 'react' | ||
import { jsx, Layout as BaseLayout, Main, Container } from 'theme-ui' | ||
import { Global } from '@emotion/core' | ||
|
||
import global from '@docz/theme/global' | ||
import { Header } from '../Header' | ||
import { Sidebar } from '../Sidebar' | ||
import * as styles from './styles' | ||
|
||
export const Layout = ({ children }) => ( | ||
<BaseLayout css={{ '> div': { flex: '1 1 auto' } }}> | ||
<Global styles={global} /> | ||
<Main> | ||
<Header /> | ||
<Container>{children}</Container> | ||
</Main> | ||
</BaseLayout> | ||
) | ||
export const Layout = ({ children }) => { | ||
const [open, setOpen] = useState(false) | ||
const nav = useRef() | ||
|
||
return ( | ||
<BaseLayout sx={{ '& > div': { flex: '1 1 auto' } }}> | ||
<Global styles={global} /> | ||
<Main> | ||
<Header nav={nav} onOpen={setOpen} /> | ||
<Container sx={styles.container}> | ||
<Sidebar | ||
ref={nav} | ||
open={open} | ||
onFocus={() => setOpen(true)} | ||
onBlur={() => setOpen(false)} | ||
onClick={() => setOpen(false)} | ||
/> | ||
<div sx={styles.content}>{children}</div> | ||
</Container> | ||
</Main> | ||
</BaseLayout> | ||
) | ||
} |
19 changes: 19 additions & 0 deletions
19
core/gatsby-theme-docz/src/docz/components/Layout/styles.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import { media } from '@docz/theme/breakpoints' | ||
|
||
export const container = { | ||
py: 0, | ||
display: 'grid', | ||
gridTemplateColumns: '250px 1fr', | ||
[media.tablet]: { | ||
display: 'block', | ||
}, | ||
} | ||
|
||
export const content = { | ||
py: 5, | ||
px: 4, | ||
[media.tablet]: { | ||
py: 4, | ||
px: 0, | ||
}, | ||
} |
22 changes: 22 additions & 0 deletions
22
core/gatsby-theme-docz/src/docz/components/NavGroup/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
/** @jsx jsx */ | ||
import { jsx } from 'theme-ui' | ||
|
||
import * as styles from './styles' | ||
import { NavLink } from '../NavLink' | ||
|
||
export const NavGroup = ({ item }) => { | ||
const { menu } = item | ||
return ( | ||
<div sx={styles.wrapper}> | ||
<div sx={styles.title}>{item.name}</div> | ||
{menu && | ||
menu.map(menu => { | ||
return ( | ||
<NavLink key={menu.id} item={menu}> | ||
{menu.name} | ||
</NavLink> | ||
) | ||
})} | ||
</div> | ||
) | ||
} |
11 changes: 11 additions & 0 deletions
11
core/gatsby-theme-docz/src/docz/components/NavGroup/styles.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
export const wrapper = { | ||
my: 3, | ||
} | ||
|
||
export const title = { | ||
mb: 1, | ||
fontSize: 0, | ||
fontWeight: 600, | ||
textTransform: 'uppercase', | ||
color: 'sidebar.navGroup', | ||
} |
52 changes: 33 additions & 19 deletions
52
core/gatsby-theme-docz/src/docz/components/NavLink/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,40 @@ | ||
/** @jsx jsx */ | ||
import React from 'react' | ||
import { jsx } from 'theme-ui' | ||
import { Link } from 'gatsby' | ||
import isAbsoluteURL from 'is-absolute-url' | ||
import { useDocs, useCurrentDoc } from 'docz' | ||
import { get } from 'lodash/fp' | ||
|
||
const styles = { | ||
display: 'inline-block', | ||
px: 2, | ||
py: 2, | ||
color: 'inherit', | ||
textDecoration: 'none', | ||
fontSize: 1, | ||
fontWeight: 'bold', | ||
'&.active': { | ||
color: 'primary', | ||
}, | ||
import * as styles from './styles' | ||
|
||
const getHeadings = (route, docs) => { | ||
const doc = docs.find(doc => doc.route === route) | ||
const headings = get('headings', doc) | ||
return headings ? headings.filter(heading => heading.depth === 2) : [] | ||
} | ||
|
||
export const NavLink = ({ href, ...props }) => { | ||
const isExternal = isAbsoluteURL(href || '') | ||
if (isExternal) { | ||
return <a {...props} href={href} css={styles} /> | ||
} | ||
const to = props.to || href | ||
return <Link {...props} to={to} css={styles} activeClassName="active" /> | ||
export const NavLink = ({ item, ...props }) => { | ||
const docs = useDocs() | ||
const to = item.route | ||
const headings = docs && getHeadings(to, docs) | ||
const current = useCurrentDoc() | ||
const isCurrent = item.route === current.route | ||
const showHeadings = isCurrent && headings && headings.length > 0 | ||
|
||
return ( | ||
<React.Fragment> | ||
<Link {...props} to={to} sx={styles.link} activeClassName="active" /> | ||
{showHeadings && | ||
headings.map(heading => ( | ||
<Link | ||
key={heading.slug} | ||
to={`${to}#${heading.slug}`} | ||
sx={styles.smallLink} | ||
activeClassName="active" | ||
> | ||
{heading.value} | ||
</Link> | ||
))} | ||
</React.Fragment> | ||
) | ||
} |
20 changes: 20 additions & 0 deletions
20
core/gatsby-theme-docz/src/docz/components/NavLink/styles.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
export const link = { | ||
my: 2, | ||
display: 'block', | ||
color: 'sidebar.navLink', | ||
textDecoration: 'none', | ||
fontSize: 2, | ||
'&.active': { | ||
color: 'sidebar.navLinkActive', | ||
}, | ||
} | ||
|
||
export const smallLink = { | ||
...link, | ||
ml: 2, | ||
fontSize: 1, | ||
color: 'sidebar.tocLink', | ||
'&.active': { | ||
color: 'sidebar.tocLinkActive', | ||
}, | ||
} |
14 changes: 14 additions & 0 deletions
14
core/gatsby-theme-docz/src/docz/components/NavSearch/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
/** @jsx jsx */ | ||
import { jsx } from 'theme-ui' | ||
|
||
import * as styles from './styles' | ||
import { Search } from '../Icons' | ||
|
||
export const NavSearch = props => { | ||
return ( | ||
<div sx={styles.wrapper}> | ||
<Search size={20} sx={styles.icon} /> | ||
<input {...props} sx={styles.input} /> | ||
</div> | ||
) | ||
} |
18 changes: 18 additions & 0 deletions
18
core/gatsby-theme-docz/src/docz/components/NavSearch/styles.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
export const wrapper = { | ||
mb: 3, | ||
display: 'flex', | ||
alignItems: 'center', | ||
} | ||
|
||
export const input = { | ||
outline: 'none', | ||
background: 'none', | ||
border: 'none', | ||
color: 'text', | ||
fontSize: 1, | ||
} | ||
|
||
export const icon = { | ||
color: 'border', | ||
mr: 2, | ||
} |
Oops, something went wrong.