2.3.0

Trim whitespace

README.md

@@ -11,7 +11,7 @@ To contribute a change, [check out the contributing guide](CONTRIBUTING.md).
 
 ### Local Development
 
-Run `npm run start` to start a watching build rollup server. To view the sample pages in the repo, you can run `npm run serve` as a separate process which starts a static server. `npm run build` will run a one-time build.
+First, run `npm install` to install all node modules required. Then, run `npm run dev` to start a watching build rollup server. To view the sample pages in the repo, you can run `npm run serve` as a separate process which starts a static server. `npm run build` will run a one-time build.
 
 
 ## Disclaimer & License

examples/article.html

@@ -32,7 +32,7 @@
       {
         "author":"Chris Olah",
         "authorURL":"https://colah.github.io/",
-        "affiliations": [{"name": "Google Brain", "url": "https://g.co/brain"}]
+        "affiliations": [{"name": "Google Brain"}]
       },
       {
         "author":"Ludwig Schubert",

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "distill-template",
-  "version": "2.2.25",
+  "version": "2.3.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "distill-template",
-  "version": "2.2.25",
+  "version": "2.3.0",
   "description": "Template for creating Distill articles.",
   "main": "dist/template.v2.js",
   "bin": {

src/components/d-byline.js

@@ -24,11 +24,11 @@ export function bylineTemplate(frontMatter) {
         <p class="author">
           ${author.personalURL ? `
             <a class="name" href="${author.personalURL}">${author.name}</a>` : `
-            <div class="name">${author.name}</div>`}
+            <span class="name">${author.name}</span>`}
         </p>
         <p class="affiliation">
         ${author.affiliations.map(affiliation =>
-          affiliation.url ? `<a class="affiliation" href="${affiliation.url}">${affiliation.name}</a>` : `<div class="affiliation">${affiliation.name}</div>`
+          affiliation.url ? `<a class="affiliation" href="${affiliation.url}">${affiliation.name}</a>` : `<span class="affiliation">${affiliation.name}</span>`
         ).join(', ')}
         </p>
       `).join('')}

src/components/d-cite.js

@@ -102,7 +102,7 @@ export class Cite extends T(HTMLElement) {
 
   attributeChangedCallback(name, oldValue, newValue) {
     const eventName = oldValue ? 'onCiteKeyChanged' : 'onCiteKeyCreated';
-    const keys = newValue.split(',');
+    const keys = newValue.split(',').map(k => k.trim());
     const options = { detail: [this, keys], bubbles: true };
     const event = new CustomEvent(eventName, options);
     document.dispatchEvent(event);

src/components/d-front-matter.js

@@ -35,7 +35,7 @@ export function _moveLegacyAffiliationFormatIntoArray(frontMatter) {
 }
 
 export function parseFrontmatter(element) {
-  const scriptTag = element.querySelector('script');
+  const scriptTag = element.firstElementChild;
   if (scriptTag) {
     const type = scriptTag.getAttribute('type');
     if (type.split('/')[1] == 'json') {

src/front-matter.js

@@ -96,6 +96,7 @@ export function mergeFromYMLFrontmatter(target, source) {
   target.authors = source.authors.map( (authorObject) => new Author(authorObject));
   target.katex = source.katex;
   target.password = source.password;
+  target.doi = source.doi;
 }
 
 export class FrontMatter {

src/styles/d-article.css

@@ -227,7 +227,7 @@ d-figure {
 /* KaTeX */
 
 .katex, .katex-prerendered {
-  contain: content;
+  contain: style;
   display: inline-block;
 }
 

src/transforms/mathematics.js

@@ -17,20 +17,20 @@ import { renderMathInElement } from '../helpers/katex-auto-render';
 
 export default function(dom, data) {
   let needsCSS = false;
-  const article = dom.querySelector('d-article');
+  const body = dom.querySelector('body');
 
-  if (!article) {
-    console.warn("No d-article tag found!");
+  if (!body) {
+    console.warn("No body tag found!");
     return;
   }
 
   if (data.katex && data.katex.delimiters) {
     global.document = dom;
-    renderMathInElement(article, data.katex);
+    renderMathInElement(body, data.katex);
   }
 
   // render d-math tags
-  const mathTags = article.querySelectorAll('d-math');
+  const mathTags = body.querySelectorAll('d-math');
   if (mathTags.length > 0) {
     needsCSS = true;
     console.warn(`Prerendering ${mathTags.length} math tags...`);