修复tab组件，在小尺寸下，不垂直居中的问题，并添加xs，更小的尺寸

duanyong · Jan 24, 2022 · 480eaae · 480eaae
1 parent 1398df5
commit 480eaae
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/mp-cu/colorUI/components/ui-tag/ui-tag.scss b/mp-cu/colorUI/components/ui-tag/ui-tag.scss
@@ -1,6 +1,6 @@
 @import '../../scss/var';
 .ui-tag {
-    font-size: .85714286em;
+    font-size: calc(28rpx + var(--textSize));
     vertical-align: middle;
     position: relative;
     display: inline-flex;
@@ -10,8 +10,13 @@
     padding: .5833em .833em;
     white-space: nowrap;
     border-radius: $radius;
-    //line-height: 1;
+    line-height: initial;
     margin: 0 .14286em;
+	&.xs {
+		transform: scale(0.7);
+		padding: .2em .5em;
+		margin: 0;
+	}
     &.sm {
         transform: scale(0.8);
         margin: 0 0.02em 0 0;
@@ -27,6 +32,7 @@
     }
     &.img {
         padding: .5833em .833em .5833em .5em;
+		line-height: 1;
         .tag-img {
             margin: -.5833em .5em -.5833em -.5em;
             width: 2.5666em;
@@ -42,9 +48,10 @@
         font-size: 2em;
         top: 0;
         right: 0;
+		line-height: 1;
+		padding: 0.4em 0.6em 0.3em;
         transform: scale(0.3) translateX(0.5em) translatey(-0.6em);
         transform-origin: 100% 0;
-        padding: 0.4em 0.6em 0.3em;
         &.badge-br{
             top: auto;
             bottom: 0;

diff --git a/pages/document/tag/tag.wxml b/pages/document/tag/tag.wxml
@@ -14,6 +14,7 @@
 
         <ui-title title="标签大小" depth="2" isIcon/>
         <view class="p-3 ui-BG radius border">
+			<ui-tag ui="xs" info="xs"/>
             <ui-tag ui="sm" info="sm"/>
             <ui-tag ui="" info="df"/>
             <ui-tag ui="lg" info="lg"/>