perf: backdrop-filter: blur() support Safari browser

XPoet · Nov 9, 2023 · 47732b9 · 47732b9
1 parent 9e10353
commit 47732b9
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 0 deletions.
diff --git a/source/css/layout/article-content.styl b/source/css/layout/article-content.styl
@@ -105,6 +105,7 @@ $spacer-padding = 2rem
         line-height 1.6
         background var(--background-color-1-transparent)
         border-top-right-radius var(--box-border-radius)
+        -webkit-backdrop-filter blur(2px)
         backdrop-filter blur(2px)
       }
 

diff --git a/source/css/layout/page.styl b/source/css/layout/page.styl
@@ -15,11 +15,13 @@ $post-tools-offset = calc((100vw - var(--page-content-max-width) / 2) - 5rem)
     &.is-home {
       .transparent-1 {
         background var(--header-transparent-background-1)
+        -webkit-backdrop-filter blur(var(--header-backdrop-filter-blur))
         backdrop-filter blur(var(--header-backdrop-filter-blur))
       }
 
       .transparent-2 {
         background var(--header-transparent-background-2)
+        -webkit-backdrop-filter blur(calc(var(--header-backdrop-filter-blur) * 1.25))
         backdrop-filter blur(calc(var(--header-backdrop-filter-blur) * 1.25))
       }
     }