summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMichael Kuhn <[email protected]>2022-01-05 20:42:21 +0100
committerMichael Kuhn <[email protected]>2022-01-05 20:42:21 +0100
commit1ff52bff8120ac9ca98ee1a9f919ae063fd7e82b (patch)
treedb208db47fa6a9f7a2f7a1101ddef36c68f463c8
parent97baf3e8b9be699d972b91a159ccbe0891efe8ae (diff)
themes: Fix incorrect blur and opacity interaction
Chrome sometimes seems to have problems when using a blur backdrop-filter in combination with opacity. On Linux, this often results in the blur being completely ignored. This also seems to apply to other systems, though. See the following issue for more details: https://bugs.chromium.org/p/chromium/issues/detail?id=1129838 Making the background opaque using rgba seems to fix the problem.
-rw-r--r--themes/compact.css3
-rw-r--r--themes/compact_night.css3
-rw-r--r--themes/light-high-contrast.css3
-rw-r--r--themes/light.css3
-rw-r--r--themes/light/cdm.less3
-rw-r--r--themes/night.css3
-rw-r--r--themes/night_blue.css3
7 files changed, 7 insertions, 14 deletions
diff --git a/themes/compact.css b/themes/compact.css
index ccd6ef76c..d462892db 100644
--- a/themes/compact.css
+++ b/themes/compact.css
@@ -1475,8 +1475,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #ddd;
border-bottom-width: 1px;
- background: white ! important;
- opacity: 0.9;
+ background: rgba(255, 255, 255, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
diff --git a/themes/compact_night.css b/themes/compact_night.css
index 6b072e510..8b1cd17bc 100644
--- a/themes/compact_night.css
+++ b/themes/compact_night.css
@@ -1475,8 +1475,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #222;
border-bottom-width: 1px;
- background: #333 ! important;
- opacity: 0.9;
+ background: rgba(51, 51, 51, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
diff --git a/themes/light-high-contrast.css b/themes/light-high-contrast.css
index 18fc67f6a..77f3def7e 100644
--- a/themes/light-high-contrast.css
+++ b/themes/light-high-contrast.css
@@ -1475,8 +1475,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #ddd;
border-bottom-width: 1px;
- background: white ! important;
- opacity: 0.9;
+ background: rgba(255, 255, 255, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
diff --git a/themes/light.css b/themes/light.css
index 475e4dbbf..8367b07cc 100644
--- a/themes/light.css
+++ b/themes/light.css
@@ -1475,8 +1475,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #ddd;
border-bottom-width: 1px;
- background: white ! important;
- opacity: 0.9;
+ background: rgba(255, 255, 255, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
diff --git a/themes/light/cdm.less b/themes/light/cdm.less
index 4cbfa1d28..6bb3378c1 100644
--- a/themes/light/cdm.less
+++ b/themes/light/cdm.less
@@ -325,8 +325,7 @@
box-shadow : 0 1px 1px -1px rgba(0,0,0,0.1);
border: 0 solid @border-default;
border-bottom-width: 1px;
- background : @default-bg ! important;
- opacity: 0.9;
+ background : fade(@default-bg, 90%) ! important;
backdrop-filter: blur(6px);
}
}
diff --git a/themes/night.css b/themes/night.css
index 24288e149..447ca6f7f 100644
--- a/themes/night.css
+++ b/themes/night.css
@@ -1476,8 +1476,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #222;
border-bottom-width: 1px;
- background: #333 ! important;
- opacity: 0.9;
+ background: rgba(51, 51, 51, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
diff --git a/themes/night_blue.css b/themes/night_blue.css
index 209484935..7a6ce2b69 100644
--- a/themes/night_blue.css
+++ b/themes/night_blue.css
@@ -1476,8 +1476,7 @@ body.ttrss_utility hr {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #222;
border-bottom-width: 1px;
- background: #333 ! important;
- opacity: 0.9;
+ background: rgba(51, 51, 51, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {