Theme not changing app notification area

Mobile Apps Home Assistant Companion for Android
1

I have been having an issue with the app notification area not changing colors when a theme is applied.

Screenshot_20191230-140724
Screenshot_20191230-1407241440Ă—3040 188 KB

I used the dark_orange theme in the image above. I also checked to see that the primary dark color is set in the theme. To my understanding, this variable should change the color in the app area.

A few notes: I am using custom header, but this still occurs when it is removed. I set the chrome website to launch like an app. I am also using a Pixel 4 XL. The problem seemed to arise with the new phone. The same issue also appeared on my wife’s Pixel 4. Would it be possible that the new phone is handling this differently and how would this be fixed since the primary dark setting doesn’t seem to adjust the color?

2

Try frontend.set_theme in an automation or from the services tab.

3

Tried that using backed selected theme and also tried manually selecting the theme with the same result. This only started happening after I switched to the new phone with my guess being how pixel 4 (or Android 10) treats the primary dark color in web pages that open as apps but cannot confirm this.

4

Same issue here, any news on this?

5

I’d also love for this color to change based on theme.

6

One thing to bear in mind is that, even if you use frontend.set_theme to set the default theme, this won’t work if the theme has primary-color set via a variable (e.g. if you have something like primary-color: 'var(--text-color)'). It has to be just a colour, something like this:

primary-color '#000000'

This is because the app picks up the colour via the theme-color meta tag, which is not css and so doesn’t translate the variables.

The backend selected theme started working fine for me in the notification bar once I changed the theme to make primary-color use a colour code instead of a variable.

1 Like
7

This not working for me. I changed the primary color in my theme.yaml to #363941 and it is still blue (like in the original theme)

8

This only works currently if you use the frontend.set_theme to set the theme and then have your theme in the UI set to Backend-selected.

You can create an automation to make this easier by setting the theme at startup:

- id: set_theme_on_startup
  alias: Set Theme on Startup
  description: Set theme on startup
  trigger:
  - event: start
    platform: homeassistant
  action:
  - service: frontend.set_theme
    data:
      name: your theme here
1 Like
9

This is working fine. Thank you. One question, is rolled out for all users or only the ones that use the dark theme in the mobile app?

10

Unfortunately, this will change the app notification area colour for all users, regardless of what theme that user has selected since it uses the backend selected theme.

There is a feature request open here to push the users selected theme so the notification bar can get the colour from that, but currently this is the only way to do it.

11

hi, just to help in case someone has the same problem.

my status bar and bottom bar had the color matching the theme since I installed it (years ago), but something happened (new HASS version? new HASS android app version?) and then the status and bottom bars were blue. I went to “app configuration” and set the “theme” option to “follow home assistant”, it was in “light”, I’m not sure if it was always “light” or if something changed it. anyway, setting “follow home assistant” changed the bars to match the theme again.

HTH someone.