chore: establish V1.1 recovery baseline
This commit is contained in:
@@ -0,0 +1,16 @@
|
||||
/**
|
||||
* StatusBadge 状态徽标(规范 §22 / §107 STATUS_BADGE 映射)
|
||||
*
|
||||
* 用统一的 kind 控制色彩语义:success / warning / danger / info / disabled
|
||||
* 用法:
|
||||
* <ui-status-badge kind="success" label="已实名" />
|
||||
* <ui-status-badge kind="warning" label="审核中" />
|
||||
*/
|
||||
Component({
|
||||
options: { addGlobalClass: true },
|
||||
properties: {
|
||||
kind: { type: String, value: 'info' }, // success|warning|danger|info|disabled
|
||||
label: { type: String, value: '' },
|
||||
icon: { type: Boolean, value: false }, // 是否显示前缀圆点
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
<view class="ui-badge ui-badge--{{kind}}">
|
||||
<view wx:if="{{icon}}" class="ui-badge__dot"></view>
|
||||
<text class="ui-badge__label">{{label}}</text>
|
||||
</view>
|
||||
@@ -0,0 +1,40 @@
|
||||
.ui-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4rpx 14rpx;
|
||||
border-radius: var(--radius-full);
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: var(--font-weight-medium);
|
||||
line-height: 1.4;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.ui-badge__dot {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 50%;
|
||||
background: currentColor;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
.ui-badge__label {
|
||||
font-size: inherit;
|
||||
}
|
||||
.ui-badge--success {
|
||||
background: var(--color-success-light);
|
||||
color: var(--color-success);
|
||||
}
|
||||
.ui-badge--warning {
|
||||
background: var(--color-warning-light);
|
||||
color: var(--color-warning);
|
||||
}
|
||||
.ui-badge--danger {
|
||||
background: var(--color-danger-light);
|
||||
color: var(--color-danger);
|
||||
}
|
||||
.ui-badge--info {
|
||||
background: var(--color-info-light);
|
||||
color: var(--color-info);
|
||||
}
|
||||
.ui-badge--disabled {
|
||||
background: var(--color-bg-disabled);
|
||||
color: var(--color-text-disabled);
|
||||
}
|
||||
Reference in New Issue
Block a user