Help with edit themes

gerard33 · February 8, 2019, 9:59pm

It is the midnight theme which I have changed a bit. You can find it on my Github.

gerard33/home-assistant-archive/blob/master/themes/midnight-th3me.yaml

midnight-th3me:
  # https://gist.github.com/kalkih/0c7f865855f0f0e2f6d6610c4637cd5d
  # Main colors
  primary-color: '#2980b9'
  accent-color: '#e4ca57' # '#f1c40f'
  accent-strong-color: '#f1c40f'
  dark-primary-color: 'var(--accent-color)'
  light-primary-color: 'var(--accent-color)'

  # Text colors
  primary-text-color: '#ffffff'
  text-primary-color: 'var(--primary-text-color)'
  secondary-text-color: 'var(--accent-color)'
  disabled-text-color: '#b3b3b3' # '#e5e5e5'
  label-badge-border-color: 'green'

  # Sidebar
  sidebar-icon-color: 'var(--primary-text-color)'
  sidebar-selected-icon-color: 'var(--accent-strong-color)'
  sidebar-selected-background-color: 'rgba(255, 255, 255, .1)'

This file has been truncated. show original

kethoth · February 9, 2019, 3:33am

My apologies for the delayed response, I just had time to set down at a PC and inspect that text.

That text does not currently have styles/themes applied to it. I’ve submitted an issue on github related to this.

Eduardo.Alvarez · February 11, 2019, 5:38pm

Hi everyone can you help me finding the element to change this objects colors?

kethoth · February 11, 2019, 7:24pm

That would be --sidebar-icon-color:

Eduardo.Alvarez · February 11, 2019, 7:42pm

Thank you a lot

pepeEL · February 12, 2019, 8:31pm

ANd you found solution how change black text ?

kethoth · February 12, 2019, 8:34pm

Hey Pepe, it’s not possible at the moment. That text does not appear to have any theme-controlled CSS applied. There’s an issue on hassio github to have it fixed, but no movement on it yet.

pepeEL · February 12, 2019, 8:51pm

ok thanks

kethoth · February 12, 2019, 9:37pm

I’ve found where this is applied in the source and have submitted a PR to hopefully resolve this in an upcoming release.

https://github.com/home-assistant/home-assistant-polymer/pull/2739

gerard33 · February 21, 2019, 10:21pm

The PR is merged but in HA 0.88 the text is still black on my dark theme (cleared cache) where primary-text-color is white. Is it working for you?

kethoth · February 21, 2019, 11:00pm

It was merged into dev, not sure when the cutoff was for 0.88. I assume we’ll see it in 0.89, unless it’s included in any subversions before then.

gerard33 · February 21, 2019, 11:17pm

Okay, thanks. I will keep an eye on it.

Jer78 · March 10, 2019, 7:46pm

Is there a place that documents all the elements and what they change? It’s really hard making a theme by trial and error.

kethoth · March 11, 2019, 2:37am

There’s an effort to gather that information.

kethoth · March 11, 2019, 2:38am

I was just informed that the Frontend for Hassio is built separately from the home-assistant version updates, and hasn’t been updated in a while. The system text fix should be in when ever they get around to updating it.

niconath · April 26, 2020, 9:46am

Good morning, everybody,

I’d like to try to create a theme, but first of all, I want to integrate a wallpaper, so I started with the but the image doesn’t appear, an idea?

In which folder should I put my image and what code should I put please?

I tried this but it doesn’t work.

Thanks to you

Nico-test:

# Background image lovelace-background: 'center / cover no-repeat url("/local/ng.jpg") fixed'

mrand · April 27, 2020, 3:56pm

/local refers to the www directory (would have been nice if they’d used that instead of local), or reversed it and called the directory local rather than www).

niconath · April 27, 2020, 5:28pm

Okay, great. Thanks a lot. Now it’s working perfectly

niconath · April 27, 2020, 5:35pm

How do I apply the same theme to the top bar?

mirekmal · April 27, 2020, 8:50pm

Anyone knows how to change the color af ‘selected selection’ in sidebar? sidebar-selected-background-color: changes the color of line highlight as it is is moved with keyboard, but befor actual selection happens (bottom selection at on screenshot below). Actual selection seems to be somehow hardcoded (or was changed recently and none of themes I tried is considering this yet), so in every theme it seems to be some sort of transparrent blueish (upper selection on screenshot).
Screenshot 2020-04-27 at 22.45.09