github/karma
1
0
Fork 0
mirror of https://github.com/prymitive/karma synced 2026-05-11 03:46:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): tweak blur levels

Browse Source
This commit is contained in:
Łukasz Mierzwa
2021-05-15 10:06:09 +01:00
committed by Łukasz Mierzwa
parent 173a73bc22
commit d9ef835946
5 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/Styles/Components/FilterInput.scss
View File

@@ -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;
}
}

2
ui/src/Styles/Components/Modal.scss
View File

@@ -12,7 +12,7 @@
}
.modal-content-blur {
filter: saturate(50%) blur(6px);
filter: saturate(50%) blur(12px);
}
@include media-breakpoint-up(lg) {

4
ui/src/Styles/Components/MountModal.scss
View File

@@ -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);

6
ui/src/Styles/Components/NavBar.scss
View File

@@ -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);
}

6
ui/src/Styles/Components/Toast.scss
View File

@@ -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%);
}
}