readthedocs / sphinx_rtd_theme

Sphinx theme from Read the Docs
https://sphinx-rtd-theme.readthedocs.io/
MIT License
4.8k stars 1.74k forks source link

py:property's stacking on a single line on larger screen widths. [replicated] #1301

Open ArachnidAbby opened 2 years ago

ArachnidAbby commented 2 years ago

Problem

Multiple properties I defined in the docs are all stacking on a single line. I have no idea what could be causing it. Using | to force a new line just adds too much space to be reasonable.

Before you continue reading, thanks in advance for looking at my issue. Sorry if I just messed up my RST, I am fairly new to writing documentation in sphinx.

Reproducible Project

I think this should be the minimum needed to reproduce it. Just note that it doesn't happen on smaller screen widths.

.. py:class:: Entity(add_to_scene_entities=True, \
    name=str, visible=True, enabled=True, ignore=False, \
    eternal=False, ignore_puased=False, ignore_input=False, \
    parent=scene, model=None, color=color.white, texture=None, \
    double_sided=False, shader=Entity.default_shader, \
    collision=False, collider=None, scripts=List[], \
    animations=List[], origin=Vec3(0,0,0), position=Vec3(0,0,0), \
    rotation=Vec3(0,0,0),scale=Vec3(0,0,0), **kwargs)

    .. note::

        Many of the properties in this class also have setters.

        .. code-block:: python

            my_entity = Entity()                # create example Entity
            print(my_entity.flipped_faces)      # flipped_faces is a property
            my_entity.flipped_faces = True      # but also has a setter

    .. py:property:: world_position
        :type: Vec3

        Get individual coordinates with :code:`Entity.world_<x|y|z>`

    .. py:property:: x
        :type: float

        x position of the entity

    .. py:property:: y
        :type: float

        y position of the entity

    .. py:property:: z
        :type: float

        z position of the entity

    .. py:property:: X
        :type: int

        prefix for :code:`int(Entity.x)`

    .. py:property:: Y 
        :type: int

        prefix for :code:`int(Entity.y)`

    .. py:property:: Z 
        :type: int

        prefix for :code:`int(Entity.z)`

    .. py:property:: rotation
        :type: Vec3

        Get individual coordinates with :code:`Entity.rotation<x|y|z>`

    .. py:property:: quaternion

Error Logs/Results

No errors but here is a picture of what I see.

Screenshot_20220628_221448

Expected Results

I expected each entry to be on a separate line regardless of the screen width.

Environment Info

KennethNielsen commented 2 years ago

I have the same issue. As a bonus info I can share that I tried to bisect the problem, by installing older versions of the theme, but as far back as 0.2.0 (which is the oldest I could install) I can replicate the faulty behavior. This suggests to me that the bug is brought on by a change elsewhere, which just now reveals a potential bug in the theme.

Environment info:

EDIT: Addition environment information: I should probably also mention, that for my case the pages that showed this behavior were generated by autodoc from docstring written in the Google style and parsed with Napoleon.

ArachnidAbby commented 2 years ago

Thanks for replicating it, Is there anyway to avoid this behavior?

KennethNielsen commented 2 years ago

@spidertyler2005 I'm not associated with the project and I'm afraid I don't have the bandwidth to try and fix it, so for me unfortunately I will wait until someone from the project notices this bug. But, you can probably remove the "Needed: replication" label, that might help for visibility.

nocarryr commented 2 years ago

This might be the source of the issue:

https://github.com/readthedocs/sphinx_rtd_theme/blob/bc73ad84068b4ee7d8ddae7e51f5b767e8fd377b/src/sass/_theme_rst.sass#L472-L475

I'm seeing the same thing on my doc builds. If you use dev-tools to uncheck display: inline-block everything appears normal.

(It will be on the parent container <dl class="py property">)

nocarryr commented 2 years ago

@spidertyler2005 @KennethNielsen

Here's a gist that replicates the issue.

When built, the <dl class="py property"> tags are displayed as inline-block (as they do in the above screenshot).

If built with the last line of conf.py uncommented, the display property is overridden by css and they appear as expected.

(you'll have to do a make clean in between builds)

Note: This is not a fix, it's a hack. Only meant to demonstrate the cause of the issue.

johannes-mueller commented 1 year ago

Having the same issue. Is there a proper fix in sight?

westonplatter commented 1 year ago

Ran into this today.

echoing the previous comment, "Is there a proper fix in sight?"

nocarryr commented 1 year ago

@westonplatter @johannes-mueller Can always just use the css override in my last comment.

If it's not going to be fixed by the maintainers, monkeyhacking is always a viable solution. (As of this comment, the style for ".property" still has display: inline-block; when it should just be display: block;

darkvertex commented 10 months ago

For anybody affected arriving here, a mini guide on monkeypatching this until the PR is hopefully merged someday:

  1. Find your conf.py, ensure it has a html_static_path declaration, for example: html_static_path = ['_static']
  2. Add a new line or extend your existing html_css_files declaration: html_css_files = ["custom.css"]
  3. Go into this _static folder (or whatever you had it configured to.)
  4. Dump in a custom.css file looking like so:
    /*
    Fix for horizontal stacking weirdness in the RTD theme with Python properties:
    https://github.com/readthedocs/sphinx_rtd_theme/issues/1301
    */
    .py.property {
    display: block !important;
    }
  5. make clean + make html and you should be looking good! ✨
whitequark commented 8 months ago

I'm hitting the same issue with sphinx-rtd-theme 2.0.0.