Change Category Divider Background

[SdeJaen]

Hi people

I find the dividers nice but visually confusing, as there is no difference between the title and the content/automation/whatever. So it would be great to darken the background of the separator a bit. This will create a more visual appealing ui, having a better ui sections.

Thanks

[Sir_Goodenough ((SG) WhatAreWeFixing.Today)]

Great Idea ,
If you think it’s a good idea, you should vote for it. I did …
Suggested Reading:
More about Feature Requests.

[Ildar_Gabdullin]

If anyone really needs this:

customElements.whenDefined('ha-data-table').then(() => {
  const Table = customElements.get('ha-data-table');
  const { html, css } = Table.prototype;
  
  const newStyle = css`
  .mdc-data-table__cell.group-header {background-color: var(--primary-background-color);}`;
  
  const newStyles = [].concat(Table.styles, newStyle);
  Object.defineProperty(Table, 'styles',        {value: newStyles, configurable: true, enumerable: false});
  Object.defineProperty(Table, 'elementStyles', {value: newStyles, configurable: true, enumerable: false});
});

Just set any color if you do not like it.

Change background for collapsible rows in data tables

[Ildar_Gabdullin]

Can be closed as solved by PR in 2024.11.