Make pygments style switching work when JS is off, but prefers-color-scheme is enabled

This commit is contained in:
Sumner Evans 2020-04-09 09:26:20 -06:00
parent 5955f45a30
commit 02e1404e34
No known key found for this signature in database
GPG key ID: 8904527AB50022FD
2 changed files with 8 additions and 3 deletions

View file

@ -36,7 +36,12 @@
<link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/tipuesearch/tipuesearch.min.css" />
{% endif %}
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/pygments/{{ PYGMENTS_STYLE|default('github') }}.min.css">
<link rel="stylesheet" type="text/css"
media="(prefers-color-scheme: dark)"
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/pygments/{{ PYGMENTS_STYLE_DARK|default('github') }}.min.css">
<link rel="stylesheet" type="text/css"
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/pygments/{{ PYGMENTS_STYLE|default('github') }}.min.css">
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/font-awesome/css/fontawesome.css">
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/font-awesome/css/brands.css">
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/font-awesome/css/solid.css">

View file

@ -22,8 +22,8 @@
}
console.log(`Switching theme to ${theme}.`)
// Find the pygments CSS file and change it to the theme specified in the
// config.
// Find the pygments CSS files (there are two, one for each theme) and
// change them both to the theme specified by the user.
const pygmentsTheme = theme === 'light'
? '{{ PYGMENTS_STYLE }}'
: '{{ PYGMENTS_STYLE_DARK or PYGMENTS_STYLE }}'