tweaking prettify styles to introduce dark theme

1 files changed, 61 insertions, 7 deletions

diff --git a/docs/assets/js/google-code-prettify/prettify.css b/docs/assets/js/google-code-prettify/prettify.css
index da6b6e7e1..d82028f3d 100644
--- a/docs/assets/js/google-code-prettify/prettify.css
+++ b/docs/assets/js/google-code-prettify/prettify.css
@@ -6,18 +6,29 @@
 .kwd, .tag { color: #195f91; }
 .typ, .atn, .dec, .var { color: #CB4B16; }
 .pln { color: #93a1a1; }
-pre.prettyprint {
-  background: #fefbf3;
+.prettyprint {
+  background-color: #fefbf3;
   padding: 9px;
   border: 1px solid rgba(0,0,0,.2);
   -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.1);
-  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.1);
-  box-shadow: 0 1px 2px rgba(0,0,0,.1);
+     -moz-box-shadow: 0 1px 2px rgba(0,0,0,.1);
+          box-shadow: 0 1px 2px rgba(0,0,0,.1);
 }
 
 /* Specify class=linenums on a pre to get line numbering */
-ol.linenums { margin: 0 0 0 40px; } /* IE indents via margin-left */
-ol.linenums li { color: rgba(0,0,0,.15); line-height: 20px; }
+.linenums {
+  margin: 0 0 0 40px;
+}
+/* IE indents via margin-left */
+.linenums li {
+  margin-left: -5px;
+  padding: 0 5px;
+  color: rgba(0,0,0,.15);
+  line-height: 20px;
+  -webkit-border-radius: 2px;
+     -moz-border-radius: 2px;
+          border-radius: 2px;
+}
 /* Alternate shading for lines */
 li.L1, li.L3, li.L5, li.L7, li.L9 {  }
 
@@ -38,4 +49,47 @@ $violet:    #6c71c4;
 $blue:      #268bd2;
 $cyan:      #2aa198;
 $green:     #859900;
-*/
\ No newline at end of file
+*/
+
+
+/*
+#1d1f21 Background
+#282a2e Current Line
+#373b41 Selection
+#c5c8c6 Foreground
+#969896 Comment
+#cc6666 Red
+#de935f Orange
+#f0c674 Yellow
+#b5bd68 Green
+#8abeb7 Aqua
+#81a2be Blue
+#b294bb Purple
+*/
+
+
+/* DARK THEME */
+/* ---------- */
+
+.prettyprint-dark {
+  background-color: #1d1f21;
+  border: 0;
+  padding: 10px;
+}
+.prettyprint-dark .linenums li {
+  color: #444;
+}
+.prettyprint-dark .linenums li:hover {
+  background-color: #282a2e;
+}
+/* tags in html */
+.prettyprint-dark .kwd,
+.prettyprint-dark .tag { color: #cc6666; }
+/* html attr */
+.prettyprint-dark .typ,
+.prettyprint-dark .atn,
+.prettyprint-dark .dec,
+.prettyprint-dark .var { color: #de935f; }
+/* html attr values */
+.prettyprint-dark .str,
+.prettyprint-dark .atv { color: #b5bd68; }