Home Assistant 2026.8: Hidden Header no longer works after update (Solved)

Configuration Frontend
1

After updating to Home Assistant Core 2026.8, my custom theme stopped hiding the header.

The original theme had been working for several years using:

card-mod-root-yaml:

together with:

  --header-height: 0px;
}```

After the update, the header was still visible and the camera dashboard no longer moved to the top of the screen.

---

## Cause

There were actually two different issues:

1. `card-mod-root-yaml` was no longer applying the CSS correctly in my setup.
2. Home Assistant now reserves the header space using `padding-top` on `hui-view-container#view`.

---

## Working solution

Replacing

```card-mod-root-yaml:```

with

```card-mod-root:```

and adding

```hui-view-container#view {
  padding-top: 0px !important;
}```

restores the old behaviour.

Example:

blue_night:
card-mod-theme: blue_night

card-mod-root: |
hui-view-container#view {
min-height: 100vh !important;
padding-top: 0px !important;
}

.header {
  opacity: 0;
  transition:
    opacity 0.25s ease-in-out,
    transform 0.25s ease-in-out !important;
  transform: translateY(-60%);
  position: fixed;

  {% if user == 'Robert' or user == 'Admin' %}
  display: block;
  {% else %}
  display: none;
  {% endif %}
}

.header .toolbar {
  pointer-events: none;
}

.header:hover {
  opacity: 1;
  transform: translateY(0%);
}

.header:hover .toolbar {
  pointer-events: all;
}```

Another thing I discovered during debugging:

If you use
themes: !include_dir_merge_named themes

do not leave backup files like:
blue_night - copy.yaml

inside the same themes directory.

Home Assistant loads every YAML file from that folder, which may override or merge your active theme and make debugging extremely confusing.

Hopefully this saves someone else several hours of debugging.

Tested with

* Home Assistant Core 2026.8.x
* Home Assistant OS 18.2
* card-mod 4.2.1
* HACS

“card-mod-root-yaml no longer applies the expected root styles after upgrading to Home Assistant Core 2026.8, while card-mod-root continues to work correctly.”

2

I’m not sure what version you upgraded from or what you were using before (your post formatting is messed up and it’s cut off) but I’m pretty sure that it’s been like this for a while, I think I’ve been hiding my header for common displays for 6ish months now and haven’t had to change anything.

I do it slightly differently though and just slide the header up out of the way…

  uix-root: |
    div div.header {
      top: -56px;
    }
    div hui-view-container#view {
      padding-top: 0px;
    }

That said you could likely simplify your implementation using display: none; instead of opacity: 0; which would just remove it altogether from the DOM, no need for all the hover and pointer events nonsense.

  card-mod-root: |
    div div.header {
      display: none;
    }
    div hui-view-container#view {
      padding-top: 0px;
    }
3 
Changes in Home Assistant renaming developer-tools to tools will break card-mod due to yaml theme loading.
4

I guess we’re past ‘drop in replacement’ and into ‘functional replacement’ with UIX over card-mod.