Code tag markdown

static/cranefly/css/cranefly.css

@@ -938,6 +938,8 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .markdown blockquote>:last-child{margin-bottom:0px;}
 .markdown blockquote p{margin:0 0 10px;font-size:11.9px;}
 .markdown blockquote blockquote{background-color:#ffffff;border:1px solid #f2f2f2;border-radius:3px;padding:14px;}
+.markdown code{background-color:#333333;border:none;color:#eeeeee;font-size:14px;}
+.markdown pre{background-color:#222222;}.markdown pre code{background:none;border:none;color:#eeeeee;font-size:11.9px;text-shadow:0px 1px 0px #000000;}
 .markdown img{border-radius:3px;box-shadow:0px 0px 4px #555555;}
 .markdown .md-img{overflow:auto;}.markdown .md-img .md-img-span{margin:0px auto;float:none;}.markdown .md-img .md-img-span .md-img-wrap{background-color:#222222;border:1px solid #ffffff;border-radius:4px;box-shadow:0px 0px 2px #999999;margin:3px;}.markdown .md-img .md-img-span .md-img-wrap .md-img-bg{background-color:#ffffff;border-radius:3px;text-align:center;}.markdown .md-img .md-img-span .md-img-wrap .md-img-bg img{border-radius:3px;box-shadow:none;}
 .markdown .md-img .md-img-span .md-img-wrap .md-img-bg .md-img-error{background:url('../img/img_broken.jpg');border-radius:3px;padding:50px 0px;}.markdown .md-img .md-img-span .md-img-wrap .md-img-bg .md-img-error span{background-color:#333333;border-radius:5px;opacity:0.8;filter:alpha(opacity=80);padding:7px 14px;margin:0px auto;color:#ffffff;text-shadow:0px 1px 0px #000000;}
@@ -1060,7 +1062,8 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .thread-body .post-wrapper .post-body .post-content .post-header .post-perma{display:block;float:right;padding-left:6px;color:#999999;font-weight:bold;}.thread-body .post-wrapper .post-body .post-content .post-header .post-perma:hover,.thread-body .post-wrapper .post-body .post-content .post-header .post-perma:active{color:#333333;}
 .thread-body .post-wrapper .post-body .post-content .post-header .post-checkbox{float:right;position:relative;left:10px;}
 .thread-body .post-wrapper .post-body .post-content .post-header .post-extra{float:right;}.thread-body .post-wrapper .post-body .post-content .post-header .post-extra .label{margin-left:3.5px;text-shadow:none;}.thread-body .post-wrapper .post-body .post-content .post-header .post-extra .label.label-purple{background-color:#7e2ecf;}
-.thread-body .post-wrapper .post-body .post-content .post-message{padding:14px;}.thread-body .post-wrapper .post-body .post-content .post-message .post-signature{border-top:1px dotted #bfbfbf;opacity:0.6;filter:alpha(opacity=60);margin-top:20px;padding-top:5px;font-size:80%;}
+.thread-body .post-wrapper .post-body .post-content .post-message .markdown{padding:14px;}
+.thread-body .post-wrapper .post-body .post-content .post-message .post-signature{border-top:1px dotted #bfbfbf;opacity:0.6;filter:alpha(opacity=60);margin:0px 14px;font-size:80%;}.thread-body .post-wrapper .post-body .post-content .post-message .post-signature .markdown{padding:0px;padding-top:5px;padding-bottom:14px;}
 .thread-body .post-wrapper .post-body .post-content .post-footer{border-top:1px solid #e7e7e7;overflow:auto;}.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating{float:left;overflow:auto;padding:7px 14px;border-right:1px dotted #e7e7e7;}.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating a{color:#999999;}.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating a:hover,.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating a a:active{color:#333333;}
 .thread-body .post-wrapper .post-body .post-content .post-footer .post-rating span{float:left;}.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating span.post-score{color:#999999;font-weight:bold;}.thread-body .post-wrapper .post-body .post-content .post-footer .post-rating span.post-score.post-score-good{color:#46a546;}
 .thread-body .post-wrapper .post-body .post-content .post-footer .post-rating span.post-score.post-score-bad{color:#cf402e;}

static/cranefly/css/cranefly/markdown.less

@@ -70,6 +70,27 @@
     }
   }
 
+  code {
+    background-color: @grayDark;
+    border: none;
+
+    color: @grayLighter;
+    font-size: @baseFontSize;
+  }
+
+  pre {
+    background-color: @grayDarker;
+
+    code {
+      background: none;
+      border: none;
+
+      color: @grayLighter;
+      font-size: @fontSizeSmall;
+      text-shadow: 0px 1px 0px @black;
+    }
+  }
+
   img {
     border-radius: @baseBorderRadius;
     box-shadow: 0px 0px 4px @gray;

static/cranefly/css/cranefly/thread.less

@@ -104,15 +104,22 @@
         }
 
         .post-message {
-          padding: @baseFontSize;
+          .markdown {
+            padding: @baseFontSize;
+          }
 
           .post-signature {
             border-top: 1px dotted darken(@postBackground, 25%);
             .opacity(60);
-            margin-top: @baseLineHeight;
-            padding-top: @baseLineHeight / 4;
+            margin: 0px @baseFontSize;
 
             font-size: 80%;
+
+            .markdown {
+              padding: 0px;
+              padding-top: @baseLineHeight / 4;
+              padding-bottom: @baseFontSize;
+            }
           }
         }
 
@@ -305,58 +312,58 @@
     }
   }
 
-    .post-checkpoints {
-      .post-checkpoint {
-        text-align: center;
-
-        margin-bottom: @baseLineHeight;
-
-        hr {
-          background-color: @grayLight;
-          background-image: -webkit-gradient(linear, 0 0, 100% 100%,
-                      color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent),
-                      color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)),
-                      color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent),
-                      to(transparent));
-          background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
-                    transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
-                    transparent 75%, transparent);
-          background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
-                    transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
-                    transparent 75%, transparent);
-          background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
-                    transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
-                    transparent 75%, transparent);
-          background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
-                    transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
-                    transparent 75%, transparent);
-          background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
-                    transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
-                    transparent 75%, transparent);
-          -webkit-background-size: 10px 10px;
-          -moz-background-size: 10px 10px;
-          background-size: 10px 10px;
-          border: none;
-          height: 4px;
-          margin-bottom: (@baseLineHeight * -1) + (@baseFontSize / 2) + 1px;
-        }
+  .post-checkpoints {
+    .post-checkpoint {
+      text-align: center;
+
+      margin-bottom: @baseLineHeight;
 
-        span {
-          background-color: @bodyBackground;
-          padding: 0px @baseFontSize;
+      hr {
+        background-color: @grayLight;
+        background-image: -webkit-gradient(linear, 0 0, 100% 100%,
+                    color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent),
+                    color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)),
+                    color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent),
+                    to(transparent));
+        background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
+                  transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
+                  transparent 75%, transparent);
+        background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
+                  transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
+                  transparent 75%, transparent);
+        background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
+                  transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
+                  transparent 75%, transparent);
+        background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
+                  transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
+                  transparent 75%, transparent);
+        background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
+                  transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
+                  transparent 75%, transparent);
+        -webkit-background-size: 10px 10px;
+        -moz-background-size: 10px 10px;
+        background-size: 10px 10px;
+        border: none;
+        height: 4px;
+        margin-bottom: (@baseLineHeight * -1) + (@baseFontSize / 2) + 1px;
+      }
 
-          color: @grayLight;
+      span {
+        background-color: @bodyBackground;
+        padding: 0px @baseFontSize;
 
-          a {
-            color: @textColor;
-          }
+        color: @grayLight;
 
-          i {
-            .opacity(43);
-          }
+        a {
+          color: @textColor;
+        }
+
+        i {
+          .opacity(43);
         }
       }
     }
+  }
 }
 
 // Thread moderation