fix: performance issues & respect blur option

This commit is contained in:
Insert5StarName 2023-10-19 14:48:31 +02:00
parent 363092d537
commit d6ebbf5721
4 changed files with 2 additions and 8 deletions

View file

@ -139,7 +139,6 @@ onUnmounted(() => {
overflow: clip; overflow: clip;
contain: content; contain: content;
background: color-mix(in srgb, var(--panel) 65%, transparent); background: color-mix(in srgb, var(--panel) 65%, transparent);
backdrop-filter: blur(16px);
&.naked { &.naked {
background: transparent !important; background: transparent !important;
box-shadow: none !important; box-shadow: none !important;
@ -173,7 +172,6 @@ onUnmounted(() => {
z-index: 2; z-index: 2;
line-height: 1.4em; line-height: 1.4em;
background: color-mix(in srgb, var(--panelHeaderBg) 35%, transparent); background: color-mix(in srgb, var(--panelHeaderBg) 35%, transparent);
backdrop-filter: blur(16px);
} }
.title { .title {

View file

@ -57,7 +57,6 @@ defineExpose({
&.noGap { &.noGap {
> .notes { > .notes {
background: color-mix(in srgb, var(--panel) 65%, transparent); background: color-mix(in srgb, var(--panel) 65%, transparent);
backdrop-filter: blur(16px);
} }
} }
@ -67,7 +66,6 @@ defineExpose({
.note { .note {
background: color-mix(in srgb, var(--panel) 65%, transparent); background: color-mix(in srgb, var(--panel) 65%, transparent);
backdrop-filter: blur(16px);
border-radius: var(--radius); border-radius: var(--radius);
} }
} }

View file

@ -367,7 +367,7 @@ onUnmounted(() => {
background-size: cover; background-size: cover;
background-position: center; background-position: center;
pointer-events: none; pointer-events: none;
filter: blur(8px) opacity(0.6); filter: var(--blur, blur(10px)) opacity(0.6);
// Funny CSS schenanigans to make background escape container // Funny CSS schenanigans to make background escape container
left: -100%; left: -100%;
top: -5%; top: -5%;
@ -391,7 +391,6 @@ onUnmounted(() => {
position: relative; position: relative;
overflow: clip; overflow: clip;
background: color-mix(in srgb, var(--panel) 65%, transparent); background: color-mix(in srgb, var(--panel) 65%, transparent);
backdrop-filter: blur(16px);
> .banner-container { > .banner-container {
position: relative; position: relative;
@ -755,7 +754,7 @@ onUnmounted(() => {
margin: calc(var(--margin) / 2) 0; margin: calc(var(--margin) / 2) 0;
padding: calc(var(--margin) / 2) 0; padding: calc(var(--margin) / 2) 0;
background: color-mix(in srgb, var(--bg) 65%, transparent); background: color-mix(in srgb, var(--bg) 65%, transparent);
backdrop-filter: blur(16px); backdrop-filter: var(--blur, blur(15px));
border-radius: 5px; border-radius: 5px;
> button { > button {
border-radius: 5px; border-radius: 5px;

View file

@ -268,7 +268,6 @@ hr {
._panel { ._panel {
background: color-mix(in srgb, var(--panel) 65%, transparent); background: color-mix(in srgb, var(--panel) 65%, transparent);
backdrop-filter: blur(16px);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: clip;
} }