feat(badge): [badge]: Adapting to the SMB theme (#2167)

Author: Youyou-smiles

examples/sites/demos/pc/app/badge/max.vue

@@ -1,11 +1,11 @@
 <template>
-  <template>
+  <div>
     <tiny-badge :value="10" :max="9">最大值显示</tiny-badge>
     <br />
     <tiny-badge value="100" :max="99" data="我的待办"></tiny-badge>
     <br />
     <tiny-badge value="1000" :max="999" data="我的待办"></tiny-badge>
-  </template>
+  </div>
 </template>
 
 <script>

examples/sites/demos/pc/app/badge/type-composition-api.vue

@@ -1,17 +1,18 @@
 <template>
   <div class="badge-demo">
     <tiny-badge :value="2">默认类型</tiny-badge>
-    <tiny-badge :value="2" type="danger">danger 类型</tiny-badge>
-    <tiny-badge :value="2" type="primary">primary 类型</tiny-badge>
     <tiny-badge :value="2" type="success">success 类型</tiny-badge>
     <tiny-badge :value="2" type="warning">warning 类型</tiny-badge>
     <tiny-badge :value="2" type="info">info 类型</tiny-badge>
+    <tiny-badge :value="2" type="danger">danger 类型</tiny-badge>
+    <tiny-badge :value="2" type="primary">primary 类型</tiny-badge>
   </div>
 </template>
 
 <script setup>
 import { Badge as TinyBadge } from '@opentiny/vue'
 </script>
+
 <style scoped>
 .badge-demo .tiny-badge__wrapper {
   margin-bottom: 12px;

examples/sites/demos/pc/app/badge/type.spec.ts

@@ -6,11 +6,11 @@ test('主題样式', async ({ page }) => {
 
   const demo = page.locator('#type')
   const badge = demo.locator('.tiny-badge')
-  const dangerBadge = badge.nth(1)
-  const primaryBadge = badge.nth(2)
-  const successBadge = badge.nth(3)
-  const warningBadge = badge.nth(4)
-  const infoBadge = badge.nth(5)
+  const successBadge = badge.nth(1)
+  const warningBadge = badge.nth(2)
+  const infoBadge = badge.nth(3)
+  const dangerBadge = badge.nth(4)
+  const primaryBadge = badge.nth(5)
 
   await expect(dangerBadge).toHaveClass(/tiny-badge--danger/)
   await expect(dangerBadge).toHaveCSS('background-color', 'rgb(246, 111, 106)')

examples/sites/demos/pc/app/badge/type.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="badge-demo">
     <tiny-badge :value="2">默认类型</tiny-badge>
-    <tiny-badge :value="2" type="danger">danger 类型</tiny-badge>
-    <tiny-badge :value="2" type="primary">primary 类型</tiny-badge>
     <tiny-badge :value="2" type="success">success 类型</tiny-badge>
     <tiny-badge :value="2" type="warning">warning 类型</tiny-badge>
     <tiny-badge :value="2" type="info">info 类型</tiny-badge>
+    <tiny-badge :value="2" type="danger">danger 类型</tiny-badge>
+    <tiny-badge :value="2" type="primary">primary 类型</tiny-badge>
   </div>
 </template>
 
@@ -18,6 +18,7 @@ export default {
   }
 }
 </script>
+
 <style scoped>
 .badge-demo .tiny-badge__wrapper {
   margin-bottom: 12px;