白色主题
This commit is contained in:
@@ -17,7 +17,7 @@ let Badge = class Badge extends SuperComponent {
|
||||
this.options = {
|
||||
multipleSlots: true,
|
||||
};
|
||||
this.externalClasses = [`${prefix}-class`, `${prefix}-class-count`, `${prefix}-class-content`];
|
||||
this.externalClasses = ['class', `${prefix}-class`, `${prefix}-class-count`, `${prefix}-class-content`];
|
||||
this.properties = props;
|
||||
this.data = {
|
||||
prefix,
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<wxs src="./badge.wxs" module="this" />
|
||||
|
||||
<view
|
||||
style="{{ customStyle }}"
|
||||
class="{{this.getBadgeOuterClass({shape})}} {{prefix}}-class"
|
||||
style="{{ style }}"
|
||||
class="{{this.getBadgeOuterClass({shape})}} class {{prefix}}-class"
|
||||
aria-labelledby="{{labelID}}"
|
||||
aria-describedby="{{descriptionID}}"
|
||||
aria-role="{{ ariaRole || 'option'}}"
|
||||
|
||||
@@ -72,7 +72,7 @@
|
||||
width: 0;
|
||||
height: 0;
|
||||
bottom: 0;
|
||||
left: calc(-1 * var(--td-badge-basic-height, 32rpx));
|
||||
left: calc(-1 * var(--td-badge-basic-height, 32rpx) + 1rpx);
|
||||
border-bottom: var(--td-badge-basic-height, 32rpx) solid var(--td-badge-bg-color, var(--td-error-color, var(--td-error-color-6, #e34d59)));
|
||||
border-left: var(--td-badge-basic-height, 32rpx) solid transparent;
|
||||
}
|
||||
@@ -82,7 +82,7 @@
|
||||
width: 0;
|
||||
height: 0;
|
||||
bottom: 0;
|
||||
right: calc(-1 * var(--td-badge-basic-height, 32rpx));
|
||||
right: calc(-1 * var(--td-badge-basic-height, 32rpx) + 1rpx);
|
||||
border-bottom: var(--td-badge-basic-height, 32rpx) solid var(--td-badge-bg-color, var(--td-error-color, var(--td-error-color-6, #e34d59)));
|
||||
border-right: var(--td-badge-basic-height, 32rpx) solid transparent;
|
||||
}
|
||||
@@ -91,12 +91,13 @@
|
||||
}
|
||||
.t-badge--large {
|
||||
font-size: var(--td-badge-large-font-size, var(--td-font-size-s, 24rpx));
|
||||
height: var(--td-badge-large-height, 36rpx);
|
||||
line-height: var(--td-badge-large-height, 36rpx);
|
||||
height: var(--td-badge-large-height, 40rpx);
|
||||
min-width: var(--td-badge-large-height, 40rpx);
|
||||
line-height: var(--td-badge-large-height, 40rpx);
|
||||
padding: 0 var(--td-badge-large-padding, 10rpx);
|
||||
}
|
||||
.t-badge--large.t-badge--circle {
|
||||
border-radius: calc(var(--td-badge-large-height, 36rpx) / 2);
|
||||
border-radius: calc(var(--td-badge-large-height, 40rpx) / 2);
|
||||
}
|
||||
.t-badge__content:not(:empty) + .t-has-count {
|
||||
transform: translate(50%, -50%);
|
||||
@@ -104,3 +105,7 @@
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.t-badge__content-text {
|
||||
display: block;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ const props = {
|
||||
type: null,
|
||||
value: 0,
|
||||
},
|
||||
customStyle: {
|
||||
style: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
|
||||
@@ -11,7 +11,7 @@ export interface TdBadgeProps {
|
||||
type: null;
|
||||
value?: string | number;
|
||||
};
|
||||
customStyle?: {
|
||||
style?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user