Make discussion hero extensible

This commit is contained in:
Toby Zerner 2015-05-02 08:36:04 +09:30
parent 80e8630c1c
commit fbdd730ce3
3 changed files with 41 additions and 6 deletions

View File

@ -0,0 +1,27 @@
import Component from 'flarum/component';
import ItemList from 'flarum/utils/item-list';
import listItems from 'flarum/helpers/list-items';
export default class DiscussionHero extends Component {
view() {
var discussion = this.props.discussion;
return m('header.hero.discussion-hero', [
m('div.container', m('ul.discussion-hero-items', listItems(this.items().toArray())))
]);
}
items() {
var items = new ItemList();
var discussion = this.props.discussion;
var badges = discussion.badges().toArray();
if (badges.length) {
items.add('badges', m('ul.badges', listItems(badges)));
}
items.add('title', m('h2.discussion-title', discussion.title()));
return items;
}
}

View File

@ -3,6 +3,7 @@ import ItemList from 'flarum/utils/item-list';
import IndexPage from 'flarum/components/index-page';
import PostStream from 'flarum/utils/post-stream';
import DiscussionList from 'flarum/components/discussion-list';
import DiscussionHero from 'flarum/components/discussion-hero';
import StreamContent from 'flarum/components/stream-content';
import StreamScrubber from 'flarum/components/stream-scrubber';
import ComposerReply from 'flarum/components/composer-reply';
@ -125,12 +126,7 @@ export default class DiscussionPage extends Component {
return m('div', {config: this.onload.bind(this)}, [
app.cache.discussionList ? m('div.index-area.paned', {config: this.configIndex.bind(this)}, app.cache.discussionList.view()) : '',
m('div.discussion-area', discussion ? [
m('header.hero.discussion-hero', [
m('div.container', [
m('ul.badges', listItems(discussion.badges().toArray())), ' ',
m('h2.discussion-title', discussion.title())
])
]),
DiscussionHero.component({discussion}),
m('div.container', [
m('nav.discussion-nav', [
m('ul', listItems(this.sidebarItems().toArray()))

View File

@ -5,6 +5,18 @@
& .badges {
margin-right: 5px;
}
& .discussion-hero-items {
padding: 0;
margin: 0;
list-style: none;
& > li {
display: inline-block;
}
& .block-item {
display: block;
}
}
}
.discussion-title {
display: inline;