frontend: redesign score and timeago subtitle
This commit is contained in:
parent
1f8f3b3a36
commit
bcc81e1ad8
@ -38,6 +38,7 @@
|
||||
var ID_CARD = "commento-comment-card-";
|
||||
var ID_BODY = "commento-comment-body-";
|
||||
var ID_SUBTITLE = "commento-comment-subtitle-";
|
||||
var ID_TIMEAGO = "commento-comment-timeago-";
|
||||
var ID_SCORE = "commento-comment-score-";
|
||||
var ID_OPTIONS = "commento-comment-options-";
|
||||
var ID_EDIT = "commento-comment-edit-";
|
||||
@ -609,6 +610,7 @@
|
||||
var card = create("div");
|
||||
var header = create("div");
|
||||
var subtitle = create("div");
|
||||
var timeago = create("div");
|
||||
var score = create("div");
|
||||
var body = create("div");
|
||||
var options = create("div");
|
||||
@ -632,6 +634,7 @@
|
||||
card.id = ID_CARD + comment.commentHex;
|
||||
body.id = ID_BODY + comment.commentHex;
|
||||
subtitle.id = ID_SUBTITLE + comment.commentHex;
|
||||
timeago.id = ID_TIMEAGO + comment.commentHex;
|
||||
score.id = ID_SCORE + comment.commentHex;
|
||||
options.id = ID_OPTIONS + comment.commentHex;
|
||||
edit.id = ID_EDIT + comment.commentHex;
|
||||
@ -663,7 +666,7 @@
|
||||
card.style["borderLeft"] = "2px solid " + color;
|
||||
name.innerText = commenter.name;
|
||||
body.innerHTML = comment.html;
|
||||
subtitle.innerHTML = timeDifference((new Date()).getTime(), Date.parse(comment.creationDate));
|
||||
timeago.innerHTML = timeDifference((new Date()).getTime(), Date.parse(comment.creationDate));
|
||||
score.innerText = scorify(comment.score);
|
||||
|
||||
if (commenter.photo == "undefined") {
|
||||
@ -688,6 +691,7 @@
|
||||
classAdd(header, "header");
|
||||
classAdd(name, "name");
|
||||
classAdd(subtitle, "subtitle");
|
||||
classAdd(timeago, "timeago");
|
||||
classAdd(score, "score");
|
||||
classAdd(body, "body");
|
||||
classAdd(options, "options");
|
||||
@ -776,6 +780,7 @@
|
||||
attrSet(options.childNodes[i], "style", "right: " + (i*32) + "px;");
|
||||
|
||||
append(subtitle, score);
|
||||
append(subtitle, timeago);
|
||||
|
||||
append(header, options);
|
||||
append(header, avatar);
|
||||
|
@ -1,4 +1,4 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');
|
||||
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700');
|
||||
|
||||
.commento-root-min-height {
|
||||
min-height: 350px;
|
||||
@ -41,7 +41,7 @@
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
color: $red-7;
|
||||
font-weight: bold;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.commento-mod-tools {
|
||||
@ -53,7 +53,7 @@
|
||||
text-transform: uppercase;
|
||||
color: $indigo-8;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.commento-moderation-notice {
|
||||
@ -62,7 +62,7 @@
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
color: $orange-7;
|
||||
font-weight: bold;
|
||||
font-weight: 700;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
@ -111,7 +111,7 @@
|
||||
}
|
||||
|
||||
.commento-name {
|
||||
font-weight: bold;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
border: none;
|
||||
@ -131,13 +131,20 @@
|
||||
margin-left: 48px;
|
||||
}
|
||||
|
||||
.commento-score {
|
||||
.commento-timeago {
|
||||
display: inline;
|
||||
color: #999;
|
||||
color: #888;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.commento-score::before {
|
||||
.commento-score {
|
||||
display: inline;
|
||||
color: #888;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.commento-timeago::before {
|
||||
content: "\00a0 \00a0 \00b7 \00a0 \00a0";
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user