Navigation: solid blur fallback (#28755)

This commit is contained in:
Michael Geers 2026-04-02 17:50:48 +02:00 • committed by GitHub
parent 196c56fab7
commit fe5492cba0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 16 additions and 4 deletions

View file

@ -98,13 +98,19 @@ export default defineComponent({
<style scoped>
.bottom-tab-bar {
z-index: 1030;
background: color-mix(in srgb, var(--tab-bar-background) 60%, transparent);
backdrop-filter: var(--evcc-backdrop-blur);
background: var(--tab-bar-background);
border-top: 1px solid var(--evcc-gray-25);
box-shadow: 0 -1px 6px var(--evcc-gray-25);
transition: transform var(--evcc-transition-fast) ease-in;
}
@supports (backdrop-filter: blur(1px)) {
.bottom-tab-bar {
background: color-mix(in srgb, var(--tab-bar-background) 60%, transparent);
backdrop-filter: var(--evcc-backdrop-blur);
}
}
.bottom-tab-bar--hidden {
transform: translateY(100%);
}

View file

@ -748,11 +748,17 @@ export default defineComponent({
right: 0;
top: max(0rem, env(safe-area-inset-top)) !important;
margin: 0 calc(calc(1.5rem + var(--vertical-shift)) * -1);
backdrop-filter: var(--evcc-backdrop-blur);
background-color: #0000;
background-color: var(--evcc-background);
box-shadow: 0 1px 8px 0px var(--evcc-background);
}
@supports (backdrop-filter: blur(1px)) {
.header-outer {
background-color: #0000;
backdrop-filter: var(--evcc-backdrop-blur);
}
}
@media (--sm-and-up) {
.header-outer {
--vertical-shift: calc((100vw - 560px) / 2);