Adding padding to a grid-card-item adds it to the sd-col div and not to sd-card div

[jorisvandenbossche]

Describe the problem

I am basically trying something like:

.. grid:: 1 2 2 2

    .. grid-item-card::  Title
        :padding: 2

with the idea to add padding to the cards itself (so inner padding inside the card). But it adds the sd-p-3 class to the outer sd-col div, and not to the sd-card div:

...
<div class="sd-col sd-d-flex-row sd-p-3 docutils">
<div class="sd-card sd-sphinx-override sd-w-100 sd-shadow-sm docutils">
....
</div>
</div>
...

I personally would have expected it to add it to the sd-card div. But if this was intentional behaviour, is there another way to add padding to the card?

Link to your repository or website

No response

Steps to reproduce

(see snippet above)

The version of Python you're using

No response

Your operating system

No response

Versions of your packages

No response

Additional context

No response

[welcome]

Thanks for opening your first issue here! Engagement like this is essential for open source projects! 🤗

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! 🎉

[chrisjsewell]

Heya, yeh as you can see in

sphinx-design/sphinx_design/grids.py

Line 234 in 9226a12

def run(self) -> List[nodes.Node]:

,
columns, margin, padding and class-item are set on the grid item, and the rest is passed through to the card.

But if this was intentional behaviour

Yes it is intentional, although could re-consider if people thought the other way was more intuitive

is there another way to add padding to the card?

grid-item-card is a shortcut for using a card (with width: 100%) inside a grid-item, so you can always use that for added control:

.. grid:: 1 2 2 2

    .. grid-item::

        .. card::  Title
            :width: 100%
            :padding: 2

[jorisvandenbossche]

Thanks for the quick response!

It seems that "padding" is an unknown option for card (it's also not listed at https://sphinx-design.readthedocs.io/en/furo-theme/cards.html#card-options)

OK, I see now that it was intentional, and it are indeed the classes listed at https://sphinx-design.readthedocs.io/en/furo-theme/grids.html#grid-item-card-options which are at set on the grid-item (it might be useful to mention it there explicitly in the docs).
But specifically for padding, I am wondering a bit what the use case can be to want to set specifically a padding on the grid-item. Since it's just a parent div with no other content, does it matter in practice if you set margin or padding? Is being able to set both useful? (genuine questions, as I am a CSS noob :))