clean up code blocks css

Author: leebyron

site/_css/graphql.less

@@ -673,6 +673,37 @@ p + .apiIndex {
   margin-bottom: 0;
 }
 
+.apiIndex pre {
+  .code-font();
+  text-shadow: 0 1px white;
+  direction: ltr;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+
+  -moz-tab-size: 2;
+  -o-tab-size: 2;
+  tab-size: 2;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+
+  white-space: pre-wrap;
+}
+
+.apiIndex li {
+  font-size: 13px;
+  line-height: 17px;
+  padding: 7px 14px;
+  background: white;
+  box-shadow: inset 0 0 0 1px #EEE, inset 4px 0 0 #EEE;
+  border-radius: 3px;
+  margin-left: -4px;
+}
+
 @media screen and (max-width: 1020px) {
   .nav-main {
     position: static;
@@ -711,11 +742,6 @@ p + .apiIndex {
   .hero {
     padding: 10px 0 30px 0;
   }
-  .prism {
-    padding: 4px 8px;
-    margin-left: -12px;
-    font-size: 11px;
-  }
   .nav-docs .nav-docs-section {
     border: none;
     padding: 0;

site/_css/prism.less

@@ -1,15 +1,24 @@
 @import "variables.less";
 
-/* http://prismjs.com/download.html?themes=prism&languages=markup+clike+javascript+jsx */
-/**
- * prism.js default theme for JavaScript, CSS and HTML
- * Based on dabblet (http://dabblet.com)
- * @author Lea Verou
- */
-
-code[class*="language-"],
-pre[class*="language-"],
-.apiIndex pre {
+.prism {
+  position: relative;
+
+  @media screen and (max-width: 1020px) {
+    padding: 4px 8px;
+    margin-left: -12px;
+    font-size: 11px;
+  }
+
+  @media print {
+    text-shadow: none;
+  }
+}
+
+.prism + .prism {
+  margin-top: -15px;
+}
+
+.prism {
   .code-font();
   text-shadow: 0 1px white;
   direction: ltr;
@@ -26,45 +35,40 @@ pre[class*="language-"],
   -moz-hyphens: none;
   -ms-hyphens: none;
   hyphens: none;
-}
 
-pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
-code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
-  text-shadow: none;
-  background: #b3d4fc;
-}
+  white-space: pre-wrap;
 
-pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
-code[class*="language-"]::selection, code[class*="language-"] ::selection {
-  text-shadow: none;
-  background: #b3d4fc;
-}
+  font-size: 13px;
+  line-height: 17px;
+  background: white;
+  box-shadow: inset 0 0 0 1px #EEE, inset 4px 0 0 #EEE;
+  border-radius: 3px;
 
-@media print {
-  code[class*="language-"],
-  pre[class*="language-"] {
+  .line-highlight {
+    background-color: rgba(229, 53, 171, 0.15);
+    left: 0;
+    line-height: inherit;
+    margin-top: 5px;
+    pointer-events: none;
+    position: absolute;
+    right: 0;
+  }
+
+  ::-moz-selection, ::selection {
     text-shadow: none;
+    background: #b3d4fc;
   }
 }
 
-/* Code blocks */
-pre[class*="language-"] {
-  padding: 1em;
-  margin: .5em 0;
+// Code blocks
+pre.prism {
+  padding: 7px 14px;
+  margin-left: -4px;
+  margin-bottom: 10px;
   overflow: auto;
 }
 
-:not(pre) > code[class*="language-"],
-pre[class*="language-"] {
-  background: #f5f2f0;
-}
-
-/* Inline code */
-:not(pre) > code[class*="language-"] {
-  padding: .1em;
-  border-radius: .3em;
-}
-
+// Colors
 .token.comment,
 .token.prolog,
 .token.doctype,
@@ -135,49 +139,3 @@ pre[class*="language-"] {
 .token.entity {
   cursor: help;
 }
-
-/* Custom prism rules for the GraphQL docs */
-
-code[class*="language-"],
-pre[class*="language-"] {
-  margin-bottom: 10px;
-}
-code[class*="language-"],
-pre[class*="language-"],
-.apiIndex pre {
-  .code-font();
-  white-space: pre-wrap;
-}
-
-code[class*="language-"],
-pre[class*="language-"],
-.apiIndex li {
-  font-size: 13px;
-  line-height: 17px;
-  padding: 7px 14px;
-  background: white;
-  box-shadow: inset 0 0 0 1px #EEE, inset 4px 0 0 #EEE;
-  border-radius: 3px;
-  margin-left: -4px;
-}
-
-.prism + .prism {
-  margin-top: -15px;
-}
-
-/* Line highlighting */
-
-.prism {
-  position: relative;
-}
-
-.line-highlight {
-  background-color: rgba(229, 53, 171, 0.15);
-  left: 0;
-  line-height: inherit;
-  margin-top: 5px;
-  pointer-events: none;
-  position: absolute;
-  right: 0;
-}
-