Closed dreimer1986 closed 2 years ago
I tinkered around a bit more and managed to get this far:
In app-drawer you find :host([persistent]) and a width value in there. When it's active:
when disabling it:
Here my mess I currently have in my theme:
card-mod-root: |
ha-app-layout {
background-size: cover;
}
app-header {
background: var(--ha-card-background) !important;
}
app-toolbar {
background: none !important;
}
card-mod-badge-yaml: |
ha-state-label-badge $ ha-label-badge $: |
.label-badge {
background: var(--ha-card-background) !important;
}
card-mod-sidebar: |
:host {
background: rgba(0, 0, 0, 0.5) !important;
}
:host([persistent]) {
width: 0 !important;
}
:host::before {
background: rgba(0, 0, 0, 0.5) !important;
}
div.menu {
background: var(--ha-card-background) !important;
}
paper-icon-item[role=option], paper-icon-item[aria-role=option] {
background: var(--ha-card-background) !important;
}
.iron-selected paper-icon-item {
background: var(--ha-card-background) !important;
}
Most is completely useless, but I really hoped I could get it to edit the width to 0. Does not work though... What did I do wrong?
Uploaded my status quo here: https://github.com/dreimer1986/yourname_card_mod
Currently I am tinkering with animated backgrounds. In the past I managed to use card-mod in my theme to get the background themed with a image already. But now that I try my luck with "Lovelace Animated Background" I find that the video runs on full screen, but the sidebar is hiding parts of it. Is there any way to make it transparent? I don't know if this is a real feature request, but running through all the CSS values I only managed to get it semi transparent to a white background color. The video still is not there. So maybe it is not possible right now?![Screenshot 2022-04-22 150920](https://user-images.githubusercontent.com/29841368/164741264-92798a62-50fd-42df-a676-81648ca492cd.png)