Center the data table group header text vertically + align font-size

[spacegaier]

Breaking change

Proposed change

Vertically center the group header and use the same font size as the sections/panels in the filter for a more consistent look.
Also makes it easier to see / read the group headers when scrolling.

Before:

After:

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

Additional information

• This PR fixes or closes issue: fixes #
• This PR is related to issue or discussion:
• Link to documentation pull request:

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io

[bramkragten]

This is done by design @Madelena

[Madelena]

Groups are for indicating hierarchy within a list, and the font size should either be larger or smaller, but never the same, in order visualize such relationship.

Ideally, list group headers should also be either taller or shorter than a list item, but due to the technical challenge on the frontend, the next best solution is to move the item lower to create an illusion of a shorter header.

[Madelena]

This is done by design @Madelena

Well... The design had taller table group headers. I still prefer that if it's possible. 😬

[bramkragten]

Well... The design had taller table group headers. I still prefer that if it's possible. 😬

It is not, due to virtualisation. So should we close this PR?