Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

add github comments, css

  • Loading branch information...
commit 0ce19f3b57273480446c8c4d043fbed9a86f5f7a 1 parent 210921e
@andreineculau authored
View
191 assets/strap-jekyll/css/strap-jekyll-default.css
@@ -93,6 +93,27 @@ a:hover > code {
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 {
@@ -100,6 +121,176 @@ a:hover > code {
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 */
body .annotator-bm-status {
View
36 assets/strap-jekyll/js/strap-jekyll-comments-github.js
@@ -1,13 +1,31 @@
-function loadComments(data) {
- for (var i=0; i<data.length; i++) {
- var cuser = data[i].user.login;
- var cuserlink = "https://www.github.com/" + data[i].user.login;
- var clink = "https://github.com/izuzak/izuzak.github.com/issues/{{ page.commentIssueId }}#issuecomment-" + data[i].url.substring(data[i].url.lastIndexOf("/")+1);
- var cbody = data[i].body_html;
- var cavatarlink = data[i].user.avatar_url;
- var cdate = Date.parse(data[i].created_at).toString("yyyy-MM-dd HH:mm:ss");
+function loadGithubComments(data) {
+ var i,
+ cavatar,
+ cuser,
+ cuserlink,
+ clink,
+ cdate,
+ 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>');
}
}
Please sign in to comment.
Something went wrong with that request. Please try again.