Themes not displaying what it used to after last update

Hi,

I am using the “midnight” theme which can be found here.
Everything was fine, however after the last update my dashboard is showing white background instead of the dark gray color (#434954).

How can I get it to display gray instead of white?

midnight:
  accent-color: "#E45E65"
  card-background-color: "var(--primary-background-color)"
  dark-primary-color: "var(--accent-color)"
  disabled-text-color: "#7F848E"
  divider-color: "rgba(0, 0, 0, .12)"
  google-blue-500: "#4285f4"
  google-green-500: "#39E949"
  google-red-500: "#E45E65"
  google-yellow-500: "#f4b400"
  ha-card-background: "#434954"
  label-badge-background-color: "#2E333A"
  label-badge-blue: "#039be5"
  label-badge-border-color: "green"
  label-badge-green: "#0DA035"
  label-badge-grey: "var(--paper-grey-500)"
  label-badge-red: "var(--accent-color)"
  label-badge-text-color: "var(--primary-text-color)"
  label-badge-yellow: "#f4b400"
  light-primary-color: "var(--accent-color)"
  markdown-code-background-color: "var(--paper-listbox-background-color)"
  paper-card-header-color: "var(--accent-color)"
  paper-dialog-background-color: "#434954"
  paper-grey-200: "#414A59"
  paper-grey-50: "var(--primary-text-color)"
  paper-grey-500: "#9e9e9e"
  paper-item-icon_-_color: "green"
  paper-item-icon-active-color: "#F9C536"
  paper-item-icon-color: "var(--primary-text-color)"
  paper-item-selected_-_background-color: "#434954"
  paper-listbox-background-color: "#2E333A"
  paper-listbox-color: "var(--primary-color)"
  paper-slider-active-color: "var(--accent-color)"
  paper-slider-container-color: "linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat"
  paper-slider-disabled-active-color: "var(--disabled-text-color)"
  paper-slider-disabled-secondary-color: "var(--disabled-text-color)"
  paper-slider-knob-color: "var(--accent-color)"
  paper-slider-knob-start-color: "var(--accent-color)"
  paper-slider-pin-color: "var(--accent-color)"
  paper-slider-secondary-color: "var(--secondary-background-color)"
  paper-tabs-selection-bar-color: "green"
  paper-toggle-button-checked-bar-color: "var(--accent-color)"
  paper-toggle-button-checked-button-color: "var(--accent-color)"
  paper-toggle-button-checked-ink-color: "var(--accent-color)"
  paper-toggle-button-unchecked-bar-color: "var(--disabled-text-color)"
  paper-toggle-button-unchecked-button-color: "var(--disabled-text-color)"
  paper-toggle-button-unchecked-ink-color: "var(--disabled-text-color)"
  primary-background-color: "#383C45"
  primary-color: "#5294E2"
  primary-text-color: "#FFFFFF"
  secondary-background-color: "#383C45"
  secondary-text-color: "#5294E2"
  sidebar-background-color: "var(--paper-listbox-background-color)"
  sidebar-icon-color: "rgba(255, 255, 255, 0.70)"
  sidebar-selected-icon-color: "var(--primary-color)"
  sidebar-selected-text-color: "var(--primary-text-color)"
  sidebar-text-color: "var(--primary-text-color)"
  slider-bar-color: "var(--disabled-text-color)"
  slider-color: "var(--primary-color)"
  slider-secondary-color: "var(--light-primary-color)"
  st-mode-active-background: "var(--dark-primary-color)"
  st-mode-background: "var(--primary-background-color)"
  state-icon-active-color: "#FDD835"
  state-icon-color: "#44739e"
  state-icon-unavailable-color: "var(--disabled-text-color)"
  switch-checked-color: "var(--paper-toggle-button-checked-button-color)"
  switch-unchecked-button-color: "var(--disabled-text-color)"
  switch-unchecked-color: "var(--disabled-text-color)"
  switch-unchecked-track-color: "var(--disabled-text-color)"
  table-row-alternative-background-color: "#3E424B"
  table-row-background-color: "#353840"
  text-primary-color: "var(--primary-text-color)"
  toggle-button-color: "var(--primary-color)"

bump. any ideas?

a few versions back this var changed to primary-background-color

So what is the solution for this? I’m also using midnight theme and have the same problem.

I checked and I do have primary-background color set like this:

primary-background-color: “#383C45

but still the background is white.

clear your cache after making the change

I didn’t have to do any change. My midnight.yaml already had this.

This was working in 0.115.0, and the white background started showing up when I upgraded to 0.116.2.

To double check, I logged in using another browser (also in private window mode) and still see the same issue.

it’s possible the attribute changed again. I’m not on 0.116 on my home system, only my dev box is greater than 0.115.

just verified it’s --primary-background-color