Add home assistant logo to sidebar title

[zweckj]

Breaking change

Proposed change

After all the talk about the clicking of the title in the last release stream I was wondering why we aren't using our logo there. Changing that, giving it a more polished look.

Type of change

• [ ] Dependency upgrade
• [ ] Bugfix (non-breaking change which fixes an issue)
• [x] 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

[MindFreeze]

@Madelena

[dcapslock]

I don't believe that any text in image should be shown in Home Assistant Frontend UI. A better method would be to use mdi:home-assistant as an icon, coloured appropriately. e.g. --blue-color or --primary-color. and keeping the current text.

This change will also break any custom Dashboard plugins that set the Sidebar title, like Browser Mod.

[marcinbauer85]

@dcapslock What do you display in your sidebar with those mods?

[dcapslock]

What do you display in your sidebar with those mods?

I was in a role where I was working with multiple Home Assistant setups, so usually I would change the title to be descriptive of the setup. e.g. 'Home', ''Office' etc. Also, this is a feature of Browser Mod, Custom Sidebar etc. so just having an image would break what these custom plugins provide which are no doubt used by many users of those plugins.

[zweckj]

I don't believe that any text in image should be shown in Home Assistant Frontend UI.

We are already using the same logo elsewhere in the UI

A better method would be to use mdi:home-assistant as an icon, coloured appropriately. e.g. --blue-color or --primary-color. and keeping the current text.

This is not a valid option because

• it wouldn't match CI (font/icon is different)
• the HA mdi icon is deprecated

This change will also break any custom Dashboard plugins that set the Sidebar title, like Browser Mod.

Which is a consideration, but we usually don't really consider custom plugins. We could just wrap it in a div though, so users can display:none that later if that's really a concern.

[dcapslock]

We are already using the same logo elsewhere in the UI

Not entireley in the same manner. I searched the code bse and there are two instances with cast, and one in gallery demo for . As noted below, the login page does not use the full brand logo.

This is not a valid option because

Noted. If using the full brand logo in Sidebar, then a task of checking where else it should be carried out as well. That would make for a complete update. e.g. Login just uses an image with no text. authorize.html.template

Which is a consideration, but we usually don't really consider custom plugins.

If the change is adopted then the community will adapt. Taking on board feedback will mean active custom element maintainers can be ahead of such breaking changes and notify the community of impact on those using custom elements.

[matthiasdebaat]

Thanks for the PR @zweckj! We like your idea and we're currently on something similar, yet with a broader design scope. Once the design is finalized, we'll follow up with a new PR. I'll be closing this PR for now.

Thanks again!