allow building of additional color themes (and use them to visualize …

…decryption of encryptcontent plugin)
unverbuggt · Aug 31, 2023 · e619726 · e619726
1 parent 7e30bbd
commit e619726
Show file tree

Hide file tree

Showing 9 changed files with 79 additions and 32 deletions.
diff --git a/README.md b/README.md
@@ -81,10 +81,15 @@ plugins:
  - color-theme: # optional
  theme_color: '#ff6600' # primary color
  secondary_color: 'complementary' # can be a color or scheme
- #extra_css_light: # list of extra CSS for light mode
- # - 'css/additional-light.css'
- #extra_css_dark: # list of extra CSS for dark mode
- # - 'css/additional-dark.css'
+ light_text_color: '#000' # black
+ dark_text_color: '#fff' # white
+ extra_css_light: # list of extra CSS for light mode
+ - 'css/additional-light.css'
+ extra_css_dark: # list of extra CSS for dark mode
+ - 'css/additional-dark.css'
+ additional: # build these themes also
+ - theme_color: '#44bb4f'
+ secondary_color: 'complementary'
 
  - w3css-classes: {} # mandatory
 

diff --git a/docs/de/colors/index.md b/docs/de/colors/index.md
@@ -15,14 +15,17 @@ Durch die Option `extra_css_light` und `extra_css_dark` können zusätzliche CSS
 plugins:
  #...
  - color-theme:
- theme_color: '#ef6110' #Hauptfarbe
- secondary_color: 'complementary' #Zweitfarbe oder Farbschema
- light_text_color: '#000' #Schwarz
- dark_text_color: '#fff' #Weiss
- #extra_css_light: #Liste mit zuätzlichen CSS Dateien für die helle Ansicht
- # - 'css/additional-light.css'
- #extra_css_dark: #Liste mit zuätzlichen CSS Dateien für die dunkle Ansicht
- # - 'css/additional-dark.css'
+ theme_color: '#ef6110' # Hauptfarbe
+ secondary_color: 'complementary' # Zweitfarbe oder Farbschema
+ light_text_color: '#000' # Schwarz
+ dark_text_color: '#fff' # Weiss
+ extra_css_light: # Liste mit zusätzlichen CSS Dateien für die helle Ansicht
+ - 'css/additional-light.css'
+ extra_css_dark: # Liste mit zusätzlichen CSS Dateien für die dunkle Ansicht
+ - 'css/additional-dark.css'
+ additional: # Diese themes auch noch erzeugen
+ - theme_color: '#44bb4f'
+ secondary_color: 'complementary'
  #...
 ```
 

diff --git a/docs/de/extensions/encryptcontent.md b/docs/de/extensions/encryptcontent.md
@@ -46,4 +46,11 @@ Um eine Seite zu verschlüsseln muss nur der Wert `password` gesetzt werden.
 
 ```markdown
 password: 12345
-```
+```
+
+<script id="autostart">
+const ctheme = 'css/w3-theme-44bb4f-complementary';
+document.getElementById('theme-auto').href = base_url + '/' + ctheme + '.css';
+document.getElementById('theme-light').href = base_url + '/' + ctheme + '-light.css';
+document.getElementById('theme-dark').href = base_url + '/' + ctheme + '-dark.css';
+</script>
diff --git a/docs/en/colors/index.md b/docs/en/colors/index.md
@@ -15,14 +15,17 @@ Use options `extra_css_light` and `extra_css_dark` to integrate additional CSS t
 plugins:
  #...
  - color-theme:
- theme_color: '#ef6110' #primary color
- secondary_color: 'complementary' #can be a color or scheme
- light_text_color: '#000' #black
- dark_text_color: '#fff' #white
- #extra_css_light: #list of extra CSS for light mode
- # - 'css/additional-light.css'
- #extra_css_dark: #list of extra CSS for dark mode
- # - 'css/additional-dark.css'
+ theme_color: '#ef6110' # primary color
+ secondary_color: 'complementary' # can be a color or scheme
+ light_text_color: '#000' # black
+ dark_text_color: '#fff' # white
+ extra_css_light: # list of extra CSS for light mode
+ - 'css/additional-light.css'
+ extra_css_dark: # list of extra CSS for dark mode
+ - 'css/additional-dark.css'
+ additional: # build these themes also
+ - theme_color: '#44bb4f'
+ secondary_color: 'complementary'
  #...
 ```
 

diff --git a/docs/en/extensions/encryptcontent.md b/docs/en/extensions/encryptcontent.md
@@ -46,4 +46,11 @@ Pages can be marked for encryption by adding the meta `password`.
 
 ```markdown
 password: 12345
-```
+```
+
+<script id="autostart">
+const ctheme = 'css/w3-theme-44bb4f-complementary';
+document.getElementById('theme-auto').href = base_url + '/' + ctheme + '.css';
+document.getElementById('theme-light').href = base_url + '/' + ctheme + '-light.css';
+document.getElementById('theme-dark').href = base_url + '/' + ctheme + '-dark.css';
+</script>
diff --git a/mkdocs.yml b/mkdocs.yml
@@ -97,6 +97,9 @@ plugins:
  extra_css_dark: 
  - 'extra_css/stackoverflow-dark.min.css'
  - 'extra_css/tablesort-dark.css'
