fix: v15 样式

Author: xiaoyatong

src/packages/tabbar/demos/h5/demo5.tsx

@@ -21,7 +21,7 @@ const Demo = () => {
           active ? (
             <Hi />
           ) : (
-            <Image src="https://storage.360buyimg.com/imgtools/00e365dee3-8fe58f80-0952-11f0-8d73-ab964e6901f9.png" />
+            <Image src="https://storage.360buyimg.com/imgtools/cadd649d79-8de544e0-0a11-11f0-9f55-9901c75f24a0.png" />
           )
         }
         title={(active: boolean) => (active ? '逛' : '')}

src/packages/tabbar/tabbar.scss

@@ -9,7 +9,6 @@
   background: $color-background-overlay;
 
   &-wrap {
-    width: 100%;
     height: $tabbar-height;
     display: flex;
 
@@ -22,6 +21,7 @@
     }
 
     &-horizontal {
+      align-items: center;
       .nut-tabbar-item {
         flex-direction: row;
         justify-content: center;
@@ -33,6 +33,11 @@
           margin: 0 4px 0 6px;
           font-size: 14px;
         }
+        .nut-badge-sup {
+          &::after {
+            border: 0;
+          }
+        }
       }
     }
   }

src/packages/tabbaritem/tabbaritem.scss

@@ -6,8 +6,6 @@
   align-items: center;
   flex: 1;
   padding: 6px 0 2px;
-  text-align: center;
-  text-decoration: none;
   color: $tabbar-inactive-color;
   height: 100%;
 

src/packages/tabbaritem/tabbaritem.taro.tsx

@@ -103,7 +103,7 @@ export const TabbarItem: FunctionComponent<Partial<TaroTabbarItemProps>> = (
   const renderIconAndTitle = () => {
     return (
       <>
-        <Badge size="normal" {...badgeProps}>
+        <Badge size="normal" {...badgeProps} top={3}>
           {renderIcon()}
         </Badge>
         {renderTitleText()}

src/packages/tabbaritem/tabbaritem.tsx

@@ -91,7 +91,7 @@ export const TabbarItem: FunctionComponent<Partial<WebTabbarItemProps>> = (
   const renderIconAndTitle = () => {
     return (
       <>
-        <Badge size="normal" {...badgeProps}>
+        <Badge size="normal" {...badgeProps} top={3}>
           {renderIcon()}
         </Badge>
         {renderTitleText()}