fix(fs.shared): Links in navigation
This commit is contained in:
parent
453a26b868
commit
1c0b8458e5
1 changed files with 19 additions and 33 deletions
|
@ -10,9 +10,6 @@ import GuideIcon from 'shared/components/icons/guide.js'
|
||||||
import HelpIcon from 'shared/components/icons/help.js'
|
import HelpIcon from 'shared/components/icons/help.js'
|
||||||
import DocsIcon from 'shared/components/icons/docs.js'
|
import DocsIcon from 'shared/components/icons/docs.js'
|
||||||
|
|
||||||
// TODO: Clean this up after restructuring markdown content
|
|
||||||
const hide = ['contributors', 'developers', 'editors', 'translators']
|
|
||||||
|
|
||||||
// Don't show children for blog and showcase posts
|
// Don't show children for blog and showcase posts
|
||||||
const keepClosed = ['blog', 'showcase', ]
|
const keepClosed = ['blog', 'showcase', ]
|
||||||
|
|
||||||
|
@ -80,7 +77,7 @@ const SubLevel = ({ nodes={}, active }) => (
|
||||||
hover:cursor-row-resize
|
hover:cursor-row-resize
|
||||||
items-center
|
items-center
|
||||||
`}>
|
`}>
|
||||||
<Link href={child.__slug}>
|
<Link href={`/${child.__slug}`}>
|
||||||
<a title={child.__title} className={`
|
<a title={child.__title} className={`
|
||||||
grow pl-2 border-l-2
|
grow pl-2 border-l-2
|
||||||
hover:border-secondary
|
hover:border-secondary
|
||||||
|
@ -105,7 +102,7 @@ const SubLevel = ({ nodes={}, active }) => (
|
||||||
</li>
|
</li>
|
||||||
) : (
|
) : (
|
||||||
<li className='pl-2 flex flex-row items-center'>
|
<li className='pl-2 flex flex-row items-center'>
|
||||||
<Link href={child.__slug} title={child.__title}>
|
<Link href={`/${child.__slug}`} title={child.__title}>
|
||||||
<a className={`
|
<a className={`
|
||||||
pl-2 border-l-2
|
pl-2 border-l-2
|
||||||
grow hover:border-secondary
|
grow hover:border-secondary
|
||||||
|
@ -195,40 +192,29 @@ const TopTheme = ({ app }) => (
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|
||||||
// TODO: Get rid of this when markdown has been restructured
|
|
||||||
const remove = ['contributors', 'developers', 'editors', 'translators']
|
|
||||||
const Navigation = ({ app, active }) => {
|
const Navigation = ({ app, active }) => {
|
||||||
if (!app.navigation) return null
|
if (!app.navigation) return null
|
||||||
const output = []
|
const output = []
|
||||||
for (const key of Object.keys(app.navigation).sort()) {
|
for (const key of Object.keys(app.navigation).sort()) output.push(<TopLevel
|
||||||
if (hide.indexOf(key) === -1) output.push(<TopLevel
|
icon={icons[key] || <span className="text-3xl mr-2 translate-y-3 inline-block p-0 leading-3">°</span>}
|
||||||
icon={icons[key] || <span className="text-3xl mr-2 translate-y-3 inline-block p-0 leading-3">°</span>}
|
title={key}
|
||||||
title={key}
|
slug={key}
|
||||||
slug={key}
|
key={key}
|
||||||
key={key}
|
hasChildren={keepClosed.indexOf(key) === -1}
|
||||||
hasChildren={keepClosed.indexOf(key) === -1}
|
nav={app.navigation}
|
||||||
nav={app.navigation}
|
current={order(app.navigation[key])}
|
||||||
current={order(app.navigation[key])}
|
active={active}
|
||||||
active={active}
|
/>)
|
||||||
/>)
|
|
||||||
}
|
|
||||||
|
|
||||||
return output
|
return output
|
||||||
}
|
}
|
||||||
|
|
||||||
const PrimaryMenu = ({ app, active }) => {
|
const PrimaryMenu = ({ app, active }) => (
|
||||||
|
<nav className="sm:max-w-sm grow mb-12">
|
||||||
return (
|
<TopLogo app={app}/>
|
||||||
<nav className={`
|
<Navigation app={app} active={active} />
|
||||||
sm:max-w-sm
|
<TopTheme app={app}/>
|
||||||
grow
|
</nav>
|
||||||
mb-12
|
)
|
||||||
`}>
|
|
||||||
<TopLogo app={app}/>
|
|
||||||
<Navigation app={app} active={active} />
|
|
||||||
<TopTheme app={app}/>
|
|
||||||
</nav>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default PrimaryMenu
|
export default PrimaryMenu
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue