Blockquote styles

examples/article.html

@@ -42,17 +42,6 @@
 <distill-header></distill-header>
 <d-abstract>
   <figure style="grid-column: page; margin: 1rem 0;"><img src="momentum.png" style="width:100%; border: 1px solid rgba(0, 0, 0, 0.2);"/></figure>
-  <div style="grid-column: page;">
-    <d-slider style="grid-column: page;" step="1" min="1" max="6" ticks></d-slider>
-    <input type="range" class="og-slider" />
-  </div>
-  <d-slider style="grid-column: page;" step="1" min="1" max="6"></d-slider>
-  <d-slider style="width: 100px;"></d-slider>
-  <input type="range" />
-  <script>
-    document.querySelector("d-slider").addEventListener("input", e => { console.log("input", e.target.value); });
-    document.querySelector("d-slider").addEventListener("change", e => { console.log("change", e.target.value); });
-  </script>
   <p>We often think of Momentum as a means of dampening oscillations and speeding up the iterations, leading to faster convergence. But it has other interesting behavior. It allows a larger range of step-sizes to be used, and creates its own oscillations. What is going on?</p>
 </d-abstract>
 <d-article>

src/styles/d-article.css

@@ -95,13 +95,23 @@ d-article a {
 
 d-article p,
 d-article ul,
-d-article ol {
-  /*font-family: georgia, serif;*/
+d-article ol,
+d-article blockquote {
+  font-family: georgia, serif;
   margin-top: 0;
+  margin-left: 0;
+  margin-right: 0;
   margin-bottom: 1.7em;
   -webkit-font-smoothing: antialiased;
 }
 
+d-article blockquote {
+  border-left: 2px solid rgba(0, 0, 0, 0.2);
+  padding-left: 2em;
+  font-style: italic;
+  color: rgba(0, 0, 0, 0.6);
+}
+
 d-article a {
   border-bottom: 1px solid rgba(0, 0, 0, 0.4);
   text-decoration: none;

src/styles/d-byline.css

@@ -4,6 +4,7 @@ d-byline {
   font-size: 0.7rem;
   line-height: 1.8em;
   padding: 1.5rem 0;
+  min-height: 1.8em;
 }
 
 d-byline .byline {