不兼容毛玻璃效果的浏览器显示为不透明

_config.yml

@@ -1,11 +1,11 @@
 ############################### Basic Information ###############################
 info:
   name: Volantis
-  version: '2.1.2'
+  version: '2.1.3'
   docs: https://volantis.js.org/
   cdn: # To use CDN, write 'use_cdn: true' in 'blog/_config.yml'.
-    css: https://cdn.jsdelivr.net/gh/xaoxuu/[email protected].2.1/css/style.css
-    js: https://cdn.jsdelivr.net/gh/xaoxuu/[email protected].2/js/app.js
+    css: https://cdn.jsdelivr.net/gh/xaoxuu/[email protected].3/css/style.css
+    js: https://cdn.jsdelivr.net/gh/xaoxuu/[email protected].3/js/app.js
 
 
 ############################### Style ###############################

source/css/_defines/effect.styl

@@ -8,15 +8,11 @@ $boxshadow-float = 0 4px 8px 0px rgba(0, 0, 0, 0.1)
 $textshadow = 0 1px 2px 0px rgba(0, 0, 0, 0.1)
 
 
-
-// blur
-
-// trans
-
-
 .blur
-  background: alpha($color-card, .85) !important
-  backdrop-filter: blur(20px)
+  @supports (backdrop-filter: blur(20px))
+    background: alpha($color-card, .85) !important
+    backdrop-filter: saturate(200%) blur(20px)
+
 
 .shadow
   box-shadow: $boxshadow-card

source/css/_layout/cover.styl

@@ -17,6 +17,7 @@
   .cover-body
     div.b
       margin-top: 8vh
+      margin-bottom: 8vh
   &.half
     margin-bottom: -100px
     max-height: 640px