Add overflow and stun damage tracks and include it functionality.

This commit is contained in:
Sebastian Fischlmayr 2022-10-26 15:16:33 +02:00
parent 05a0feab52
commit f600faf50e
Signed by: Maverick
GPG key ID: 6379E413924A4E77
6 changed files with 258 additions and 45 deletions

View file

@ -2,7 +2,7 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
display: block;
}
.repcontainer[data-groupname="repeating_physicaltracker"] {
.repcontainer[data-groupname="repeating_physicaltracker"], .repcontainer[data-groupname="repeating_stuntracker"], .repcontainer[data-groupname="repeating_overflowtracker"] {
grid-template-columns: repeat(3, auto);
justify-content: start;
justify-items: center;
@ -10,11 +10,11 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
display: grid;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > * {
.repcontainer[data-groupname="repeating_physicaltracker"] > *, .repcontainer[data-groupname="repeating_stuntracker"] > *, .repcontainer[data-groupname="repeating_overflowtracker"] > * {
margin: -1px;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
@ -23,11 +23,11 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
height: fit-content;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > .itemcontrol {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > .itemcontrol, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > .itemcontrol, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > .itemcontrol {
display: none !important;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > button > span.woundModDisplay {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > button > span.woundModDisplay, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > button > span.woundModDisplay, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > button > span.woundModDisplay {
content: "-1";
color: #bfbdba;
position: absolute;
@ -35,7 +35,7 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
right: 4px;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > button {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > button, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > button, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > button {
-webkit-appearance: none;
appearance: none;
width: 3.5rem;
@ -49,11 +49,11 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
position: relative;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > div {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > div, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > div, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > div {
pointer-events: none;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > div {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > div, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > div, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > div {
height: 100%;
width: 100%;
background-image: url("https://upload.wikimedia.org/wikipedia/commons/5/5f/Red_X.svg");
@ -62,14 +62,22 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
background-size: 100%;
}
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > span.woundModDisplay {
.repcontainer[data-groupname="repeating_physicaltracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > span.woundModDisplay, .repcontainer[data-groupname="repeating_stuntracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > span.woundModDisplay, .repcontainer[data-groupname="repeating_overflowtracker"] > .repitem > input[type="hidden"][name="attr_isCrossed"][value="true"] ~ button > span.woundModDisplay {
display: none;
}
.repcontrol[data-groupname="repeating_physicaltracker"] {
.repcontrol[data-groupname="repeating_physicaltracker"], .repcontrol[data-groupname="repeating_stuntracker"], .repcontrol[data-groupname="repeating_overflowtracker"] {
display: none !important;
}
.healthTrackerGrid {
grid-template-columns: repeat(3, auto);
justify-content: space-around;
align-items: start;
justify-items: center;
display: grid;
}
.attr-rolls {
width: 100%;
}
@ -125,6 +133,11 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
margin-bottom: 40px;
}
:root {
--mainBackgroundColor: #500;
--mainTextColor: #aae;
}
.sheetform {
height: 100%;
padding: 0;
@ -180,6 +193,11 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
text-align: center;
}
.sheetform .charactersheet button[type="action"].interact-button {
color: var(--mainTextColor);
padding: 2px 8px;
}
.sheetform .charactersheet input {
color: #aae;
background-color: #444;