fix: tabbar 微信浏览器安全适配不生效

demo.html

@@ -4,10 +4,7 @@
     <meta charset="utf-8" />
     <meta content="telephone=no" name="format-detection" />
     <link rel="shortcut icon" href="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png" />
-    <meta
-      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
-      name="viewport"
-    />
+    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover">
     <title>NutUI - 移动端 Vue2、Vue3、小程序 组件库</title>
     <meta http-equiv="Cache-Control" content="no-cache" />
     <meta http-equiv="Pragma" content="no-cache" />

index.html

@@ -4,10 +4,8 @@
     <meta charset="utf-8" />
     <meta content="telephone=no" name="format-detection" />
     <link rel="shortcut icon" href="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png" />
-    <meta
-      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
-      name="viewport"
-    />
+    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover">
+    
     <title>NutUI - 移动端 Vue2、Vue3、小程序 组件库</title>
     <meta name="keywords" content="Vue3组件库,移动端组件库,Vite,Vue组件库,Vue3,Vue2" />
     <meta name="description" content="京东风格的轻量级移动端 Vue 组件库" />

src/packages/__VUE/tabbar/index.scss

@@ -11,14 +11,16 @@
   &:last-child {
     border-right: 0;
   }
+
   &-bottom {
     position: fixed;
     bottom: 0px;
     left: 0px;
     z-index: 888;
   }
+
   &-safebottom {
-    padding-bottom: constant(safe-area-inset-bottom);
-    padding-bottom: env(safe-area-inset-bottom);
+    margin-bottom: constant(safe-area-inset-bottom);
+    margin-bottom: env(safe-area-inset-bottom);
   }
 }