resolves #338 rescale color palette to use darker shades of gray (#347)

This commit also removes Kindle-specific color adjustments so minor color changes are expected on Kindle

4 files changed, 42 insertions, 89 deletions

diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc
index 645a63f..d9baee8 100644
--- a/CHANGELOG.adoc
+++ b/CHANGELOG.adoc
@@ -13,6 +13,7 @@ For a detailed view of what has changed, refer to the {uri-repo}/commits/master[
 * store syntax highlighter CSS in a separate file (#339)
 * initial landmarks support: appendix, bibliography, bodymatter, cover, frontmatter, glossary, index, preface, toc (#174)
 * add support for MathML (#10)
+* rescale color palette to use darker shades of gray (#338)
 
 == 1.5.0.alpha.17 (2020-05-25) - @slonopotamus
 
diff --git a/data/styles/color-palette.css b/data/styles/color-palette.css
index e8796da..90b917f 100644
--- a/data/styles/color-palette.css
+++ b/data/styles/color-palette.css
@@ -1,14 +1,11 @@
 .palette-grayscale {
-  color: #191918; /* black :: literal, blockquote text */
-  color: #333332; /* off-black :: body text, heading default, chapter header background */
-  color: #4F4F4C; /* deep gray :: h4 */
-  /* what about 40403E or 4C4C4B? for h4 */
-  color: #666665; /* dark gray :: h5, visited link, list bullets, abstract, caption, open quote */
-  color: #80807F; /* medium gray :: table borders */
-  color: #B3B3B1; /* gray :: chapter title, footer subtitle, sidebar border */
-  color: #DCDCDE; /* lighter gray :: footer lines, byline text, pre border, masthead bottom line */
-  /* what about DEDEDC instead of DCDCDE? */
-  color: #F2F2F2; /* off white :: pre background, sidebar background */
+  color: #000000; /* black :: body text, heading default */
+  color: #101010; /* off-black :: code, literal, blockquote text */
+  color: #202020; /* deep gray :: h4 */
+  color: #333332; /* dark gray :: h5, visited link, list bullets, abstract, caption, open quote */
+  color: #707070; /* medium gray :: table borders */
+  color: #C8C8C8; /* gray :: footer subtitle, sidebar border */
+  color: #E0E0E0; /* off white :: pre background, sidebar background */
   color: #FFFFFF; /* white :: chapter subtitle */
 }
 
diff --git a/data/styles/epub3-css3-only.css b/data/styles/epub3-css3-only.css
index 294219f..ab636b9 100644
--- a/data/styles/epub3-css3-only.css
+++ b/data/styles/epub3-css3-only.css
@@ -83,39 +83,6 @@ body code, body kbd, body pre, pre :not(code) {
   }
 }
 
-/* Use darker font colors on Kindle Paperwhite and Oasis */
-@media amzn-kf8 and (device-height: 1024px) and (device-width: 758px), amzn-kf8 and (device-height: 758px) and (device-width: 1024px), amzn-kf8 and (device-height: 1680px) and (device-width: 1264px), amzn-kf8 and (device-height: 1264px) and (device-width: 1680px) {
-  body p,
-  div.abstract > p,
-  ul, ol, li, dl, dt, dd, footer,
-  div.verse .attribution, table.table th, table.table td,
-  figcaption, caption,
-  h1, h2, h3, h4, h5 {
-    color: #000000;
-  }
-
-  body a:link,
-  div.abstract > p a:link {
-    color: #000000;
-    -webkit-text-fill-color: #000000;
-  }
-
-  body a:visited {
-    color: #333332;
-    -webkit-text-fill-color: #333332;
-  }
-
-  .chapter-header {
-    color: #191918;
-    border-bottom-color: #191918;
-  }
-
-  h1.chapter-title .subtitle,
-  .chapter-header p.byline {
-    color: #000000;
-  }
-}
-
 .chapter-header p.byline {
   height: auto; /* Aldiko requires this value to be 0; reset it for all others */
 }
diff --git a/data/styles/epub3.css b/data/styles/epub3.css
index 42ccbe3..8cea0d8 100644
--- a/data/styles/epub3.css
+++ b/data/styles/epub3.css
@@ -81,8 +81,8 @@ b, strong {
 
 b.button {
   font-weight: normal;
-  text-shadow: 1px 0 0 #666665;
-  color: #191918;
+  text-shadow: 1px 0 0 #333332;
+  color: #101010;
   white-space: nowrap;
 }
 
@@ -143,7 +143,7 @@ img {
 
 mark {
   background-color: #FFC14F;
-  color: #191918;
+  color: #101010;
 }
 
 small {
@@ -224,13 +224,10 @@ th.valign-middle, td.valign-middle, th.valign-middle > p, td.valign-middle > p {
 }
 
 body a:link {
-  color: #333332;
-  /* hack for font color in iBooks and Gitden (though Gitden would accept color !important too) */
-  -webkit-text-fill-color: #333332;
   /* Kindle requires the !important on text-decoration */
   /* In night mode, the only indicator of a link is the underline, so we need it or a background image */
   text-decoration: none !important;
-  border-bottom: 1px dashed #666665;
+  border-bottom: 1px dashed #333332;
   /* allow URLs to break anywhere if they don't fit on a line; but how do we know it's a URL? */
   /*
   word-break: break-all;
@@ -247,9 +244,9 @@ body:first-of-type a:link {
 }
 
 body a:visited {
-  color: #666665;
+  color: #333332;
   /* hack for font color in iBooks */
-  -webkit-text-fill-color: #666665;
+  -webkit-text-fill-color: #333332;
 }
 
 code.literal {
@@ -295,7 +292,6 @@ body p,
 ul, ol, li, dl, dt, dd, footer,
 div.verse .attribution, table.table th, table.table td,
 figcaption, caption {
-  color: #333332;
   /* NOTE iBooks will forcefully override font-family of text inside div, p and span elements when font other than Original is selected */
   /* NOTE iBooks honors Original font for prose text if declared in display-options.xml */
   font-family: "Noto Serif", serif;
@@ -306,7 +302,7 @@ body p, li, dt, dd, footer {
 }
 
 code, kbd, pre {
-  color: #191918;
+  color: #101010;
   font-family: "M+ 1mn", monospace;
   -webkit-hyphens: none; /* disable hyphenation where supported (e.g., iBooks) */
 }
@@ -487,7 +483,7 @@ ul > li::before {
 
 ul > li::before {
   content: "\25AA"; /* small black square */
-  color: #666665;
+  color: #333332;
 }
 
 ul ul > li::before {
@@ -497,7 +493,7 @@ ul ul > li::before {
 
 ul ul ul > li::before {
   content: "\2022"; /* small black circle */
-  color: #666665;
+  color: #333332;
 }
 
 ul ul ul ul > li::before {
@@ -559,7 +555,6 @@ ul.references > li > span.principal {
 
 /* sized based on the major third modular scale (4:5, 16px, 24px) */
 h1, h2 {
-  color: #333332;
   font-size: 1.5em;
   word-spacing: -0.075em;
   margin-top: 1em; /* 1.5rem */
@@ -567,14 +562,13 @@ h1, h2 {
 }
 
 h3 {
-  color: #333332;
   font-size: 1.25em;
   margin-top: 0.84em; /* 1.05rem */
   margin-bottom: -0.5em; /* -0.625rem, 0.375rem to content */
 }
 
 h4 {
-  color: #4F4F4C;
+  color: #202020;
   font-weight: 200;
 
   font-size: 1.1em;
@@ -589,7 +583,7 @@ h4 {
 }
 
 h5 {
-  color: #666665;
+  color: #333332;
   /*
   font-size: 1em;
   text-transform: uppercase;
@@ -619,7 +613,7 @@ h5 code {
   /*padding: 0.75em 1.5em 0.25em 1.5em;*/
   padding: 0.25em 0;
   margin-bottom: 2.5em;
-  border-bottom: 1px solid #666665;
+  border-bottom: 1px solid #333332;
   /* TODO maybe what we need to get articles to start in left column
   -webkit-column-break-before: left;
   page-break-before: left;
@@ -632,7 +626,7 @@ h1.chapter-title {
   margin-top: 3.5em; /* 4.2rem - would like to use 9vh */
   margin-bottom: 0;
   padding-bottom: 0.8333em; /* 1.2rem */
-  color: #666665;
+  color: #333332;
   text-transform: uppercase; /* not supported in Adobe Digital Editions */
   word-spacing: -0.075em;
   letter-spacing: -0.01em;
@@ -640,7 +634,6 @@ h1.chapter-title {
 
 h1.chapter-title .subtitle {
   font-weight: 400;
-  color: #333332;
   display: block;
   font-size: 1.5em;
   margin: 0 0 0 0.75em; /* would like to use 2vw */
@@ -657,7 +650,6 @@ h1.chapter-title b {
 }
 
 .chapter-header p.byline {
-  color: #333332;
   /* float left and height 0 takes this line out of the flow */
   float: left;
   height: 0;
@@ -688,15 +680,15 @@ div.abstract {
 }
 
 div.abstract > p {
-  color: #666665;
+  color: #333332;
   font-size: 1.05em; /* or 1.1em? */
   line-height: 1.75;
 }
 
 div.abstract > p a:link {
-  color: #666665;
+  color: #333332;
   /* hack for font color in iBooks */
-  -webkit-text-fill-color: #666665;
+  -webkit-text-fill-color: #333332;
 }
 
 div.abstract > p:first-child::first-line {
@@ -773,7 +765,7 @@ figcaption,
 caption {
   font-size: 0.9em;
   font-style: italic;
-  color: #666665;
+  color: #333332;
   letter-spacing: -0.01em;
   line-height: 1.4;
   text-align: left;
@@ -805,10 +797,10 @@ figure.listing > figcaption + pre {
 }
 
 aside.sidebar {
-  border: 1px solid #B3B3B1;
+  border: 1px solid #C8C8C8;
   padding: 0 1.5em;
   font-size: 0.9em;
-  background-color: #F2F2F2;
+  background-color: #E0E0E0;
   text-align: right; /* aligns heading to right */
   /*
   -webkit-box-shadow: 0px 1px 1px rgba(102, 102, 101, 0.15);
@@ -836,7 +828,7 @@ aside.sidebar > h2 {
   letter-spacing: 0;
   display: inline-block;
   white-space: nowrap; /* for some reason it's wrapping prematurely */
-  border: 1px solid #B3B3B1;
+  border: 1px solid #C8C8C8;
   padding: 1.5em .75em .5em .75em;
   margin: -1em 0.5em -0.25em 0.5em;
   background-color: #FFFFFF;
@@ -873,7 +865,7 @@ div[class~="blockquote"] {
 }
 
 blockquote > p {
-  color: #191918;
+  color: #101010;
   font-style: italic;
 
   /*
@@ -890,7 +882,7 @@ blockquote > p {
 
 blockquote > p:first-of-type::before {
   display: inline-block;
-  color: #666665;
+  color: #333332;
   text-shadow: 0 1px 2px rgba(102, 102, 101, 0.3);
 
   /* using serif quote from entypo */
@@ -923,7 +915,7 @@ blockquote footer {
 blockquote footer .context {
   font-size: 0.9em;
   letter-spacing: -0.05em;
-  color: #666665;
+  color: #333332;
 }
 
 pre {
@@ -934,14 +926,10 @@ pre {
   overflow-wrap: break-word; /* break in middle of long word if no other break opportunities are available */
   font-size: 0.85em;
   line-height: 1.4; /* matches what Kindle uses and can't go less */
-  background-color: #F2F2F2;
+  background-color: #E0E0E0;
   padding: 0.6em 0.9em; /* this is supposed to be '0.5rem 0.75rem' but Sony Readers crash when see that (at least, PRS-350, PRS-505, PRS-T1) */
-  /*
-  border-top: 3px solid #DCDCDE;
-  */
-  /* QUESTION #B3B3B1? */
-  border-top: 1px solid #DCDCDE;
-  border-right: 1px solid #DCDCDE;
+  border-top: 1px solid #C8C8C8;
+  border-right: 1px solid #C8C8C8;
 }
 
 body:first-of-type pre {
@@ -1143,7 +1131,7 @@ table.table th {
 }
 
 table.table thead th {
-  border-bottom: 1px solid #80807F;
+  border-bottom: 1px solid #707070;
 }
 
 table.table td > p,
@@ -1160,26 +1148,26 @@ table.table div.embed > * + * {
 table.table-framed-all {
   border-width: 1px;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-framed-topbot {
   border-width: 1px 0;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-framed-sides {
   border-width: 0 1px;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-grid-all th,
 table.table-grid-all td {
   border-width: 1px 1px 1px 1px;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-grid-all thead tr > *:last-child {
@@ -1195,14 +1183,14 @@ table.table-grid-rows tbody th,
 table.table-grid-rows tbody td {
   border-width: 1px 0 0 0;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-grid-cols th,
 table.table-grid-cols td {
   border-width: 0 1px 0 0;
   border-style: solid;
-  border-color: #80807F;
+  border-color: #707070;
 }
 
 table.table-grid-cols thead th:last-child {
@@ -1233,7 +1221,7 @@ hr.pagebreak + * {
 
 img.headshot {
   float: left;
-  border: 1px solid #80807F;
+  border: 1px solid #707070;
   padding: 1px;
   margin: 0.35em 1em 0.15em 0;
   height: 5em !important;