ipywidgets accordion renders with two selection arrows
swelborn opened this issue · 4 comments
I am not sure if this is the correct place to post this as I do not know the intricacies of sphinx/myst, but I'm sure you can point me in the right direction.
In jupyter lab, everything looks just fine, but when rendered as documentation on the readthedocs for my app, each accordion has two down arrows instead of one.
I am using:
ipywidgets 8.0.0b1
myst-nb 0.13.1
myst-parser 0.15.2
jupyter_sphinx 0.3.2
jupyterlab 3.2.8
I am not sure which dependency is doing this, so I have also supplied the conda environment used to build my application's site here:
requirements.txt
The environment file used to build is here on my repository.
I have to install myst with no dependencies as it currently does not support ipywidgets v8.
It seems to be some incorrect CSS, but at a glance I don't see what causes it. I suspect it isn't on jupyter-sphinx side because what it does is fairly minimal and doesn't touch CSS as far as I remember.
Does the problem also appear with if you use bare sphinx and the alabaster theme (as opposed to sphinx-book-theme)?
Thanks for your reply. I tried running a build without using sphinx. I tried changing my conf file to make it the alabaster theme and this was the result:
Now you can see that it is not two arrows, but no arrows with a box instead. Weird. You may want to take a look at the conf just to make sure I did it right (I made this from a cookiecutter, and I don't know the build process of sphinx very well).
# Configuration file for the Sphinx documentation builder.
#
# This file only contains a selection of the most common options. For a full
# list see the documentation:
# https://www.sphinx-doc.org/en/master/usage/configuration.html
# -- Path setup --------------------------------------------------------------
import inspect
# If extensions (or modules to document with autodoc) are in another directory,
# add these directories to sys.path here. If the directory is relative to the
# documentation root, use os.path.abspath to make it absolute, like shown here.
#
import os
import shutil
import subprocess
import sys
try:
from tomopyui import __version__ as release
except ImportError:
release = "unknown"
# -- Project information -----------------------------------------------------
project = "tomopyui"
copyright = "2021, Samuel Scott Welborn"
author = "Samuel Scott Welborn"
# -- Generate API ------------------------------------------------------------
api_folder_name = "api"
shutil.rmtree(api_folder_name, ignore_errors=True) # in case of new or renamed modules
subprocess.call(
" ".join(
[
"sphinx-apidoc",
f"-o {api_folder_name}/",
"--force",
"--no-toc",
"--templatedir _templates",
"--separate",
"../tomopyui/",
# excluded modules
]
),
shell=True,
)
# -- 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 = [
"jupyter_sphinx",
"myst_nb",
"numpydoc",
"sphinx.ext.autodoc",
"sphinx.ext.intersphinx",
"sphinx.ext.linkcode",
"sphinx.ext.mathjax",
"sphinx.ext.napoleon",
"sphinx_copybutton",
"sphinx_panels",
# "sphinx_thebe",
"sphinx_togglebutton",
]
# API settings
autodoc_default_options = {
"members": True,
"show-inheritance": True,
"undoc-members": True,
}
autodoc_mock_imports = ["cupyx", "cupy", "tqdm"]
add_module_names = False
napoleon_google_docstring = False
napoleon_include_private_with_doc = False
napoleon_include_special_with_doc = False
napoleon_numpy_docstring = True
napoleon_use_admonition_for_examples = False
napoleon_use_admonition_for_notes = False
napoleon_use_admonition_for_references = False
napoleon_use_ivar = False
napoleon_use_param = False
napoleon_use_rtype = False
numpydoc_show_class_members = False
# Cross-referencing configuration
default_role = "py:obj"
primary_domain = "py"
nitpicky = True # warn if cross-references are missing
# Intersphinx settings
intersphinx_mapping = {
"tomopy": ("https://tomopy.readthedocs.io/en/latest/", None),
"mpl-interactions": ("https://mpl-interactions.readthedocs.io/en/stable/", None),
"ipywidgets": ("https://ipywidgets.readthedocs.io/en/latest/", None),
"matplotlib": ("https://matplotlib.org/stable", None),
"numpy": ("https://numpy.org/doc/stable", None),
"python": ("https://docs.python.org/3", None),
}
# remove panels css to get wider main content
panels_add_bootstrap_css = False
# Settings for copybutton
copybutton_prompt_is_regexp = True
copybutton_prompt_text = r">>> |\.\.\. " # doctest
# Settings for linkcheck
linkcheck_anchors = False
linkcheck_ignore = [] # type: ignore
execution_timeout = -1
jupyter_execute_notebooks = "off"
if "EXECUTE_NB" in os.environ:
print("\033[93;1mWill run Jupyter notebooks!\033[0m")
jupyter_execute_notebooks = "force"
# Settings for myst-parser
myst_enable_extensions = [
"amsmath",
"colon_fence",
"dollarmath",
"smartquotes",
"substitution",
]
suppress_warnings = [
"myst.header",
]
# 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 = [
"**ipynb_checkpoints",
".DS_Store",
"Thumbs.db",
"_build",
]
# -- Options for HTML output -------------------------------------------------
# The theme to use for HTML and HTML Help pages. See the documentation for
# a list of builtin themes.
#
html_copy_source = True # needed for download notebook button
html_css_files = [
"custom.css",
]
html_sourcelink_suffix = ""
html_static_path = ["_static"]
html_theme = "alabaster"
# html_theme_options = {
# "launch_buttons": {
# "binderhub_url": "https://mybinder.org",
# "colab_url": "https://colab.research.google.com",
# "notebook_interface": "jupyterlab",
# "thebe": True,
# "thebelab": True,
# },
# "path_to_docs": "docs",
# "repository_branch": "main",
# "repository_url": "https://github.com/samwelborn/tomopyui",
# "use_download_button": True,
# "use_edit_page_button": True,
# "use_issues_button": True,
# "use_repository_button": True,
# "logo_only": True,
# }
html_title = "tomopyui"
html_logo = "_static/images/logo.png"
html_favicon = "_static/images/tomopy-favicon.svg"
master_doc = "index"
# thebe_config = {
# "repository_url": html_theme_options["repository_url"],
# "repository_branch": html_theme_options["repository_branch"],
# }
# based on pandas/doc/source/conf.py
def linkcode_resolve(domain, info):
"""
Determine the URL corresponding to Python object
"""
if domain != "py":
return None
modname = info["module"]
fullname = info["fullname"]
submod = sys.modules.get(modname)
if submod is None:
return None
obj = submod
for part in fullname.split("."):
try:
obj = getattr(obj, part)
except AttributeError:
return None
try:
fn = inspect.getsourcefile(inspect.unwrap(obj))
except TypeError:
fn = None
if not fn:
return None
try:
source, lineno = inspect.getsourcelines(obj)
except OSError:
lineno = None
if lineno:
linespec = f"#L{lineno}-L{lineno + len(source) - 1}"
else:
linespec = ""
fn = os.path.relpath(fn, start=os.path.dirname("../tomopyui"))
return f"https://github.com/samwelborn/tomopyui/blob/main/tomopyui/{fn}{linespec}" # noqa@swelborn I'm a new maintainer of jupyter-sphinx and I'm starting a status update of the existing issues. The problem you are facing is definitely not related to jupyter-sphinx as it has no influence on the css itself, my guess would be more directed to the sphinx-book-theme and pydata-sphinx-theme that are responsible for the css update applied to the html generated by Sphinx.
Are you still facing it ?
Could you share a visual example instead of a link and maybe a minimal conf.py ? (there are so many extension in the one you provided it's impossible to sort who does what)
I don't think this is still an issue. Was a long time ago, likely to do with beta version of ipywidgets...