silphius/app/react-components/hotbar.module.css
2024-06-24 08:14:32 -05:00

36 lines
671 B
CSS

.hotbar {
align-self: center;
--border: calc(var(--unit) * 3px);
background-color: rgba(0, 0, 0, 0.2);
border: var(--border) solid #444444;
box-sizing: border-box;
display: inline-block;
line-height: 0;
position: absolute;
top: calc(var(--unit) * 25px);
}
.slotWrapper {
border: var(--border) solid #999999;
box-sizing: border-box;
display: inline-block;
line-height: 0;
padding: 0;
&.active + .slotWrapper {
border-left: none;
}
&:not(:last-child) {
border-right: none;
}
&.active {
border-right: var(--border) solid #999999;
border-color: yellow;
}
&:hover {
background-color: rgba(0, 0, 0, 0.2);
}
}