parent
e2ff39bf5d
commit
45776b55b0
@ -0,0 +1,28 @@ |
||||
import Drawer from '../ui/components/drawer'; |
||||
import ComposeFormContainer from '../ui/containers/compose_form_container'; |
||||
import FollowFormContainer from '../ui/containers/follow_form_container'; |
||||
import UploadFormContainer from '../ui/containers/upload_form_container'; |
||||
import NavigationContainer from '../ui/containers/navigation_container'; |
||||
import PureRenderMixin from 'react-addons-pure-render-mixin'; |
||||
|
||||
const Compose = React.createClass({ |
||||
|
||||
mixins: [PureRenderMixin], |
||||
|
||||
render () { |
||||
return ( |
||||
<Drawer> |
||||
<div style={{ flex: '1 1 auto' }}> |
||||
<NavigationContainer /> |
||||
<ComposeFormContainer /> |
||||
<UploadFormContainer /> |
||||
</div> |
||||
|
||||
<FollowFormContainer /> |
||||
</Drawer> |
||||
); |
||||
} |
||||
|
||||
}); |
||||
|
||||
export default Compose; |
@ -0,0 +1,19 @@ |
||||
import PureRenderMixin from 'react-addons-pure-render-mixin'; |
||||
import StatusListContainer from '../ui/containers/status_list_container'; |
||||
import Column from '../ui/components/column'; |
||||
|
||||
const HomeTimeline = React.createClass({ |
||||
|
||||
mixins: [PureRenderMixin], |
||||
|
||||
render () { |
||||
return ( |
||||
<Column icon='home' heading='Home'> |
||||
<StatusListContainer type='home' /> |
||||
</Column> |
||||
); |
||||
}, |
||||
|
||||
}); |
||||
|
||||
export default HomeTimeline; |
@ -0,0 +1,19 @@ |
||||
import PureRenderMixin from 'react-addons-pure-render-mixin'; |
||||
import StatusListContainer from '../ui/containers/status_list_container'; |
||||
import Column from '../ui/components/column'; |
||||
|
||||
const MentionsTimeline = React.createClass({ |
||||
|
||||
mixins: [PureRenderMixin], |
||||
|
||||
render () { |
||||
return ( |
||||
<Column icon='at' heading='Mentions'> |
||||
<StatusListContainer type='mentions' /> |
||||
</Column> |
||||
); |
||||
}, |
||||
|
||||
}); |
||||
|
||||
export default MentionsTimeline; |
@ -0,0 +1,38 @@ |
||||
import { Link } from 'react-router'; |
||||
|
||||
const outerStyle = { |
||||
background: '#373b4a', |
||||
margin: '10px', |
||||
flex: '0 0 auto', |
||||
marginBottom: '0', |
||||
display: 'flex' |
||||
}; |
||||
|
||||
const tabStyle = { |
||||
display: 'block', |
||||
flex: '1 1 auto', |
||||
padding: '10px', |
||||
color: '#fff', |
||||
textDecoration: 'none', |
||||
fontSize: '12px', |
||||
fontWeight: '500', |
||||
borderBottom: '2px solid #373b4a' |
||||
}; |
||||
|
||||
const tabActiveStyle = { |
||||
borderBottom: '2px solid #2b90d9', |
||||
color: '#2b90d9' |
||||
}; |
||||
|
||||
const TabsBar = () => { |
||||
return ( |
||||
<div style={outerStyle}> |
||||
<Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/new'><i className='fa fa-fw fa-pencil' /> Compose</Link> |
||||
<Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/home'><i className='fa fa-fw fa-home' /> Home</Link> |
||||
<Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/mentions'><i className='fa fa-fw fa-at' /> Mentions</Link> |
||||
<Link style={tabStyle} activeStyle={tabActiveStyle} to='/statuses/all'><i className='fa fa-fw fa-globe' /> Public</Link> |
||||
</div> |
||||
); |
||||
}; |
||||
|
||||
export default TabsBar; |
Loading…
Reference in new issue