ui/panels/bossnametag.razor.scss
BossNametag {
position: absolute;
bottom: 25px;
width: 80%;
left: 10%;
right: 10%;
right: 0px;
flex-direction: column;
justify-content: center;
&.invisible {
display: none;
}
.hpbar {
position: relative;
width: 600px;
height: 32px;
background-color: #000a;
align-self: center;
overflow: hidden;
//border-left: 2px solid #fff;
//border-right: 2px solid #fff;
flex-direction: row;
justify-content: center;
gap: 4px;
&.invisible {
display: none;
}
.hpbaroverlay {
background-color: green;
position: absolute;
bottom: 0px;
top: 0px;
left: 0px;
transition: opacity 0.25s linear, background-color 0.25s linear;
&.invisible {
display: none;
}
}
.hpbardelta {
position: absolute;
bottom: 0px;
top: 0px;
left: 0px;
background-color: white;
position: absolute;
align-self: center;
transform-origin: left;
transition: width 0.9s linear;
opacity: 1;
}
}
.label {
position: relative;
color: white;
text-align: center;
//width: 100%;
height: 100%;
font-family: "Mini Pixel-7";
font-weight: bold;
font-size: 26px;
text-stroke: 5px black;
align-items: center;
opacity: 0.7;
}
.hp_label {
position: absolute;
right: 8px;
justify-content: center;
gap: 4px;
height: 100%;
opacity: 0.7;
}
.name_label {
position: absolute;
left: 8px;
height: 100%;
}
}