Skip to content

Commit

Permalink
Fix distill katex dark theme (#85)
Browse files Browse the repository at this point in the history
rohandebsarkar authored Aug 23, 2024
1 parent 2eb0d35 commit 56f4c14
Showing 4 changed files with 67 additions and 69 deletions.
4 changes: 0 additions & 4 deletions assets/css/distill.scss
Original file line number Diff line number Diff line change
@@ -6,10 +6,6 @@ a {
color: currentColor;
}

span .katex {
color: var(--global-text-color-primary) !important;
}

d-byline {
border-top-color: var(--global-divider-color) !important;
}
112 changes: 57 additions & 55 deletions assets/js/distillpub/overrides.js
Original file line number Diff line number Diff line change
@@ -1,56 +1,58 @@
document.addEventListener('DOMContentLoaded', () => {
// Override styles of the footnotes.
document.querySelectorAll('d-footnote').forEach(function (footnote) {
footnote.shadowRoot
.querySelector('sup > span')
.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) {
cite.shadowRoot
.querySelector('div > span')
.setAttribute('style', 'color: var(--global-theme-color);');
cite.shadowRoot
.querySelector('style')
.sheet.insertRule(
'ul li a {color: var(--global-text-color-primary) !important; text-decoration: none;}'
);
cite.shadowRoot
.querySelector('style')
.sheet.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;}'
);
});
// Override styles of the math.
document.querySelectorAll('d-math').forEach(function (math) {
math.shadowRoot
.querySelector('style')
.sheet.insertRule(
'span .katex {color: var(--global-text-color-primary) !important;}'
);
});
document.addEventListener('readystatechange', () => {
if (document.readyState === 'complete') {
// Override styles of the footnotes.
document.querySelectorAll('d-footnote').forEach(function (footnote) {
footnote.shadowRoot
.querySelector('sup > span')
.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) {
cite.shadowRoot
.querySelector('div > span')
.setAttribute('style', 'color: var(--global-theme-color);');
cite.shadowRoot
.querySelector('style')
.sheet.insertRule(
'ul li a {color: var(--global-text-color-primary) !important; text-decoration: none;}'
);
cite.shadowRoot
.querySelector('style')
.sheet.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;}'
);
});
// Override styles of the math.
document.querySelectorAll('d-math').forEach(function (math) {
math.shadowRoot
.querySelector('style')
.sheet.insertRule(
'span .katex {color: var(--global-text-color-primary) !important;}'
);
});
}
});
10 changes: 5 additions & 5 deletions assets/js/distillpub/template.v2.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

10 changes: 5 additions & 5 deletions layouts/partials/scripts/distillpub.html
Original file line number Diff line number Diff line change
@@ -2,14 +2,14 @@
{{ with resources.Get "js/distillpub/template.v2.js" | minify }}
<script src="{{ .RelPermalink }}"></script>
{{ end }}
{{ with resources.Get "js/distillpub/overrides.js" | minify }}
<script>
{{ safeJS .Content }}
</script>
{{ end }}
{{ with resources.Get "css/distill.scss" | toCSS | minify }}
<style>
{{ safeCSS .Content }}
</style>
{{ end }}
{{ with resources.Get "js/distillpub/overrides.js" | minify }}
<script>
{{ safeJS .Content }}
</script>
{{ end }}
{{ end }}

0 comments on commit 56f4c14

Please sign in to comment.