From d9ef835946d82fe2493cef64d68461456914ba3f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Sat, 15 May 2021 10:06:09 +0100
Subject: [PATCH] fix(ui): tweak blur levels

---
 ui/src/Styles/Components/FilterInput.scss | 4 ++--
 ui/src/Styles/Components/Modal.scss       | 2 +-
 ui/src/Styles/Components/MountModal.scss  | 4 ++--
 ui/src/Styles/Components/NavBar.scss      | 6 +++---
 ui/src/Styles/Components/Toast.scss       | 6 +++---
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/ui/src/Styles/Components/FilterInput.scss b/ui/src/Styles/Components/FilterInput.scss
index 7b25842d3..447a6bf3c 100644
--- a/ui/src/Styles/Components/FilterInput.scss
+++ b/ui/src/Styles/Components/FilterInput.scss
@@ -38,10 +38,10 @@ input.components-filterinput-wrapper {
 }
 
 .bg-focused {
-  @supports (backdrop-filter: blur(1px)) {
+  @supports (backdrop-filter: blur(12px)) {
     background-color: rgba($bg-focused, 0.5);
   }
-  @supports not (backdrop-filter: blur(1px)) {
+  @supports not (backdrop-filter: blur(12px)) {
     background-color: $bg-focused;
   }
 }
diff --git a/ui/src/Styles/Components/Modal.scss b/ui/src/Styles/Components/Modal.scss
index 7453a3225..1c1473061 100644
--- a/ui/src/Styles/Components/Modal.scss
+++ b/ui/src/Styles/Components/Modal.scss
@@ -12,7 +12,7 @@
 }
 
 .modal-content-blur {
-  filter: saturate(50%) blur(6px);
+  filter: saturate(50%) blur(12px);
 }
 
 @include media-breakpoint-up(lg) {
diff --git a/ui/src/Styles/Components/MountModal.scss b/ui/src/Styles/Components/MountModal.scss
index e51d19be0..6fdf3e6d5 100644
--- a/ui/src/Styles/Components/MountModal.scss
+++ b/ui/src/Styles/Components/MountModal.scss
@@ -42,12 +42,12 @@ $easing-exit: ease-in;
 .components-animation-backdrop-enter-active {
   background-color: rgba(30, 30, 30, 0.8);
   transition: opacity $duration-bg $easing-exit;
-  backdrop-filter: saturate(50%) blur(6px);
+  backdrop-filter: saturate(50%) blur(12px);
 }
 .components-animation-backdrop-enter-done {
   background-color: rgba(30, 30, 30, 0.8);
   transition: opacity $duration-bg $easing-exit;
-  backdrop-filter: saturate(50%) blur(6px);
+  backdrop-filter: saturate(50%) blur(12px);
 }
 .components-animation-backdrop-exit {
   background-color: rgba(30, 30, 30, 0.8);
diff --git a/ui/src/Styles/Components/NavBar.scss b/ui/src/Styles/Components/NavBar.scss
index d65c4058e..14c99365a 100644
--- a/ui/src/Styles/Components/NavBar.scss
+++ b/ui/src/Styles/Components/NavBar.scss
@@ -1,9 +1,9 @@
 .navbar {
-  @supports (backdrop-filter: blur(1px)) {
+  @supports (backdrop-filter: blur(12px)) {
     background-color: rgba($primary, 0.85);
-    backdrop-filter: saturate(50%) blur(6px);
+    backdrop-filter: saturate(50%) blur(12px);
   }
-  @supports not (backdrop-filter: blur(1px)) {
+  @supports not (backdrop-filter: blur(12px)) {
     background-color: rgba($primary, 0.95);
   }
 
diff --git a/ui/src/Styles/Components/Toast.scss b/ui/src/Styles/Components/Toast.scss
index 598669ae5..ac5e0029f 100644
--- a/ui/src/Styles/Components/Toast.scss
+++ b/ui/src/Styles/Components/Toast.scss
@@ -21,11 +21,11 @@
 }
 
 .bg-toast {
-  @supports (backdrop-filter: blur(1px)) {
+  @supports (backdrop-filter: blur(12px)) {
     background-color: rgba(darken($dark, 5%), 0.85);
-    backdrop-filter: saturate(50%) blur(6px);
+    backdrop-filter: saturate(50%) blur(12px);
   }
-  @supports not (backdrop-filter: blur(1px)) {
+  @supports not (backdrop-filter: blur(12px)) {
     background-color: darken($dark, 5%);
   }
 }