-
Notifications
You must be signed in to change notification settings - Fork 15
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Harmonize themes between live code and dead code #39
Comments
Hmm - I think the challenge here is that we don't want to special-case this package just for Jupyter Book, but make it more generally useful. I do also think there's some value in making it explicit via visual style when a code block is now "executable". Perhaps one approach would be to adopt a style that is just a bit more polished in general, and behaves similarly to the Jupyter Notebook style? Then it could at least clash a bit less? |
I think that the code is executable is fairly clear given the run button is there - it could also be visually emphasized with line numbers appearing once code is live or putting a green line around the code box. It's unclear to me right now whether the static syntax highlighting is compatible with the CodeMirror syntax highlighting, but if we agree in principle that it's a desirable enhancement I could take a stab at it. If there's a better place to introduce harmonized themes - for instance, in the jupyterbook sphinx theme - that would also work. |
So I think there are 3 places to consider, and maybe 2 of them would be good candidates to try some improvements:
Does that make sense to you? I'd be happy to take a look at PRs if you like! |
Hi, Is there any chance someone could take a look at jupyter-book/thebe#548. In summary: The code block color from my furo dark theme is not matching with the pygments_dark_style, even after changing the following: thebe_config = {
"codemirror-theme": "monokai",
"always_load": True,
} To reproduce click here and click on This is my import os
import sys
sys.path.insert(0, os.path.abspath('.'))
# -- Project information -----------------------------------------------------
project = 'oop-python-learning'
copyright = '2022, Fernando Carvalho Pacheco'
author = 'Fernando Carvalho Pacheco'
# The full version, including alpha/beta/rc tags
release = '0.0.1'
# -- General configuration ---------------------------------------------------
# Add any Sphinx extension module names here, as strings. They can be
# extensions coming with Sphinx (named 'sphinx.ext.*') or your custom
# ones.
extensions = [
"myst_nb",
"sphinx.ext.autodoc",
"sphinx.ext.napoleon",
"sphinx_autodoc_typehints",
"sphinx.ext.intersphinx",
"sphinx.ext.autosectionlabel",
"sphinx_design",
"sphinx_thebe",
]
myst_enable_extensions = [
"colon_fence",
]
# Make sure the explicity target is unique
autosectionlabel_prefix_document = True
autosectionlabel_maxdepth = 3
myst_heading_anchors = 3
source_suffix = {
'.ipynb': 'myst-nb',
'.myst': 'myst-nb',
'.md': 'myst-nb',
}
autosectionlabel_prefix_document = True
# Add any paths that contain templates here, relative to this directory.
templates_path = ['_templates']
# List of patterns, relative to source directory, that match files and
# directories to ignore when looking for source files.
# This pattern also affects html_static_path and html_extra_path.
exclude_patterns = ['_build', 'build', 'Thumbs.db', '.DS_Store', '.env', '**.ipynb_checkpoints']
pygments_style = 'sphinx'
pygments_dark_style = "monokai"
# -- Options for HTML output -------------------------------------------------
# The theme to use for HTML and HTML Help pages. See the documentation for
# a list of builtin themes.
#
html_theme = 'furo'
# Add any paths that contain custom static files (such as style sheets) here,
# relative to this directory. They are copied after the builtin static files,
# so a file named "default.css" will overwrite the builtin "default.css".
html_static_path = ['_static']
html_theme_options = {
"navigation_with_keys": True,
}
html_title = "OOP Python"
# -- Jupyter options ---------------------------------------------------------
jupyter_execute_notebooks = "auto"
thebe_config = {
"codemirror-theme": "monokai",
"always_load": True,
} |
Description / Summary
Right now, statically syntax highlighted code with the default jupyterbook theme uses a different theme (colors, bolding, etc.) than live code with CodeMirror. It would be nice if the themes were similar.
Value / benefit
It would look a little more polished if the themes were similar. Right now it feels like the code changes when you press the live code button, because the colors of the code change. In addition, if line spacing was the same, things would stay in place when switching to live code.
Implementation details
Creating a custom codemirror theme would probably be the easiest route. It's not clear to me, however, reading the docs and comments, whether the codemirror theme config option currently works. Some guidance would be
Tasks to complete
The text was updated successfully, but these errors were encountered: