bemuse/src/app/ui/MusicListItemChart.scss
@use 'sass:math';
@import '~bemuse/ui/common';
.MusicListItemChart {
$size: 2rem;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: $size;
height: $size;
border: 1px solid rgba(#000, 0.3);
border-radius: math.div($size, 5);
font-size: 1rem;
color: rgba(#000, 0.6);
text-align: center;
&.is-played {
background: rgba(#000, 0.3);
color: white;
border-color: transparent;
}
&.is-grade {
font-weight: bold;
}
&.is-selected {
box-shadow: inset 0 0 0.4rem rgba(white, 0.5);
border-width: 2px;
}
}