ui/bloodcounter.razor.scss
BloodCounter
{
position: absolute;
width: 100%;
height: 100%;
pointer-events: none;
font-family: Poppins;
}
.blood
{
position: absolute;
top: 36px;
width: 100%;
flex-direction: column;
align-items: center;
transform-origin: 50% 0%;
.title
{
font-size: 16px;
font-weight: 800;
font-style: italic;
letter-spacing: 6px;
color: #ffd9d9;
text-shadow: 0 2px 6px rgba( 0, 0, 0, 0.6 );
}
.amount
{
flex-direction: row;
align-items: flex-end;
}
.number
{
font-size: 58px;
font-weight: 900;
font-style: italic;
color: #c0101c;
text-stroke-width: 6px;
text-stroke-color: #2a0206;
text-shadow: 0 4px 10px rgba( 0, 0, 0, 0.55 );
}
.unit
{
font-size: 26px;
font-weight: 800;
font-style: italic;
margin-left: 6px;
margin-bottom: 10px;
color: #c0101c;
text-stroke-width: 4px;
text-stroke-color: #2a0206;
}
.best
{
margin-top: 2px;
font-size: 18px;
font-weight: 900;
font-style: italic;
letter-spacing: 3px;
color: #fff3b0;
text-stroke-width: 4px;
text-stroke-color: #4a2a7a;
}
}