From c8b5d1561ec6789283d2d9ddcdf39b1e3cd0f417 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@designcreateplay.com>
Date: Thu, 19 Sep 2013 16:38:04 -0400
Subject: [PATCH] minor CSS fixes to post timeago text in topic view
---
public/src/forum/category.js | 22 +++++++++++-----------
public/templates/category.tpl | 4 +++-
public/themes/vanilla/category.less | 17 +++++++----------
3 files changed, 21 insertions(+), 22 deletions(-)
diff --git a/public/src/forum/category.js b/public/src/forum/category.js
index 847587478b..e2f9c0b054 100644
--- a/public/src/forum/category.js
+++ b/public/src/forum/category.js
@@ -1,4 +1,4 @@
-(function() {
+(function () {
var cid = templates.get('category_id'),
room = 'category_' + cid,
twitterEl = document.getElementById('twitter-intent'),
@@ -11,22 +11,22 @@
app.enter_room(room);
- twitterEl.addEventListener('click', function() {
+ twitterEl.addEventListener('click', function () {
window.open(twitter_url, '_blank', 'width=550,height=420,scrollbars=no,status=no');
return false;
}, false);
- facebookEl.addEventListener('click', function() {
+ facebookEl.addEventListener('click', function () {
window.open(facebook_url, '_blank', 'width=626,height=436,scrollbars=no,status=no');
return false;
}, false);
- googleEl.addEventListener('click', function() {
+ googleEl.addEventListener('click', function () {
window.open(google_url, '_blank', 'width=500,height=570,scrollbars=no,status=no');
return false;
}, false);
var new_post = document.getElementById('new_post');
- new_post.onclick = function() {
- require(['composer'], function(cmp) {
+ new_post.onclick = function () {
+ require(['composer'], function (cmp) {
cmp.push(0, cid);
});
}
@@ -70,7 +70,7 @@
socket.on('event:new_topic', onNewTopic);
socket.emit('api:categories.getRecentReplies', cid);
- socket.on('api:categories.getRecentReplies', function(posts) {
+ socket.on('api:categories.getRecentReplies', function (posts) {
if (!posts || posts.length === 0) {
return;
}
@@ -91,7 +91,7 @@
'<p>' +
posts[i].content +
'</p>' +
- '<span><strong>' + posts[i].username + '</strong></span> -<span class="timeago" title="' + posts[i].relativeTime + '"></span>' +
+ '<p class="meta"><strong>' + posts[i].username + '</strong></span> -<span class="timeago" title="' + posts[i].relativeTime + '"></span></p>' +
'</a>';
frag.appendChild(li.cloneNode(true));
@@ -121,7 +121,7 @@
socket.emit('api:category.loadMore', {
cid: cid,
after: $('#topics-container').children().length
- }, function(data) {
+ }, function (data) {
if (data.topics.length) {
onTopicsLoaded(data.topics);
}
@@ -129,7 +129,7 @@
});
}
- $(window).off('scroll').on('scroll', function(ev) {
+ $(window).off('scroll').on('scroll', function (ev) {
var bottom = ($(document).height() - $(window).height()) * 0.9;
if ($(window).scrollTop() > bottom && !loadingMoreTopics) {
@@ -138,4 +138,4 @@
});
-})();
+})();
\ No newline at end of file
diff --git a/public/templates/category.tpl b/public/templates/category.tpl
index 41f5cbd021..0a6a5f34f8 100644
--- a/public/templates/category.tpl
+++ b/public/templates/category.tpl
@@ -36,7 +36,9 @@
<div class="pull-right">
<img class="img-rounded" style="width: 48px; height: 48px; /*temporary*/" src="{topics.teaser_userpicture}" />
<p>{topics.teaser_text}</p>
- <span><strong>{topics.teaser_username}</strong> posted</span><span class="timeago" title="{topics.teaser_timestamp}"></span>
+ <p class="meta">
+ <strong>{topics.teaser_username}</strong> posted <span class="timeago" title="{topics.teaser_timestamp}"></span>
+ </p>
</div>
</div>
<div>
diff --git a/public/themes/vanilla/category.less b/public/themes/vanilla/category.less
index f4f230b39d..49f46e94f5 100644
--- a/public/themes/vanilla/category.less
+++ b/public/themes/vanilla/category.less
@@ -27,6 +27,12 @@
margin-left: -25px;
}
+ .meta {
+ font-size: 12px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ }
.topic-row {
@@ -92,22 +98,13 @@
display: block;
float: left;
}
+
p {
display: block;
float: left;
width: 70%;
margin-left: 10px;
overflow: hidden;
- height: 32px;
- }
- span {
- display: block;
- float: left;
- margin-left: 10px;
- overflow: hidden;
- height: 16px;
- margin-top: -10px;
- color: #666;
}
}
}