make some markdown styles reusable

www/code/code.less

@@ -1,5 +1,6 @@
 @import "/customize/src/less/variables.less";
 @import "/customize/src/less/mixins.less";
+@import "/common/markdown.less";
 
 html, body{
     height: 100%;
@@ -66,15 +67,8 @@ body {
     max-width: 40vw;
     margin: auto;
 
-    table {
+    .markdown_preformatted-code;
-        border-collapse: collapse;
+    .markdown_gfm-table(black);
-        tr {
-            th {
-                border: 3px solid black;
-                padding: 15px;
-            }
-        }
-    }
 }
 
 @media (max-width: @media-medium-screen) {

www/common/markdown.less

@@ -0,0 +1,27 @@
+.markdown_preformatted-code (@color: #333) {
+    pre > code {
+        display: block;
+        position: relative;
+        border: 1px solid @color;
+        width: 90%;
+        margin: auto;
+        padding-left: .25vw;
+        overflow-x: auto;
+        overflow-y: hidden;
+    }
+}
+
+.markdown_gfm-table (@color: black) {
+    table {
+        border-collapse: collapse;
+        tr {
+            th {
+                border: 3px solid @color;
+                padding: 15px;
+            }
+        }
+    }
+}
+
+// todo ul, ol
+

www/slide/slide.less

@@ -1,5 +1,6 @@
 @import "/customize/src/less/variables.less";
 @import "/customize/src/less/mixins.less";
+@import "/common/markdown.less";
 
 // used for slides
 .viewportRatio (@x, @y, @p: 100) {
@@ -325,16 +326,7 @@ div#modal #content, #print {
             margin-bottom: 0.5em;
         }
 
-        pre > code {
+        .markdown_preformatted-code;
-            display: block;
-            position: relative;
-            border: 1px solid #333;
-            width: 90%;
-            margin: auto;
-            padding-left: .25vw;
-            overflow-x: auto;
-            overflow-y: hidden;
-        }
 
         ul, ol {
             min-width: 50%;