+ additional:
+ - theme_color: '#44bb4f'
+ secondary_color: 'complementary'
 
  - w3css-classes: {}
 
@@ -128,6 +131,7 @@ plugins:
  selfhost_dir: 'theme_override'
  reload_scripts:
  - '#theme'
+ - '#autostart'
  translations:
  en:
  title_prefix: ''

diff --git a/mkdocs_gh.yml b/mkdocs_gh.yml
@@ -98,6 +98,9 @@ plugins:
  extra_css_dark: 
  - 'extra_css/stackoverflow-dark.min.css'
  - 'extra_css/tablesort-dark.css'
+ additional:
+ - theme_color: '#44bb4f'
+ secondary_color: 'complementary'
 
  - w3css-classes: {}
 
@@ -129,6 +132,7 @@ plugins:
  selfhost_dir: 'theme_override'
  reload_scripts:
  - '#theme'
+ - '#autostart'
  translations:
  de:
  title_prefix: ''

diff --git a/risonia_theme/base.html b/risonia_theme/base.html
@@ -54,13 +54,13 @@
 {%- block styles %}
  <link rel="stylesheet" href="{{ 'css/w3.css'|url }}">
  {%- if page_theme %}
- <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'.css')|url }}">
- <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'-light.css')|url }}" media="none" id="light">
- <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'-dark.css')|url }}" media="none" id="dark">
+ <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'.css')|url }}" id="theme-auto">
+ <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'-light.css')|url }}" media="none" id="theme-light">
+ <link rel="stylesheet" href="{{ ('css/w3-theme-'+page_theme+'-dark.css')|url }}" media="none" id="theme-dark">
  {%- else %}
- <link rel="stylesheet" href="{{ 'css/w3-theme.css'|url }}">
- <link rel="stylesheet" href="{{ 'css/w3-theme-light.css'|url }}" media="none" id="light">
- <link rel="stylesheet" href="{{ 'css/w3-theme-dark.css'|url }}" media="none" id="dark">
+ <link rel="stylesheet" href="{{ 'css/w3-theme.css'|url }}" id="theme-auto">
+ <link rel="stylesheet" href="{{ 'css/w3-theme-light.css'|url }}" media="none" id="theme-light">
+ <link rel="stylesheet" href="{{ 'css/w3-theme-dark.css'|url }}" media="none" id="theme-dark">
  {%- endif %}
  <link rel="stylesheet" href="{{ 'css/theme.css'|url }}">
  {%- for path in config.extra_css %}
@@ -75,12 +75,12 @@
  let theme = localStorage.getItem(themeItem);
  if (theme) {
  if (theme == 'light') {
- document.getElementById('dark').media = 'none';
- document.getElementById('light').media = '';
+ document.getElementById('theme-dark').media = 'none';
+ document.getElementById('theme-light').media = '';
  }
  if (theme == 'dark') {
- document.getElementById('light').media = 'none';
- document.getElementById('dark').media = '';
+ document.getElementById('theme-light').media = 'none';
+ document.getElementById('theme-dark').media = '';
  }
  }
  }

diff --git a/risonia_theme/plugins/color/plugin.py b/risonia_theme/plugins/color/plugin.py
@@ -3,6 +3,7 @@
 from colorsys import rgb_to_hls
 from colorsys import hls_to_rgb
 import math
+import logging
 
 from jinja2 import Template
 
@@ -16,6 +17,8 @@
 except ImportError:
  string_types = str
 
+logger = logging.getLogger("mkdocs.plugins.colortheme")
+
 #PLUGIN_DIR = os.path.dirname(os.path.realpath(__file__))
 #CSS_TPL_PATH = os.path.join(PLUGIN_DIR, 'w3-theme.jinja2.py')
 
@@ -113,6 +116,7 @@ class W3cssColorTheme(BasePlugin):
  ('dark_text_color', config_options.Type(str, default='#fff')),
  ('extra_css_light', config_options.Type(list, default=[])),
  ('extra_css_dark', config_options.Type(list, default=[])),
+ ('additional', config_options.Type(list, default=[])),
  )
 
  def text_contrast(self, value, pref_dark):
@@ -290,6 +294,16 @@ def on_post_build(self, config, **kwargs):
  for theme in self.themes_to_build:
  pcolor, scolor = theme.split(',',1)
  self.generate_theme(config, pcolor, '-'+pcolor.lstrip('#')+'-'+scolor.lstrip('#'), scolor)
+ if self.config.get('additional'):
+ try:
+ for additional in self.config['additional']:
+ pcolor = additional['theme_color']
+ scolor = additional['secondary_color']
+ name = '-'+pcolor.lstrip('#')+'-'+scolor.lstrip('#')
+ self.generate_theme(config, pcolor, name, scolor)
+ logger.info('Built additional color theme "w3-theme{name}".'.format(name=name))
+ except:
+ logger.info('Could not build additional color-themes')
 
  def on_page_context(self, context, page, config, nav):
  #get meta keys from pages