fix: styles glitches

demo/menu-options.js

@@ -451,7 +451,7 @@ export default function (instance) {
           },
           {
             name: 'Dialog',
-            title: '确认',
+            title: '对话框',
             titleExtra: 'Dialog',
             path: `/${lang}/${theme}/doc` + '/n-dialog'
           },

src/_base/slot-machine/src/SlotMachine.vue

@@ -43,6 +43,10 @@ export default {
     withCssr(styles)
   ],
   props: {
+    theme: {
+      type: String,
+      default: undefined
+    },
     value: {
       type: [Number, String],
       default: 0

src/badge/src/Badge.vue

@@ -24,6 +24,7 @@
       >
         <n-base-slot-machine
           v-if="!dot"
+          :theme="mergedTheme"
           :appeared="appeared"
           :max="max"
           :value="value"

src/button/styles/_common.js

@@ -25,7 +25,7 @@ export default function (base, derived) {
     iconMarginSmall: '6px',
     iconMarginMedium: '6px',
     iconMarginLarge: '6px',
-    iconSizeTiny: '16px',
+    iconSizeTiny: '14px',
     iconSizeSmall: '18px',
     iconSizeMedium: '18px',
     iconSizeLarge: '20px',

src/menu/src/styles/themed-base.cssr.js

@@ -99,8 +99,7 @@ export default c([
           }),
           cE('icon', [
             cB('icon', {
-              fill: itemIconColorCollapsed,
-              stroke: itemIconColorCollapsed
+              color: itemIconColorCollapsed
             })
           ])
         ])
@@ -137,8 +136,7 @@ export default c([
           cB('menu-item-content', [
             cE('icon', [
               cB('icon', {
-                fill: itemIconColorSelected,
-                stroke: itemIconColorSelected
+                color: itemIconColorSelected
               })
             ]),
             cB('menu-item-content-header', {
@@ -195,8 +193,7 @@ export default c([
           ]),
           cE('icon', [
             cB('icon', {
-              fill: itemIconColorChildSelected,
-              stroke: itemIconColorChildSelected
+              color: itemIconColorChildSelected
             })
           ])
         ]),
@@ -205,8 +202,7 @@ export default c([
             hoverStyle(null, [
               cE('icon', [
                 cB('icon', {
-                  fill: itemIconColorHover,
-                  stroke: itemIconColorHover
+                  color: itemIconColorHover
                 })
               ]),
               cB('menu-item-content-header', {

src/pagination/src/Pagination.vue

@@ -67,6 +67,15 @@
         <forward-icon />
       </div>
     </div>
+    <n-select
+      v-if="showSizePicker"
+      size="small"
+      placeholder=""
+      :options="pageSizeOptions"
+      :value="pageSize"
+      :disabled="disabled"
+      @update:value="handleSizePickerChange"
+    />
     <div
       v-if="showQuickJumper"
       class="n-pagination-quick-jumper"
@@ -79,15 +88,6 @@
         @keyup="handleQuickJumperKeyUp"
       />
     </div>
-    <n-select
-      v-if="showSizePicker"
-      size="small"
-      placeholder=""
-      :options="pageSizeOptions"
-      :value="pageSize"
-      :disabled="disabled"
-      @update:value="handleSizePickerChange"
-    />
   </div>
 </template>
 

src/pagination/src/styles/themed-base.cssr.js

@@ -25,10 +25,11 @@ export default c([
         vertical-align: middle;
       `
     }, [
+      c('*:not(:last-child)', {
+        marginRight: '8px'
+      }),
       cB('select', {
-        raw: `
-          width: unset;
-        `
+        width: 'unset'
       }),
       cM('transition-disabled', [
         cB('pagination-item', {
@@ -48,9 +49,7 @@ export default c([
         color: itemTextColor
       }, [
         cB('input', {
-          raw: `
-            margin: 0 8px;
-          `
+          marginLeft: '8px'
         }, [
           cE('placeholder', {
             left: '6px',
@@ -90,11 +89,6 @@ export default c([
         color: itemTextColor,
         fill: itemTextColor
       }, [
-        c('&:not(:last-child)', {
-          raw: `
-            margin-right: 8px;
-          `
-        }),
         cE('more-icon, arrow-icon', {
           raw: `
             position: relative;
@@ -141,7 +135,12 @@ export default c([
           c('&:hover', {
             color: itemTextColorHover
           }, [
-            cM('fast-backward, fast-forward', [
+            cM('backward, forward', {
+              color: itemTextColor
+            }),
+            cM('fast-backward, fast-forward', {
+              color: itemTextColor
+            }, [
               cE('more-icon', {
                 raw: `
                   display: none;

src/steps/src/styles/steps/themed-base.cssr.js

@@ -210,8 +210,7 @@ function statusStyle (props, status) {
           color: props[createKey('indicatorTextColor', status)]
         }),
         cB('icon', {
-          fill: props[createKey('indicatorTextColor', status)],
-          stroke: props[createKey('indicatorTextColor', status)]
+          color: props[createKey('indicatorTextColor', status)]
         })
       ])
     ])