Add css var for header webkit backdrop filter (#20473)

* Add CSS var for header -webkit-backdrop-filter

* Add backdrop to energy and developer tools
This commit is contained in:
Bruno Pantaleão Gonçalves 2024-04-10 11:40:44 +02:00 committed by GitHub
parent bf176ac314
commit 7556ab9506
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 6 additions and 0 deletions

View File

@ -131,6 +131,8 @@ class PanelDeveloperTools extends LitElement {
padding-top: env(safe-area-inset-top);
color: var(--app-header-text-color, white);
border-bottom: var(--app-header-border-bottom, none);
-webkit-backdrop-filter: var(--app-header-backdrop-filter, none);
backdrop-filter: var(--app-header-backdrop-filter, none);
}
.toolbar {
height: var(--header-height);

View File

@ -363,6 +363,8 @@ class PanelEnergy extends LitElement {
transition: box-shadow 200ms linear;
display: flex;
flex-direction: row;
-webkit-backdrop-filter: var(--app-header-backdrop-filter, none);
backdrop-filter: var(--app-header-backdrop-filter, none);
}
:host([scrolled]) .header {
box-shadow: var(

View File

@ -908,6 +908,8 @@ class HUIRoot extends LitElement {
position: fixed;
top: 0;
width: var(--mdc-top-app-bar-width, 100%);
-webkit-backdrop-filter: var(--app-header-backdrop-filter, none);
backdrop-filter: var(--app-header-backdrop-filter, none);
padding-top: env(safe-area-inset-top);
z-index: 4;
transition: box-shadow 200ms linear;