diff --git a/packages/docz-core/src/DataServer.ts b/packages/docz-core/src/DataServer.ts index d1d95fbfa..633713a16 100644 --- a/packages/docz-core/src/DataServer.ts +++ b/packages/docz-core/src/DataServer.ts @@ -87,7 +87,11 @@ export class DataServer { } private configData(config: Config): string { - return this.dataObj('docz.config', config.themeConfig) + return this.dataObj('docz.config', { + ...config.themeConfig, + title: config.title, + description: config.description, + }) } private updateEntries( @@ -105,7 +109,7 @@ export class DataServer { } private updateConfig(socket: WS): () => void { - const config = load('docz', {}, true) + const config = load('docz', { ...this.config }, true) return () => { if (isSocketOpened(socket)) { diff --git a/packages/docz-core/src/commands/args.ts b/packages/docz-core/src/commands/args.ts index 622048bef..dd4fdf346 100644 --- a/packages/docz-core/src/commands/args.ts +++ b/packages/docz-core/src/commands/args.ts @@ -41,11 +41,11 @@ export const args = (yargs: any) => { }) yargs.positional('title', { type: 'string', - default: 'Docz', + default: 'MyDoc', }) yargs.positional('description', { type: 'string', - default: 'My awesome design system!', + default: 'My awesome app using Docz', }) yargs.positional('theme', { type: 'string', diff --git a/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx b/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx index 835aaa250..52c326ffe 100644 --- a/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx +++ b/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx @@ -1,5 +1,5 @@ import React from 'react' -import { Docs, Link, Entry } from 'docz' +import { Docs, Link, Entry, ThemeConfig } from 'docz' import styled from 'react-emotion' import { Menu, isActive } from './Menu' @@ -38,6 +38,28 @@ const Wrapper = styled('div')` } ` +const LogoImg = styled('img')` + margin: 24px 16px 64px; + padding: 0; +` + +const LogoText = styled('h1')` + position: relative; + margin: 24px 16px 64px; + padding: 0; + font-size: 32px; + + &:before { + position: absolute; + content: ''; + bottom: 0; + left: 0; + width: 15%; + height: 3px; + background: ${p => p.theme.colors.primary}; + } +` + export const Sidebar = () => ( {({ docs, menus }) => { @@ -46,6 +68,15 @@ export const Sidebar = () => ( return ( + + {({ title, logo }) => + logo ? ( + + ) : ( + {title} + ) + } + {docsWithoutMenu.map(doc => ( {doc.name} diff --git a/packages/docz/src/components/ThemeConfig.tsx b/packages/docz/src/components/ThemeConfig.tsx index effc78408..c4bcd5ec1 100644 --- a/packages/docz/src/components/ThemeConfig.tsx +++ b/packages/docz/src/components/ThemeConfig.tsx @@ -3,12 +3,8 @@ import { SFC, Children } from 'react' import { dataContext, ThemeConfig as Config } from '../theme' -export interface ThemeConfigRenderProps { - config: Config -} - export interface ThemeConfigProps { - children?: (renderProps: ThemeConfigRenderProps) => React.ReactNode + children?: (config: Config) => React.ReactNode } export const ThemeConfig: SFC = ({ children }) => { @@ -16,7 +12,7 @@ export const ThemeConfig: SFC = ({ children }) => { return ( - {({ config }) => Children.only(children({ config }))} + {({ config }) => Children.only(children(config))} ) } diff --git a/packages/docz/src/theme.tsx b/packages/docz/src/theme.tsx index 8ef0a7b3c..5f6edd23d 100644 --- a/packages/docz/src/theme.tsx +++ b/packages/docz/src/theme.tsx @@ -63,7 +63,7 @@ export function theme( const value = { entries, imports, - config: merge(defaultConfig || {}, config), + config: merge(defaultConfig, config), } return (