--- a/kallithea/public/css/style.css	Sun Jun 25 18:49:21 2017 +0200
+++ b/kallithea/public/css/style.css	Tue Sep 20 22:01:48 2016 +0200
@@ -2634,42 +2634,13 @@
 
 
 /** comment main **/
-.comments {
+
+.comment .panel {
     max-width: 978px;
 }
 
-.comments .comment .comment-wrapp {
-    border: 1px solid #ddd;
-    margin-top: 10px;
-    border-radius: 4px;
-}
-
-.comments .comment .meta {
-    background: #f8f8f8;
-    padding: 4px;
-    border-bottom: 1px solid #ddd;
-    min-height: 18px;
-    overflow: auto;
-}
-
-.comments .comment .meta img {
-    vertical-align: middle;
-}
-
-.comments .comment .meta .user {
-    font-weight: bold;
-    float: left;
-    padding: 4px 2px 2px 2px;
-}
-
-.comments .comment .meta .date {
-    float: left;
-    padding: 4px 4px 0px 4px;
-}
-
-.comments .comment .text {
+.comment .panel-body {
     background-color: #FAFAFA;
-    margin: 6px;
 }
 
 .comments-number {
@@ -2734,11 +2705,6 @@
     margin-bottom: 10px;
 }
 
-.comment .buttons {
-    float: right;
-    margin: -1px 0px 0px 0px;
-}
-
 .panel-heading .pull-left input[type=checkbox],
 .panel-heading .pull-right input[type=checkbox] {
     position: relative;
@@ -2817,45 +2783,10 @@
     margin-left: 0;
 }
 
-.inline-comments .comment .comment-wrapp {
-    max-width: 978px;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    background-color: #FAFAFA;
-}
-
 .inline-comments .add-button-row {
     padding: 2px 4px 8px 5px;
 }
 
-.inline-comments .comment .meta {
-    background: #f8f8f8;
-    padding: 4px;
-    border-bottom: 1px solid #ddd;
-    min-height: 15px;
-    overflow: auto;
-}
-
-.inline-comments .comment .meta img {
-    vertical-align: middle;
-}
-
-.inline-comments .comment .meta .user {
-    font-weight: bold;
-    float: left;
-    padding: 3px;
-}
-
-.inline-comments .comment .meta .date {
-    float: left;
-    padding: 3px;
-}
-
-.inline-comments .comment .text {
-    background-color: #FAFAFA;
-    margin: 6px;
-}
-
 .inline-comments .comments-number {
     padding: 0px 0px 10px 0px;
     color: #666;
@@ -3209,9 +3140,8 @@
   content: "";
 }
 
-div.comment:target>.comment-wrapp {
+div.comment:target>.panel {
     border: solid 2px #ee0 !important;
-    margin: 2px 2px 4px 4px;
 }
 
 .lineno:target a {

--- a/kallithea/templates/changeset/changeset_file_comment.html	Sun Jun 25 18:49:21 2017 +0200
+++ b/kallithea/templates/changeset/changeset_file_comment.html	Tue Sep 20 22:01:48 2016 +0200
@@ -6,12 +6,12 @@
 <%def name="comment_block(co)">
   <div class="comment" id="comment-${co.comment_id}">
     <div class="comment-prev-next-links"></div>
-    <div class="comment-wrapp">
-      <div class="meta">
+    <div class="panel panel-default">
+      <div class="panel-heading">
           ${h.gravatar_div(co.author.email, size=20)}
-          <div class="user">
+          <span class="user">
               ${co.author.full_name_and_username}
-          </div>
+          </span>
 
           <span>
               ${h.age(co.modified_at)}
@@ -26,11 +26,11 @@
 
           %if co.author_id == request.authuser.user_id or h.HasRepoPermissionLevel('admin')(c.repo_name):
             %if co.deletable():
-              <div onClick="confirm('${_('Delete comment?')}') && deleteComment(${co.comment_id})" class="buttons delete-comment btn btn-default btn-xs">${_('Delete')}</div>
+              <div onClick="confirm('${_('Delete comment?')}') && deleteComment(${co.comment_id})" class="pull-right buttons delete-comment btn btn-default btn-xs">${_('Delete')}</div>
             %endif
           %endif
       </div>
-      <div class="text">
+      <div class="panel-body">
         %if co.status_change:
            <div class="automatic-comment">
              <p>