gergely/cypher-player-assistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(character-sheet): Create the pools

Browse Source
This commit is contained in:
Gergely Polonkai
2025-06-06 16:43:19 +02:00
parent 511a3885ce
commit 6b192a5c21
1 changed files with 63 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
index.html
View File

@@ -185,6 +185,30 @@
#cont-no-loaded {
text-align: center;
}
.pool-container {
display: inline-block;
border-width: 2px;
border-style: solid;
border-color: var(--box-border);
border-radius: 10px;
width: 32%;
padding: .6em;
}
.pool-container:has(> h3 > input[name=pool-selector]:checked) {
border-color: var(--hl-box-border);
}
input[name=pool-selector] {
display: none;
}
.pool-container h4 {
color: var(--hl-box-border);
font-weight: normal;
font-size: 80%;
}
</style>
</head>
<body>
@@ -211,6 +235,45 @@
<strong>Max Effort</strong> <input type="number" id="inp-max-effort" min="1" value="1">
<strong>Armor</strong> <input type="number" id="inp-armor" min="0" value="0">
</div>
<div class="box">
<h2>Pools</h2>
<div class="pool-container">
<h3>
<input id="pool-selector-might" type="radio" name="pool-selector" value="might">
<label for="pool-selector-might">Might</label>
</h3>
<h4>Pool</h4>
<input type="number" id="inp-pool-value-might" min="0" value="0">
/
<input type="number" id="inp-pool-max-might" min="0" value="0">
<h4>Edge</h4>
<input type="number" id="inp-pool-edge-might" min="0" value="0">
</div>
<div class="pool-container">
<h3>
<input id="pool-selector-speed" type="radio" name="pool-selector" value="speed">
<label for="pool-selector-speed">Speed</label>
</h3>
<h4>Pool</h4>
<input type="number" id="inp-pool-value-speed" min="0" value="0">
/
<input type="number" id="inp-pool-max-speed" min="0" value="0">
<h4>Edge</h4>
<input type="number" id="inp-pool-edge-speed" min="0" value="0">
</div>
<div class="pool-container">
<h3>
<input id="pool-selector-intellect" type="radio" name="pool-selector" value="intellect">
<label for="pool-selector-intellect">Intellect</label>
</h3>
<h4>Pool</h4>
<input type="number" id="inp-pool-value-intellect" min="0" value="0">
/
<input type="number" id="inp-pool-max-intellect" min="0" value="0">
<h4>Edge</h4>
<input type="number" id="inp-pool-edge-intellect" min="0" value="0">
</div>
</div>
</div>
</div>
<script>