1 files changed, 71 insertions, 19 deletions

diff --git a/haunt/static/css/style.css b/haunt/static/css/style.css
index 4b682d2..b48108b 100644
--- a/haunt/static/css/style.css
+++ b/haunt/static/css/style.css
@@ -1,3 +1,5 @@
+[hidden] { display: none !important; }
+
 html {
     font-family: "Cantarell", sans-serif;
 }
@@ -159,78 +161,128 @@ figure > figcaption {
     display: inline;
 }
 
-/* Webmention. */
+/* Comments & Webmention. */
+
+#webmention p .author-name {
+    margin: 4px;
+}
+
 
 #webmention {
     border-top: 2px solid #d2d6dd;
 }
 
-ul#webmention-container {
+ul.webmention-container {
     list-style-type: none;
 }
 
-ul#webmention-container li {
+ul.webmention-container > li {
     border: 2px solid #d2d6dd;
     border-bottom: none;
 }
 
-ul#webmention-container li:last-child {
+ul.webmention-container > li:last-child {
     border-bottom: 2px solid #d2d6dd;
 }
 
-ul#webmention-container li.comment {
-    padding: 1.5rem;
+ul.webmention-container > li.comment {
+    padding: 0.5rem;
 }
 
-ul#webmention-container li.comment img.u-photo {
+ul.webmention-container > li.comment img.u-photo {
     width: 4rem;
     padding: 0 1rem 1rem 0;
     float: left;
+    clear: both;
+    height: 100%;
 }
 
-ul#webmention-container li.interaction {
+ul.webmention-container > li.interaction {
     padding: 4px;
 }
 
-ul#webmention-container li.interaction img.u-photo {
+ul.webmention-container > li.interaction img.u-photo {
     max-width: 16px;
     margin-right: 8px;
     float: left;
+    clear: both;
 }
 
-ul#webmention-container div.p-author * {
-    padding-right: 1rem;
+ul.webmention-container ul.comment-reactions {
+    margin-top: 8px;
+}
+
+ul.webmention-container ul.comment-reactions li {
+    border-radius: 4px;
+    border: 1px solid #d2d6dd;
+    display: inline;
+    list-style-type: none;
+    padding: 4px;
 }
 
 /* Webmention (or comment) source indicator. */
 
-ul#webmention-container .comment-source-webmention {
+ul.webmention-container .comment {
     position: relative;
 }
 
-ul#webmention-container .comment-source-webmention .comment-source-identifier {
+ul.webmention-container .comment .comment-source-identifier {
     position: absolute;
-    top: 0;
-    right: 0;
+    top: 4px;
+    right: 4px;
     max-width: 16px;
 }
 
 /* Webmention form. */
 
-form {
+#webmention-form form {
     border-top: 2px solid #d2d6dd;
     padding-top: 1rem;
 }
 
-form input {
+#webmention-form form input {
     margin-top: 1rem;
 }
 
-form input[type=url] {
+#webmention-form form input[type=url] {
     display: block;
     width: 100%;
 }
 
+/* Comment form. */
+
+#comment-form #commenter-info label,
+#comment-form #comment-content label {
+    display: block;
+    width: 20em;
+    float: left;
+    clear: left;
+}
+
+#comment-form #captcha-trigger-block label {
+    display: block;
+}
+
+#comment-form label,
+#comment-form input,
+#comment-form button {
+    margin-top: 1em;
+}
+
+#comment-form #commenter-info input,
+#comment-form #comment-content input {
+    width: 20em;
+    float: left;
+}
+
+#comment-form #comment-captcha input {
+    display: block;
+}
+
+#comment-form img {
+    max-width: 100%;
+}
+
 /* Source code. */
 
 pre {
@@ -298,7 +350,7 @@ tr:nth-child(even) {
 
 /* Buttons. */
 
-button {
+.lang button {
     display: inline;
     padding: .3em .6em .3em;
     font-size: 75%;