Distill dark mode fixes

alshedivat · Dec 31, 2021 · 2b93e64 · 2b93e64
1 parent 7f53255
commit 2b93e64
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 6 deletions.
diff --git a/_layouts/distill.html b/_layouts/distill.html
@@ -5,7 +5,6 @@
     {% include scripts/mathjax.html %}
     <script src="{{ '/assets/js/distillpub/template.v2.js' | relative_url }}"></script>
     <script src="{{ '/assets/js/distillpub/transforms.v2.js' | relative_url }}"></script>
-    <script src="{{ '/assets/js/distillpub/overrides.js' | relative_url }}"></script>
     {% if page._styles %}
     <style type="text/css">
       {{ page._styles }}
@@ -104,4 +103,7 @@ <h3>Contents</h3>
   <d-bibliography src="{{ page.bibliography | prepend: '/assets/bibliography/' | relative_url }}">
   </d-bibliography>
 
+  {% include scripts/jquery.html %}
+  <script src="{{ '/assets/js/distillpub/overrides.js' | relative_url }}"></script>
+
 </html>
diff --git a/_sass/_distill.scss b/_sass/_distill.scss
@@ -44,13 +44,13 @@ d-article {
     width: calc(max(70%, 300px));
     margin-right: 0px;
     margin-top:  0em;
-    display: grid;      
-    grid-template-columns: 
-      minmax(8px, 1fr) [toc] auto 
+    display: grid;
+    grid-template-columns:
+      minmax(8px, 1fr) [toc] auto
       minmax(8px, 1fr) [toc-line] 1px
       minmax(32px, 2fr);
-    
-    nav {      
+
+    nav {
       grid-column: toc;
       a {
         border-bottom: none !important;
@@ -87,6 +87,10 @@ d-article {
       grid-column: toc-line;
     }
   }
+
+  d-footnote {
+    scroll-margin-top: 66px;
+  }
 }
 
 d-appendix {

diff --git a/assets/js/distillpub/overrides.js b/assets/js/distillpub/overrides.js
@@ -5,6 +5,8 @@ $(document).ready(function() {
             .setAttribute("style", "color: var(--global-theme-color);");
         footnote.shadowRoot.querySelector("d-hover-box").shadowRoot.querySelector("style").sheet
             .insertRule(".panel {background-color: var(--global-bg-color) !important;}");
+        footnote.shadowRoot.querySelector("d-hover-box").shadowRoot.querySelector("style").sheet
+            .insertRule(".panel {border-color: var(--global-divider-color) !important;}");
     });
     // Override styles of the citations.
     document.querySelectorAll("d-cite").forEach(function(cite) {
@@ -16,5 +18,7 @@ $(document).ready(function() {
             .insertRule("ul li a:hover {color: var(--global-theme-color) !important;}");
         cite.shadowRoot.querySelector("d-hover-box").shadowRoot.querySelector("style").sheet
             .insertRule(".panel {background-color: var(--global-bg-color) !important;}");
+        cite.shadowRoot.querySelector("d-hover-box").shadowRoot.querySelector("style").sheet
+            .insertRule(".panel {border-color: var(--global-divider-color) !important;}");
     });
 })