Compare commits

...
8 Commits
8 changed files with 29 additions and 24 deletions
+4 -4
View File
@@ -1,8 +1,6 @@
# Distill Template # Distill Template
_Disclaimer: This project is research code. It is not an official Google product._ This is the repository for the Distill web framework.
This is the repository for the distill web framework.
## Contributing ## Contributing
@@ -16,7 +14,9 @@ To contribute a change, [check out the contributing guide](CONTRIBUTING.md).
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. 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.
## License ## Disclaimer & License
_This project is research code. It is not an official product of Google or any other institution supporting Distill._
Copyright 2018, The Distill Template Authors. Copyright 2018, The Distill Template Authors.
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "distill-template", "name": "distill-template",
"version": "2.2.19", "version": "2.2.25",
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "distill-template", "name": "distill-template",
"version": "2.2.22", "version": "2.2.25",
"description": "Template for creating Distill articles.", "description": "Template for creating Distill articles.",
"main": "dist/template.v2.js", "main": "dist/template.v2.js",
"bin": { "bin": {
+5 -6
View File
@@ -19,7 +19,7 @@ const T = Template('d-cite', `
<style> <style>
:host { :host {
display: inline-block;
} }
.citation { .citation {
@@ -48,10 +48,6 @@ figcaption .citation-number {
line-height: 1em; line-height: 1em;
} }
d-hover-box {
margin-top: 1.9em;
}
ul { ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
@@ -71,7 +67,10 @@ ul li:last-of-type {
<d-hover-box id="hover-box"></d-hover-box> <d-hover-box id="hover-box"></d-hover-box>
<div id="citation-" class="citation"><slot></slot><span class="citation-number"></span></div> <div id="citation-" class="citation">
<slot></slot>
<span class="citation-number"></span>
</div>
`); `);
export class Cite extends T(HTMLElement) { export class Cite extends T(HTMLElement) {
+1 -7
View File
@@ -22,6 +22,7 @@ d-math[block] {
} }
:host { :host {
} }
sup { sup {
@@ -37,13 +38,6 @@ span {
cursor: default; cursor: default;
} }
.container {
position: absolute;
width: 100%;
left: 0;
z-index: 10000;
}
.footnote-container { .footnote-container {
padding: 10px; padding: 10px;
} }
+10 -3
View File
@@ -20,9 +20,10 @@ const T = Template('d-hover-box', `
:host { :host {
position: absolute; position: absolute;
width: 100%; width: 100%;
left: 0; left: 0px;
z-index: 10000; z-index: 10000;
display: none; display: none;
white-space: normal
} }
.container { .container {
@@ -40,10 +41,13 @@ const T = Template('d-hover-box', `
left: 0; left: 0;
width: 100%; width: 100%;
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
background-color: rgb(250, 250, 250); background-color: rgba(250, 250, 250, 0.95);
box-shadow: 0 0 7px rgba(0, 0, 0, 0.1); box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
border-radius: 4px; border-radius: 4px;
box-sizing: border-box; box-sizing: border-box;
backdrop-filter: blur(2px);
-webkit-backdrop-filter: blur(2px);
} }
</style> </style>
@@ -117,11 +121,14 @@ export class HoverBox extends T(HTMLElement) {
show(position) { show(position) {
this.visible = true; this.visible = true;
this.style.display = 'block'; this.style.display = 'block';
// 10px extra offset from element
this.style.top = Math.round(position[1] + 10) + 'px';
} }
showAtNode(node) { showAtNode(node) {
// https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetTop
const bbox = node.getBoundingClientRect(); const bbox = node.getBoundingClientRect();
this.show([bbox.right, bbox.bottom]); this.show([node.offsetLeft + bbox.width, node.offsetTop + bbox.height]);
} }
hide() { hide() {
+1 -1
View File
@@ -43,7 +43,7 @@ export default function(dom, data) {
let title = dom.querySelector('d-title'); let title = dom.querySelector('d-title');
if (!title) { if (!title) {
let title = dom.createElement('d-title'); title = dom.createElement('d-title');
body.insertBefore(title, byline); body.insertBefore(title, byline);
} }
+6 -1
View File
@@ -24,12 +24,17 @@ export default function(dom) {
if (text && acceptNode(n)) { if (text && acceptNode(n)) {
text = quotes(text); text = quotes(text);
text = punctuation(text); text = punctuation(text);
text = ligatures(text); // TODO: Add back support for ligatures once their uppercased versions don't hang Chrome search anymore
// see: https://bugs.chromium.org/p/chromium/issues/detail?id=862648
// text = ligatures(text);
n.nodeValue = text; n.nodeValue = text;
} }
} }
} }
// 2018-07-11 shancarter@ and ludwigschubert@ no longer know what this was meant to accomplish
// if it was trying to not replace text in any child nodes of those listed here,
// then it does not accomplish that.
function acceptNode(node) { function acceptNode(node) {
var parent = node.parentElement; var parent = node.parentElement;
var isMath = (parent && parent.getAttribute && parent.getAttribute('class')) ? parent.getAttribute('class').includes('katex') || parent.getAttribute('class').includes('MathJax') : false; var isMath = (parent && parent.getAttribute && parent.getAttribute('class')) ? parent.getAttribute('class').includes('katex') || parent.getAttribute('class').includes('MathJax') : false;