diff --git a/src/js/components/feed.jsx b/src/js/components/feed.jsx
index 729d937..aad98bc 100644
--- a/src/js/components/feed.jsx
+++ b/src/js/components/feed.jsx
@@ -30,14 +30,14 @@ module.exports = React.createClass({
}
this.setState({
- messages: _(messages).sortBy('timestamp').reverse().value()
+ messages: _(messages).sortBy('timestamp').reverse().value().slice(0, 40)
});
}).catch(throwError);
},
render() {
var messages = this.state.messages.map((message) => {
- var image =
;
+ var image =
;
if(message.imageLink) {
image = {image};
@@ -45,8 +45,11 @@ module.exports = React.createClass({
return (
- {image}
+
{image}
+
diff --git a/src/styles/style.styl b/src/styles/style.styl
index c46d047..d3ea544 100644
--- a/src/styles/style.styl
+++ b/src/styles/style.styl
@@ -215,23 +215,29 @@ footer
padding-right 0
.message
- padding 0.5em
+ padding 1em
padding-right 2em
-
border-top 1px solid #E5E5E5
position relative
- overflow auto
+ display flex
+
+.message__content
+ flex 1
.message__body
font-weight 400
font-size 14px
+ line-height 1.4em
.message__image
- width 2.5em
- float left
- margin-right 0.5em
- margin-top 0.2em
- vertical-align top
+ width 50px
+ margin-right 1em
+ margin-top 0.5em
+ text-align center
+ a
+ outline 0
+ img
+ width 50px
.message__icon
margin 6px
@@ -248,7 +254,8 @@ footer
.message__details
font-size 0.7em
- margin-top 0.3em
+ margin-top 0.5em
+
.message__meta
margin-left 0.5em