fix: some icon releated style and move button margin

README.md

@@ -71,8 +71,8 @@ Vue.use(naiveUi)
 |Radio|😍|||
 |Tab|🚧|||
 |Breadcrumb|🚧|||
-|Badge|🚧|||
-|Steps|🚧|||
+|Badge|😍|||
+|Steps|😍|||
 |Tag|🚧|||
 |Divider|🚧|||
 |Statistic|🚧|||

demo/readme.js

@@ -190,13 +190,13 @@ Vue.use(naiveUi)
 </tr>
 <tr>
 <td>Badge</td>
-<td style="text-align:center;">🚧</td>
+<td style="text-align:center;">😍</td>
 <td style="text-align:center;"></td>
 <td></td>
 </tr>
 <tr>
 <td>Steps</td>
-<td style="text-align:center;">🚧</td>
+<td style="text-align:center;">😍</td>
 <td style="text-align:center;"></td>
 <td></td>
 </tr>

index.js

@@ -39,6 +39,7 @@ import Scrollbar from './packages/common/Scrollbar'
 import Steps from './packages/common/Steps'
 import Confirm from './packages/common/Confirm'
 import Badge from './packages/common/Badge'
+import Tag from './packages/common/Tag'
 
 function install (Vue) {
   Card.install(Vue)
@@ -82,6 +83,7 @@ function install (Vue) {
   Confirm.install(Vue)
   Progress.install(Vue)
   Badge.install(Vue)
+  Tag.install(Vue)
 }
 
 export default {

styles/Badge.scss

@@ -17,23 +17,22 @@
   }
   &.n-badge--success-type {
     .n-badge-sup {
-      color: rgba(75, 81, 106, 1);
-      background-color: rgba(99, 226, 183, 1);
+      background-color: rgba(9, 133, 91, 1);
     }
   }
   &.n-badge--info-type {
     .n-badge-sup {
-      background-color: rgba(98, 187, 252, 1);
+      background-color: rgba(56, 137, 197, 1);
     }
   }
   &.n-badge--warning-type {
     .n-badge-sup {
-      background-color: rgba(255, 138, 0, 1);
+      background-color: rgba(216, 94, 0, 1);
     }
   }
   &.n-badge--error-type {
     .n-badge-sup {
-      background-color: rgba(255, 146, 164, 1);
+      background-color: rgba(210, 82, 129, 1);
     }
   }
 }
@@ -44,7 +43,7 @@
   height: 18px;
   line-height: 18px;
   border-radius: 9px;
-  background-color: rgba(237, 73, 99, 1);
+  background-color: rgba(186, 45, 67, 1);
   padding: 0 6px;
   text-align: center;
   font-size: 12px;

styles/Button.scss

@@ -9,7 +9,6 @@
   cursor: pointer;
   user-select: none;
   font-weight: 700;
-  margin: $button-margin;
   text-align: center;
   .n-button__icon {
     margin-right: 2px;

styles/Icon.scss

@@ -7,7 +7,7 @@
   text-align: center;
   display: inline-block;
   position: relative;
-  vertical-align: middle;
+  vertical-align: bottom;
   &::before {
     line-height: 1em;
     width: 1em;

styles/Input.scss

@@ -18,6 +18,7 @@
   }
   .n-input__icon {
     position: absolute;
+    line-height: 18px;
     height: 18px;
     width: 18px;
     i {

styles/index.scss

@@ -29,6 +29,7 @@
 @import './Steps.scss';
 @import './Progress.scss';
 @import './Badge.scss';
+@import './Tag.scss';
 
 @import "./NimbusServiceLayout.scss";
 @import "./Popover.scss";