Remove polyfill, add fallback background-color

alexchrysovergis · Aug 3, 2024 · 8e07ff4 · 8e07ff4
1 parent 8e71baf
commit 8e07ff4
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 56 deletions.
diff --git a/docs/dist/css/styles.min.css b/docs/dist/css/styles.min.css
diff --git a/docs/dist/js/scripts.min.js b/docs/dist/js/scripts.min.js
diff --git a/src/js/blur-polyfill.js b/src/js/blur-polyfill.js
diff --git a/src/scss/styles.scss b/src/scss/styles.scss
@@ -274,8 +274,15 @@ h1, h2, h3 {
         background: transparent;
         color: $white;
         backdrop-filter: blur(10px);
+        -webkit-backdrop-filter: blur(10px);
     }
 
+    @supports not (backdrop-filter: blur(10px)) {
+        .cc-nb-main-container, .cc-pc-container {
+            background-color: rgba(18,43,49,.7882352941);
+        }
+      }
+
     #cc-nb-title {
         display: none;
     }
@@ -343,6 +350,14 @@ div.termsfeed-com---pc-dialog {
 
 #termsfeed-com---preferences-center {
     backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+
+    @supports not (backdrop-filter: blur(10px)) {
+        #termsfeed-com---preferences-center {
+            background-color: rgba(18,43,49,.7882352941);
+        }
+      } 
+
     .cc-pc-head, .cc-pc-container, .cc-cp-body-content, .cc-cp-body-content-entry, .cc-cp-body, .cc-cp-foot {
         background: transparent !important;
         font-family: map-get($map: $asty, $key: 'Asty-Book');

diff --git a/src/ts/blur-polyfill.ts b/src/ts/blur-polyfill.ts