bd
/
ui
2
0
Fork 0
Code Issues Pull Requests Wiki Activity

优化badge样式

master
yutent 2023-11-17 10:14:45 +08:00
parent 0ca65b2576
commit 6a75f89e4a
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/badge/index.js
View File

@ -37,14 +37,13 @@ class Badge extends Component {
.dot { .dot {
position: absolute; position: absolute;
z-index: 9; z-index: 9;
left: calc(100% - 9px); left: calc(100% - 5px);
top: -8px; top: -6px;
display: inline-flex; display: inline-flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
min-width: 14px; min-width: 10px;
height: 14px; min-height: 10px;
padding: 0 4px;
border-radius: 10px; border-radius: 10px;
background: var(--color-red-1); background: var(--color-red-1);
-webkit-user-select: none; -webkit-user-select: none;
@ -52,12 +51,18 @@ class Badge extends Component {
} }
.num { .num {
padding: 1px 3px;
line-height: 12px; line-height: 12px;
font-size: 12px; font-size: 12px;
font-style: normal; font-style: normal;
text-align: center;
white-space: nowrap; white-space: nowrap;
font-family: Tahoma, Verdana, Helvetica, Arial, sans-serif; font-family: Tahoma, Verdana, Helvetica, Arial, sans-serif;
color: #fff; color: #fff;
&:not(:empty) {
min-width: 14px;
}
} }
:host([hidden-value]) .dot { :host([hidden-value]) .dot {