Titles
This commit is contained in:
parent
95f69d9feb
commit
ccab580aef
|
@ -1,5 +1,6 @@
|
|||
import React from 'react';
|
||||
import Link from 'react-router/lib/Link';
|
||||
import Helmet from 'react-helmet';
|
||||
import { observe } from 'mobx';
|
||||
|
||||
import store from 'stores/UserStore';
|
||||
|
@ -17,6 +18,7 @@ class Layout extends React.Component {
|
|||
static propTypes = {
|
||||
actions: React.PropTypes.node,
|
||||
title: React.PropTypes.node,
|
||||
titleText: React.PropTypes.node,
|
||||
fixed: React.PropTypes.bool,
|
||||
loading: React.PropTypes.bool,
|
||||
}
|
||||
|
@ -24,6 +26,14 @@ class Layout extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<div className={ styles.container }>
|
||||
<Helmet
|
||||
title={
|
||||
this.props.titleText
|
||||
? `${this.props.titleText} - Beautiful Atlas`
|
||||
: 'Beautiful Atlas'
|
||||
}
|
||||
/>
|
||||
|
||||
{ this.props.loading ? (
|
||||
<LoadingIndicator />
|
||||
) : null }
|
||||
|
|
|
@ -30,6 +30,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
a {
|
||||
color: $textColor;
|
||||
}
|
||||
}
|
||||
|
||||
.teamName a {
|
||||
font-family: 'Atlas Grotesk';
|
||||
font-weight: bold;
|
||||
|
|
|
@ -24,18 +24,21 @@ class Atlas extends React.Component {
|
|||
|
||||
let actions;
|
||||
let title;
|
||||
let titleText;
|
||||
|
||||
if (atlas) {
|
||||
actions = <HeaderAction>
|
||||
<Link to={ `/atlas/${atlas.id}/new` }>New document</Link>
|
||||
</HeaderAction>;
|
||||
title = <Title>{ atlas.name }</Title>;
|
||||
titleText = atlas.name;
|
||||
}
|
||||
|
||||
return (
|
||||
<Layout
|
||||
actions={ actions }
|
||||
title={ title }
|
||||
titleText={ titleText }
|
||||
>
|
||||
<CenteredContent>
|
||||
{ store.isFetching ? (
|
||||
|
|
|
@ -78,6 +78,9 @@ class DocumentEdit extends Component {
|
|||
{ store.title }
|
||||
</Title>
|
||||
);
|
||||
|
||||
let titleText = store.title;
|
||||
|
||||
const actions = (
|
||||
<Flex direction="row">
|
||||
<HeaderAction>
|
||||
|
@ -101,6 +104,7 @@ class DocumentEdit extends Component {
|
|||
<Layout
|
||||
actions={ actions }
|
||||
title={ title }
|
||||
titleText={ titleText }
|
||||
fixed={ true }
|
||||
loading={ store.isSaving }
|
||||
>
|
||||
|
|
|
@ -46,6 +46,7 @@ class DocumentScene extends React.Component {
|
|||
render() {
|
||||
const doc = store.document;
|
||||
let title;
|
||||
let titleText;
|
||||
let actions;
|
||||
if (doc) {
|
||||
actions = (
|
||||
|
@ -58,12 +59,19 @@ class DocumentScene extends React.Component {
|
|||
</DropdownMenu>
|
||||
</div>
|
||||
);
|
||||
title = `${doc.atlas.name} - ${doc.title}`;
|
||||
title = (
|
||||
<span>
|
||||
<Link to={ `/atlas/${doc.atlas.id}` }>{doc.atlas.name}</Link>
|
||||
{ ` / ${doc.title}` }
|
||||
</span>
|
||||
);
|
||||
titleText = `${doc.atlas.name} - ${doc.title}`;
|
||||
}
|
||||
|
||||
return (
|
||||
<Layout
|
||||
title={ title }
|
||||
titleText={ titleText }
|
||||
actions={ actions }
|
||||
>
|
||||
<CenteredContent>
|
||||
|
|
Reference in New Issue