bg color

components/appendix.js

@@ -7,7 +7,7 @@ const html = `
     margin-bottom: 0;
     border-top: 1px solid rgba(0,0,0,0.1);
     color: rgba(0,0,0,0.5);
-    background: rgba(0,0,0,0.025);
+    background: rgb(250, 250, 250);
     padding-top: 36px;
     padding-right: 24px;
     padding-bottom: 60px;

components/hover-box.txt

@@ -32,9 +32,10 @@ function DistillHoverBox(key, pos){
                           max-width: ${width}px;
                           top: ${top}px;
                           left: ${left}px;
+                          border: 1px solid rgba(0, 0, 0, 0.25);
                           padding: ${padding}px;
                           border-radius: ${pretty? 3 : 0}px;
-                          box-shadow: 0px 0px 18px 3px #777;
+                          box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.2);
                           z-index: ${1e6}" >
               ${DistillHoverBox.contentMap[key]}
               </div>`;

components/styles-article.css

@@ -1,9 +1,10 @@
 dt-article {
   display: block;
   color: rgba(0, 0, 0, 0.8);
-  font: 15px/1.55em -apple-system, BlinkMacSystemFont, "Roboto", sans-serif;
-  margin-bottom: 72px;
+  font: 16px/1.55em -apple-system, BlinkMacSystemFont, "Roboto", sans-serif;
+  padding-bottom: 72px;
   overflow: hidden;
+  background: white;
 }
 
 @media(min-width: 1024px) {
@@ -15,13 +16,17 @@ dt-article {
 /* H1 */
 
 dt-article h1 {
-  margin-top: 48px;
+  margin-top: 24px;
   font-weight: 400;
   font-size: 36px;
   line-height: 1.1em;
   font-family: Cochin, Georgia, serif;
 }
-
+@media(min-width: 768px) {
+  dt-article h1 {
+    margin-top: 48px;
+  }
+}
 
 @media(min-width: 1080px) {
   dt-article.centered h1 {
@@ -124,6 +129,7 @@ dt-article p {
   margin-bottom: 24px;
   -webkit-font-smoothing: antialiased;
   font-family: Georgia, serif;
+  font-family: 16px;
 }
 
 dt-article p a {

components/styles-base.css

@@ -1,16 +1,13 @@
 html {
   font: 400 15px/1.55em -apple-system, BlinkMacSystemFont, "Roboto", Helvetica, sans-serif;
   background-color: hsl(223, 9%, 25%);
-}
-
-html {
   -ms-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
   text-size-adjust: 100%;
 }
 body {
   margin: 0;
-  background: white;
+  background-color: hsl(223, 9%, 25%);
 }
 
 a {