@jdcfe/yep-react
Version:
一套移动端的React组件库
52 lines • 1.18 kB
CSS
@charset "UTF-8";
.Yep-badge {
position: relative;
display: inline-block;
line-height: 1;
vertical-align: middle;
}
.Yep-badge-text {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: absolute;
top: -12px;
height: 36px;
line-height: 36px;
min-width: 36px;
border-radius: 24px;
padding: 0 10px;
text-align: center;
font-size: 24px;
color: #ffffff;
background-color: #ed2945;
white-space: nowrap;
transform: translateX(-45%);
transform-origin: -10% center;
z-index: 10;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", SimSun, sans-serif;
}
.Yep-badge-text a {
color: #ffffff;
}
.Yep-badge-text p {
margin: 0;
padding: 0;
}
.Yep-badge-dot {
position: absolute;
transform: translateX(-50%);
transform-origin: 0 center;
top: -8px;
height: 16px;
width: 16px;
border-radius: 100%;
background: #ed2945;
z-index: 10;
}
.Yep-badge-not-a-wrapper .Yep-badge-text, .Yep-badge-not-a-wrapper .Yep-badge-dot {
top: auto;
display: block;
position: relative;
transform: translateX(0);
}