Skip to content

Commit

Permalink
add github comments, css
Browse files Browse the repository at this point in the history
  • Loading branch information
Andrei Neculau committed Nov 22, 2012
1 parent 210921e commit 0ce19f3
Show file tree
Hide file tree
Showing 2 changed files with 218 additions and 9 deletions.
191 changes: 191 additions & 0 deletions assets/strap-jekyll/css/strap-jekyll-default.css
View file
Expand Up @@ -93,13 +93,204 @@ a:hover > code {
margin-top:0px; margin-top:0px;
} }


.post-meta .post-categories .btn-group button:not(.dropdown-toggle),
.post-meta .post-tags .btn-group button:not(.dropdown-toggle) {
cursor:default;
}

span.post-meta {
margin-left:30px;
}

.post-meta .post-categories .btn-group,
.post-meta .post-tags .btn-group {
opacity:0.25;
filter: alpha(opacity=25);
}

.post-meta .post-categories:hover .btn-group,
.post-meta .post-tags:hover .btn-group {
opacity:1;
filter: alpha(opacity=100);
}



/* Post Comments */ /* Post Comments */
#post-comments { #post-comments {
margin:50px; margin:50px;
border-top:1px solid #eee; border-top:1px solid #eee;
} }


/* http://ivanzuzak.info/2011/02/18/github-hosted-comments-for-github-hosted-blogs.html */
.comment {
background-color: transparent;
border-color: #CACACA;
border-style: solid;
border-width: 1px;
color: black;
display: block;
margin-bottom: 10px;
margin-top: 10px;
padding: 0px;
width: 100%;
}

.comment .commentheader {
border-bottom-color: #CACACA;
border-bottom-style: solid;
border-bottom-width: 1px;
color: black;
background-image: -webkit-linear-gradient(#F8F8F8,#E1E1E1);
background-image: -moz-linear-gradient(#F8F8F8,#E1E1E1);
color: black;
display: block;
float: left;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 33px;
line-height: 33px;
margin: 0px;
overflow-x: hidden;
overflow-y: hidden;
padding: 0px;
text-overflow: ellipsis;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 100%;
}

.comment .commentheader .commentgravatar {
background-attachment: scroll;
background-clip: border-box;
background-color: white;
background-image: none;
background-origin: padding-box;
border-color: #C8C8C8;
border-style: solid;
border-width: 1px;
color: black;
display: inline-block;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 1px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 20px;
line-height: 1px;
margin-left: 5px;
margin-right: 3px;
margin-top: -2px;
overflow-x: visible;
overflow-y: visible;
padding: 1px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
vertical-align: middle;
white-space: nowrap;
width: 20px;
}

.comment .commentheader a:link {
text-decoration: none;
}

.comment .commentheader a:hover {
border-bottom:1px solid;
}

.comment .commentheader .commentuser {
background-color: transparent;
color: black;
display: inline;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: bold;
height: 0px;
line-height: 16px;
margin-left: 5px;
margin-right: 10px;
overflow-x: visible;
overflow-y: visible;
padding: 0px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 0px;
}

.comment .commentheader .commentdate {
background-color: transparent;
color: #777;
display: inline;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 11px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 0px;
line-height: 33px;
margin: 0px;
overflow-x: visible;
overflow-y: visible;
padding: 0px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 20em;
}

.comment .commentbody {
background-attachment: scroll;
background-clip: border-box;
background-color: transparent;
background-image: none;
background-origin: padding-box;
color: #333;
display: block;
margin-bottom: 1em;
margin-left: 1em;
margin-right: 1em;
margin-top: 40px;
overflow-x: visible;
overflow-y: visible;
padding: 0em;
position: static;
width: 96%;
word-wrap: break-word;
}

.comment .commentbody p {
margin-bottom: 0.5em;
margin-top: 0.5em;
margin-left: 0em;
margin-right: 0em;
}

.comment .commentbody pre {
border: 0px solid #ddd;
background-color: #eef;
padding: 0 .4em;
}

.comment .commentbody pre code {
border: 0px solid #ddd;
}

.comment .commentbody code {
border: 1px solid #ddd;
background-color: #eef;
font-size: 85%;
padding: 0 .2em;
}



/* Annotator */ /* Annotator */
body .annotator-bm-status { body .annotator-bm-status {
Expand Down
36 changes: 27 additions & 9 deletions assets/strap-jekyll/js/strap-jekyll-comments-github.js
View file
@@ -1,13 +1,31 @@
function loadComments(data) { function loadGithubComments(data) {
for (var i=0; i<data.length; i++) { var i,
var cuser = data[i].user.login; cavatar,
var cuserlink = "https://www.github.com/" + data[i].user.login; cuser,
var clink = "https://github.com/izuzak/izuzak.github.com/issues/{{ page.commentIssueId }}#issuecomment-" + data[i].url.substring(data[i].url.lastIndexOf("/")+1); cuserlink,
var cbody = data[i].body_html; clink,
var cavatarlink = data[i].user.avatar_url; cdate,
var cdate = Date.parse(data[i].created_at).toString("yyyy-MM-dd HH:mm:ss"); cheader,
cbody,
url;


$("#comments").append("<div class='comment'><div class='commentheader'><div class='commentgravatar'>" + '<img src="' + cavatarlink + '" alt="" width="20" height="20">' + "</div><a class='commentuser' href=\""+ cuserlink + "\">" + cuser + "</a><a class='commentdate' href=\"" + clink + "\">" + cdate + "</a></div><div class='commentbody'>" + cbody + "</div></div>"); url = $('#post-comments-url').attr('href');

for (i = 0; i < data.length; i++) {
cavatar = data[i].user.avatar_url;
cuser = data[i].user.login;
cuserlink = 'https://www.github.com/' + data[i].user.login;
clink = url + '#issuecomment-' + data[i].url.substring(data[i].url.lastIndexOf('/')+1);
cdate = Date.parse(data[i].created_at).toString('yyyy-MM-dd HH:mm:ss');
cbody = data[i].body_html;

cavatar = '<div class="commentgravatar"><img src="' + cavatar + '" alt="" width="20" height="20"></div>';
cuser = '<a class="commentuser" href="' + cuserlink + '">' + cuser + '</a>';
cdate = '<a class="commentdate" href="' + clink + '">' + cdate + '</a>';
cheader = '<div class="commentheader">' + cavatar + cuser + cdate + '</div>'
cbody = '<div class="commentbody">' + cbody + '</div>'

$('#post-comments-placeholder').append('<div class="comment">' + cheader + cbody + '</div>');
} }
} }


Expand Down

0 comments on commit 0ce19f3

Please sign in to comment.