test-nut-ui
Version:
<p align="center"> <img alt="logo" src="https://img11.360buyimg.com/imagetools/jfs/t1/211965/25/7152/22022/61b16785E433119bb/aa41d7a9f7e823f3.png" width="150" style="margin-bottom: 10px;"> </p>
2 lines (1 loc) • 1.16 kB
CSS
.nut-badge{position:relative;display:inline-block}.nut-badge__icon{display:flex;position:absolute;background:var(--nutui-badge-background-color, #FF2C33);top:-20%;right:-20%;padding:var(--nutui-badge-icon-padding, 3px);text-align:center;min-width:16px;border:var(--nutui-badge-border, 0px solid #FF2C33);border-radius:var(--nutui-badge-border-radius, 14px);z-index:var(--nutui-badge-z-index, 1)}.nut-badge__sup{position:absolute;background:var(--nutui-badge-background-color, #FF2C33);color:var(--nutui-badge-color, var(--nsui-white-color-1, #FFFFFF));padding:var(--nutui-badge-padding, 0 4px);font-size:var(--nutui-badge-font-size, var(--nsui-font-size-2, 12px));font-weight:400;text-align:center;line-height:16px;min-width:16px;border:var(--nutui-badge-border, 0px solid #FF2C33);border-radius:var(--nutui-badge-border-radius, 14px)}.nut-badge__content{transform:var(--nutui-badge-content-transform, translateY(-50%) translateX(50%))}.nut-badge__dot{min-width:auto;width:var(--nutui-badge-dot-width, 8px);height:var(--nutui-badge-dot-width, 8px);border:var(--nutui-badge-border, 0px solid #FF2C33);border-radius:var(--nutui-badge-dot-width, 8px);padding:0}