Added coloured pips to UI cooldowns to signify player visibility if not every player has it

This commit is contained in:
WBHarry 2025-09-21 22:21:08 +02:00
parent 89b398c63b
commit 49adeed8c5
3 changed files with 83 additions and 39 deletions

View file

@ -53,43 +53,67 @@
.countdown-container {
display: flex;
gap: 16px;
justify-content: space-between;
&.icon-only {
gap: 8px;
.countdown-content {
justify-content: center;
.countdown-main-container {
.countdown-content {
justify-content: center;
.countdown-tools {
gap: 8px;
.countdown-tools {
gap: 8px;
}
}
}
}
img {
width: 44px;
height: 44px;
border-radius: 6px;
.countdown-main-container {
display: flex;
align-items: center;
gap: 16px;
img {
width: 44px;
height: 44px;
border-radius: 6px;
}
.countdown-content {
height: 44px;
display: flex;
flex-direction: column;
justify-content: space-between;
.countdown-tools {
display: flex;
align-items: center;
gap: 16px;
.progress-tag {
border: 1px solid;
border-radius: 4px;
padding: 2px 4px;
background-color: light-dark(@beige, @dark-blue);
}
}
}
}
.countdown-content {
height: 44px;
display: flex;
flex-direction: column;
justify-content: space-between;
.countdown-access-container {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-rows: min-content;
width: 38px;
gap: 4px;
.countdown-tools {
display: flex;
align-items: center;
gap: 16px;
.progress-tag {
border: 1px solid;
border-radius: 4px;
padding: 2px 4px;
background-color: light-dark(@beige, @dark-blue);
}
.countdown-access {
height: 10px;
width: 10px;
border-radius: 50%;
border: 1px solid light-dark(@dark-blue, @beige-80);
content: '';
}
}
}