Navigation: fix chrome blur (#28602)
This commit is contained in:
parent
0afa2b90b0
commit
712be97636
4 changed files with 8 additions and 11 deletions
|
|
@ -94,6 +94,7 @@
|
|||
|
||||
--tab-bar-height: 3rem;
|
||||
--tab-bar-background: var(--evcc-background);
|
||||
--evcc-backdrop-blur: blur(20px);
|
||||
}
|
||||
|
||||
:root.dark {
|
||||
|
|
@ -392,8 +393,7 @@ a:hover {
|
|||
|
||||
.modal-backdrop {
|
||||
--bs-backdrop-bg: var(--evcc-backdrop);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
backdrop-filter: blur(8px);
|
||||
backdrop-filter: var(--evcc-backdrop-blur);
|
||||
}
|
||||
|
||||
.modal-backdrop.fade {
|
||||
|
|
|
|||
|
|
@ -98,11 +98,10 @@ export default defineComponent({
|
|||
<style scoped>
|
||||
.bottom-tab-bar {
|
||||
z-index: 1030;
|
||||
background: color-mix(in srgb, var(--tab-bar-background) 80%, transparent);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border-top: 1px solid var(--evcc-gray-10);
|
||||
box-shadow: 0 -1px 6px rgba(0, 0, 0, 0.05);
|
||||
background: color-mix(in srgb, var(--tab-bar-background) 60%, transparent);
|
||||
backdrop-filter: var(--evcc-backdrop-blur);
|
||||
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;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -175,8 +175,7 @@ export default defineComponent({
|
|||
inset: 0;
|
||||
z-index: 1029;
|
||||
background-color: var(--evcc-backdrop);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
backdrop-filter: blur(8px);
|
||||
backdrop-filter: var(--evcc-backdrop-blur);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition:
|
||||
|
|
|
|||
|
|
@ -748,8 +748,7 @@ export default defineComponent({
|
|||
right: 0;
|
||||
top: max(0rem, env(safe-area-inset-top)) !important;
|
||||
margin: 0 calc(calc(1.5rem + var(--vertical-shift)) * -1);
|
||||
-webkit-backdrop-filter: blur(35px);
|
||||
backdrop-filter: blur(35px);
|
||||
backdrop-filter: var(--evcc-backdrop-blur);
|
||||
background-color: #0000;
|
||||
box-shadow: 0 1px 8px 0px var(--evcc-background);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue