Cutlery/calibre
1
0
Fork 0
mirror of https://github.com/kovidgoyal/calibre.git synced 2025-07-09 03:04:10 -04:00
Code Issues Packages Projects Releases Wiki Activity

Use CSS variables for themeing

Browse Source 
Allows easily changing colors dynamically for light/dark mode or even
user themes
This commit is contained in:
Kovid Goyal 2020-08-05 09:04:33 +05:30
parent 57bbbf97a8
commit 75a14bad36
No known key found for this signature in database
GPG Key ID: 06BC317B515ACE7C
3 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/pyj/book_list/main.pyj
View File

@ -14,7 +14,7 @@ from utils import safe_set_inner_html
from book_list.constants import book_list_container_id, read_book_container_id, INIT_ENDPOINT
from book_list.library_data import fetch_init_data, update_library_data, url_books_query
from book_list.theme import get_color, get_font_family
from book_list.theme import get_color, get_font_family, css_for_variables
from book_list.router import update_window_title, set_default_mode_handler, apply_url, set_mode_handler, on_pop_state
from book_list.globals import get_db, set_session_data
from book_list.ui import apply_url_state as book_list_mode_handler
@ -66,7 +66,7 @@ def init_ui():
translations = get_translations()
install(translations)
remove_initial_progress_bar()
document.head.appendChild(E.style(get_widget_css()))
document.head.appendChild(E.style(css_for_variables() + '\n\n' + get_widget_css()))
set_css(document.body, background_color=get_color('window-background'), color=get_color('window-foreground'))
document.body.appendChild(E.div())
document.body.lastChild.appendChild(E.div(id=book_list_container_id, style='display: none'))

9
src/pyj/book_list/theme.pyj
View File

@ -50,9 +50,16 @@ DEFAULT_FONTS = {
'main': 'sans-serif'
}
def css_for_variables():
ans = v'[]'
for k in DEFAULT_COLORS:
val = DEFAULT_COLORS[k]
ans.push(f'--calibre-color-{k}: {val};')
return ':root { ' + ans.join('\n') + '}'
def get_color(name):
return DEFAULT_COLORS[name]
return f'var(--calibre-color-{name})'
def color_to_rgba(color):

4
src/pyj/viewer-main.pyj
View File

@ -10,7 +10,7 @@ import initialize # noqa: unused-import
from ajax import ajax, workaround_qt_bug
from book_list.globals import get_session_data, set_session_data
from book_list.library_data import library_data
from book_list.theme import get_color
from book_list.theme import get_color, css_for_variables
from dom import get_widget_css, set_css
from modals import create_modal_container
from qt import from_python, to_python
@ -399,7 +399,7 @@ if window is window.top:
document.body.appendChild(E.div(id='view'))
window.onerror = onerror
create_modal_container()
document.head.appendChild(E.style(get_widget_css()))
document.head.appendChild(E.style(css_for_variables() + '\n\n' + get_widget_css()))
set_css(document.body, background_color=get_color('window-background'), color=get_color('window-foreground'))
setTimeout(def():
window.onpopstate = on_pop_state