[Fix #402] Use dfn.js for backlinks

WICG · Mar 1, 2016 · 39d2aed · 39d2aed
1 parent 16f1825
commit 39d2aed
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 0 deletions.
diff --git a/assets/styles/respec-complement.css b/assets/styles/respec-complement.css
@@ -49,3 +49,26 @@ var {
     color: #005A9C;
     font-style: normal;
 }
+
+/*
+ * From https://resources.whatwg.org/standard.css
+ * Styles used in https://resources.whatwg.org/dfn.js
+ */
+body.dfnEnabled dfn { cursor: pointer; }
+.dfnPanel {
+  display: inline;
+  position: absolute;
+  z-index: 35;
+  height: auto;
+  width: auto;
+  padding: 0.5em 0.75em;
+  font: small Helvetica Neue, sans-serif, Droid Sans Fallback;
+  background: #DDDDDD;
+  color: black;
+  border: outset 0.2em;
+}
+.dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
+.dfnPanel :link, .dfnPanel :visited { color: black; }
+.dfnPanel p:not(.spec-link) { font-weight: bolder; }
+.dfnPanel * + p { margin-top: 0.25em; }
+.dfnPanel li { list-style-position: inside; }
diff --git a/spec/shadow/index.html b/spec/shadow/index.html
@@ -7,7 +7,14 @@
     <script src='../../assets/scripts/autolink.js' class='remove'></script>
     <link rel="stylesheet" href="../../assets/styles/respec-complement.css" type="text/css" />
     <script src='//www.w3.org/Tools/respec/respec-w3c-common' async class='remove'></script>
+    <script src='//resources.whatwg.org/dfn.js' defer class='remove'></script>
     <script class='remove'>
+      function resolveBacklink() {
+          // For dfn.js
+          if (window.initDfn) {
+              initDfn();
+          }
+      }
       var respecConfig = {
           specStatus: "ED",
           shortName: "shadow-dom",
@@ -31,6 +38,7 @@
               }
           ],
           preProcess: [resolveAutolink],
+          postProcess: [resolveBacklink],
           localBiblio: {
               "EDITING": {
                   title: "HTML Editing APIs",