schtobia/flex
1
0
Fork 0
Code Issues Pull requests Activity

Fixed some bugs with various settings combinations

Browse source
This commit is contained in:
Sumner Evans 2020-04-15 18:33:28 -06:00
parent 904484e2b4
commit ec1acb115a
No known key found for this signature in database
GPG key ID: 8904527AB50022FD
8 changed files with 177 additions and 180 deletions
Download patch file Download diff file Expand all files Collapse all files

41
templates/base.html
View file

@ -32,27 +32,28 @@
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/stylesheet/style.min.css">
{% endif %}
<!--
DARK THEME STYLES
The dark theme will be enabled if any of the following are true:
* the <html> tag has the .dark-theme class.
* THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE is true and the appropriate color scheme preference
is set in the browser and the <html> tag does not have the .light-theme class.
-->
<link rel="stylesheet" type="text/css"
{% if THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE %}
{% if THEME_COLOR|default("light") == "dark" %}
media="(prefers-color-scheme: dark), (prefers-color-scheme: no-preference)"
{% else %}
media="(prefers-color-scheme: dark)"
{% endif %}
{% endif %}
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/stylesheet/dark-theme.min.css">
<!-- DARK THEME STYLES -->
{% if not THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE and not THEME_COLOR_ENABLE_USER_OVERRIDE and THEME_COLOR == "dark" %}
<link rel="stylesheet" type="text/css"
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/stylesheet/dark-theme-not-overridden.min.css">
{% endif %}
{% if THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE %}
<!-- Enable dark mode when media query matches and .light-theme class does not exist on <html> tag -->
<link rel="stylesheet" type="text/css"
{% if THEME_COLOR|default("light") == "dark" %}
media="(prefers-color-scheme: dark), (prefers-color-scheme: no-preference)"
{% else %}
media="(prefers-color-scheme: dark)"
{% endif %}
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/stylesheet/dark-theme-not-overridden.min.css">
{% endif %}
{% if THEME_COLOR_ENABLE_USER_OVERRIDE %}
<!-- Enable dark mode when .dark-theme class exists on <html> tag -->
<link rel="stylesheet" type="text/css"
href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/stylesheet/dark-theme-has-class.min.css">
{% endif %}
<!--
PYGMENTS STYLES
-->
<!-- PYGMENTS STYLES -->
{% if THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE or THEME_COLOR == "dark" %}
<link rel="stylesheet" type="text/css"
{% if THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE %}

6
templates/partial/flex.html
View file

@ -23,7 +23,11 @@
{% if THEME_COLOR_ENABLE_USER_OVERRIDE %}
<script>
{% if THEME_COLOR_AUTO_DETECT_BROWSER_PREFERENCE %}
const darkSchemeWatch = window.matchMedia('(prefers-color-scheme: dark)');
{% if THEME_COLOR|default("light") == "dark" %}
const darkSchemeWatch = window.matchMedia('(prefers-color-scheme: dark), (prefers-color-scheme: no-preference)');
{% else %}
const darkSchemeWatch = window.matchMedia('(prefers-color-scheme: dark)');
{% endif %}
{% endif %}
function detectThemeAndSwitchStyle() {