Added attribute rolls
This commit is contained in:
parent
395bfa1616
commit
0abccf3f48
15 changed files with 440 additions and 45 deletions
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue