add comments section and gradient backgrounds

css/default.css

@@ -23,7 +23,8 @@ body background: #ddeeff
 body {
     color: #222211;
     background-color: #99bbdd;
-    
+    background: linear-gradient(to top right, #99bbdd, #3366aa);
+
     font-size: 12px;
     margin: 0px 5px 0px 5px;
 }
@@ -72,6 +73,7 @@ div#footer {
 div#content {
     color: #222211;
     background-color: #ddeeff;
+    background: linear-gradient(to bottom left, #99bbdd, #ddeeff);
     padding: 20px;
     width: 80%;
 }
@@ -127,3 +129,28 @@ a:link {
 a:visited {
     color: #0066ee;
 }
+
+.comment-click {
+    border-top: solid 1px #335555;
+    padding-top: 5px;
+
+    position: relative;
+    color: #335555;
+    font-size: 12px;
+    display: inline;
+}
+
+.comment-click:before {
+    content: "Comment?";
+}
+
+.comment-click:focus .comment-clicked {
+    display: block;
+}
+
+.comment-clicked {
+    position: relative;
+    z-index: 1;
+    text-align: left;
+    display: none;
+}

templates/post.html

@@ -12,3 +12,13 @@
 </div>
 
 $body$
+
+<div tabindex="0" class="comment-click">
+  <div class="comment-clicked">
+    I'd love to have a conversation, but I'm not interested in having
+    a comments section. Instead, ping
+    me <a href="http://twitter.com/jmelesky">on twitter</a>
+    or <a href="/about.html">some other media</a>. I'll try to link to
+    responses from the relevant post page.
+  </div>
+</div>