executablebooks / sphinx-tabs

Tabbed views for Sphinx
https://sphinx-tabs.readthedocs.io
MIT License
263 stars 67 forks source link

Extra space at the bottom of the panel in sphinx-rtd-theme #168

Closed reiyw closed 2 years ago

reiyw commented 2 years ago

Describe the bug

When sphinx-rtd-theme is applied as a theme, a space appears at the bottom of the panel that should not be needed.

.. tabs::

   .. tab:: Apples

      Apples are green, or sometimes red.

.. tabs::

   .. code-tab:: c

         int main(const int argc, const char **argv) {
           return 0;
         }

will be rendered as:

image

The cause of this problem seems to be the way margins between content are spaced in sphinx-rtd-theme. Basically, sphinx-rtd-theme uses margin-bottom to control the space between contents. However, if one always leaves a bottom margin, they will end up with extra space at the bottom in so-called adomonition and other elements enclosed in boxes. To deal with this, sphinx-rtd-theme sets margin-bottom: 0 for the last child element contained in such elements.

https://github.com/readthedocs/sphinx_rtd_theme/blob/0da22b885be387b79f7552c92be00fd14d11228a/src/sass/_theme_rst.sass#L126-L133

However, this adjustment is not applied to classes introduced by sphinx-tabs, so the extra space remains.

The workaround is to set margin-bottom: 0 for the last child as in sphinx-rtd-theme.

.sphinx-tabs .sphinx-tabs-panel *:last-child {
    margin-bottom: 0;
}

But this is not a proper solution. In fact, if you apply this CSS to the default Sphinx theme (alabaster), you will strip off too much margin at the bottom.

image

I am a CSS newbie, so if you have a more general solution, that would be great.

Reproduce the bug

Install sphinx-rtd-theme:

$ pip install sphinx-rtd-theme==1.0.0

Edit your conf.py file's html_theme setting:

html_theme = "sphinx_rtd_theme"

Then just use the sphinx-tabs.

List your environment

pip freeze ```console $ pip freeze alabaster==0.7.12 Babel==2.10.3 build==0.8.0 certifi==2022.6.15 charset-normalizer==2.0.12 click==8.1.3 docutils==0.17.1 idna==3.3 imagesize==1.3.0 importlib-metadata==4.12.0 Jinja2==3.0.3 markdown-it-py==2.1.0 MarkupSafe==2.1.1 mdit-py-plugins==0.3.0 mdurl==0.1.1 myst-parser==0.18.0 packaging==21.3 pep517==0.12.0 pip-tools==6.7.0 Pygments==2.12.0 pyparsing==3.0.9 pytz==2022.1 PyYAML==6.0 requests==2.28.0 snowballstemmer==2.2.0 Sphinx==4.5.0 sphinx-rtd-theme==1.0.0 sphinx-tabs==3.4.0 sphinxcontrib-applehelp==1.0.2 sphinxcontrib-devhelp==1.0.2 sphinxcontrib-htmlhelp==2.0.0 sphinxcontrib-jsmath==1.0.1 sphinxcontrib-qthelp==1.0.3 sphinxcontrib-serializinghtml==1.1.5 tomli==2.0.1 typing_extensions==4.2.0 urllib3==1.26.9 zipp==3.8.0 ```
welcome[bot] commented 2 years ago

Thanks for opening your first issue here! Engagement like this is essential for open source projects! :hugs:
If you haven't done so already, check out EBP's Code of Conduct. Also, please try to follow the issue template as it helps other community members to contribute more effectively.
If your issue is a feature request, others may react to it, to raise its prominence (see Feature Voting).
Welcome to the EBP community! :tada:

reiyw commented 2 years ago

Oops, I overlooked https://github.com/executablebooks/sphinx-tabs/issues/139