Added attribute rolls

This commit is contained in:
Sebastian Fischlmayr 2022-09-30 15:15:24 +02:00
parent 395bfa1616
commit 0abccf3f48
Signed by: Maverick
GPG key ID: 6379E413924A4E77
15 changed files with 440 additions and 45 deletions

View file

@ -1,8 +1,13 @@
.healthWrapper {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
> {
h3 {
color: #aaaaee;
}
.healthContainer {
display: grid;
grid-template-columns: repeat(3, auto);
@ -13,33 +18,36 @@
* {
margin: -1px;
}
/* TODO: Refactor to use Labels !!!! */
label {
&.healthTrackerBox {
cursor: pointer;
order: 1;
background-color: red;
background-image: url(https://upload.wikimedia.org/wikipedia/commons/5/5f/Red_X.svg);
background-color: #444444;
background-size: 90%;
background-position: center;
background-repeat: no-repeat;
z-index: 1;
position: relative;
border: 2px solid #550000;
border-radius: 0px;
appearance: none;
width: 6rem;
height: 6rem;
width: 3.5rem;
height: 3.5rem;
border-radius: 3px;
padding: 0px;
&.reset {
order: 2;
background-color: brown;
}
&:after {
> span {
position: absolute;
content: "-1";
top: 2px;
right: 4px;
display: none;
}
}
}
@ -49,11 +57,20 @@
position: absolute;
opacity: 0;
z-index: 0;
> span {
display: block;
}
}
& ~ .healthTrackerBox {
order: 3;
background-color: #444444;
background-image: none;
> span {
display: block;
}
}
}
}