[DOC] Tooltips are always shown in light mode, even in dark mode. (#2348)

* pin sphinx-hoverxref version to 1.4.x, where x>2

For reference: https://stackoverflow.com/questions/39590187/in-requirements-txt-what-does-tilde-equals-mean

* Create hoverxref-darkmode.css

* oopsy hoopsy typo

* hmmmm when did this break? 👀

* Imma stupid for this, sorry Kevin 🙇

* 🚀 i did it

* Code review (Kevin)

Co-authored-by: Kevin Anderson <kevin.anderso@gmail.com>

---------

Co-authored-by: Kevin Anderson <kevin.anderso@gmail.com>

Author: echedey-ls

docs/sphinx/source/_static/tooltipster_color_theming.css

@@ -0,0 +1,10 @@
+/* Overrides for sphinx-hoverxref since it does not support a native dark theme, see */
+/* https://github.com/readthedocs/sphinx-hoverxref/issues/231 */
+/* Inspired by https://github.com/pybamm-team/PyBaMM/pull/3083 */
+
+/* These will ensure that the tooltip inherits the pydata-sphinx-theme colours */
+
+.tooltipster-sidetip.tooltipster-shadow.tooltipster-shadow-custom .tooltipster-content {
+    background-color: var(--pst-color-background) !important;
+    color: var(--pst-color-text-base) !important;
+}

docs/sphinx/source/conf.py

@@ -282,6 +282,8 @@ def setup(app):
     app.add_css_file("reference_format.css")
     # Add a warning banner at the top of the page if viewing the "latest" docs
     app.add_js_file("version-alert.js")
+    # Match the color theme of tooltips to PyData Sphinx Theme light/dark mode
+    app.add_css_file("tooltipster_color_theming.css")
 
 # -- Options for LaTeX output ---------------------------------------------
 

pyproject.toml

@@ -66,7 +66,7 @@ doc = [
     'sphinx-toggleprompt == 0.5.2',
     'sphinx-favicon',
     'solarfactors',
-    'sphinx-hoverxref',
+    'sphinx-hoverxref ~= 1.4.2',  # when updating, check that _static/tooltipster_color_theming.css still works
 ]
 test = [
     'pytest',