Theme Preferences for Distilled Pages

components/dom_distiller/core/css/distilledpage.css

Index: components/dom_distiller/core/css/distilledpage.css
diff --git a/components/dom_distiller/core/css/distilledpage.css b/components/dom_distiller/core/css/distilledpage.css
index 211708b9e762d39f39e0d823f9f8ee7ce17ea6ae..f5c15266b84a94d7bbbe86ecfce9f66d48c345bc 100644
--- a/components/dom_distiller/core/css/distilledpage.css
+++ b/components/dom_distiller/core/css/distilledpage.css
@@ -75,7 +75,6 @@ th {
 
 body,
 html {
-  color: #333;
   font-family: 'Open Sans', sans-serif;
   font-size: 14px;
   line-height: 1.4;
@@ -83,6 +82,23 @@ html {
   overflow-x: hidden;
 }
 
+/* Classes for light, dark and sepia themes.
+ * Must agree with classes returned by GetJsTheme(theme) in viewer.cc */

[nyquist, 2014/07/07 19:12:48]

I think you want to refer to the JavaScript here.

[smaslo, 2014/07/08 19:58:10]

Done.

+.light {
+  color: #333;
+  background-color: #FFF;
+}
+
+.dark {
+  color: #FFF;

[nyquist, 2014/07/07 19:12:48]

This is very hard to read for <code><pre> blocks.

[smaslo, 2014/07/08 19:58:10]

Done.

+  background-color: #000;
+}
+
+.sepia {
+  color: #000;
+  background-color: rgb(203, 173, 141);
+}
+
 /* Define vertical rhythm (baseline grid of 4px). */
 
 blockquote,
@@ -133,10 +149,21 @@ h6 {
   margin: 1.296rem 1.296rem auto;
 }
 
-a {
+/* Link colors for light, dark and sepia themes */
+
+.light a:link,
+.sepia a:link {
   color: #222;

[nyquist, 2014/07/07 19:12:48]

This looks almost indistinguishable from the color of the text itself, which
might make normal underlines in the document be hard to separate from links.

[smaslo, 2014/07/08 19:58:10]

Done.

 }
 
+.dark a:link {
+  color: #3838FF;

[nyquist, 2014/07/07 19:12:48]

This color was hard to read for me.

[smaslo, 2014/07/08 19:58:10]

Done.

+}
+
+a:visited {
+  color: #551A8B;

[nyquist, 2014/07/07 19:12:48]

This is hard to read on the dark background.

[smaslo, 2014/07/08 19:58:10]

Done.

+}
+
 blockquote {
   border-left: 4px solid #eee;
   padding-left: 1em;