JS UI improvements
Improve display on very narrow displays Add section subheadings
This commit is contained in:
parent
eb19b9dc8b
commit
1316c82c35
@ -43,21 +43,10 @@
|
||||
<a href="https://yingtongli.me/blog/2020/12/24/pyrcv2.html">Information and instructions</a>
|
||||
</div>
|
||||
|
||||
<div id="divAdvancedOptions" class="menudiv cols-12" style="display: none;">
|
||||
<div id="divAdvancedOptions" class="menudiv cols-12 cols-sm-6" style="display: none;">
|
||||
<div class="col-6" style="align-self: start;">
|
||||
<div>
|
||||
<label>
|
||||
Numbers:
|
||||
<select id="selNumbers">
|
||||
<option value="native">Native</option>
|
||||
<option value="rational">Rational</option>
|
||||
<option value="fixed" selected>Fixed</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Decimal places (if Numbers = Fixed):
|
||||
<input type="number" id="txtDP" value="5" style="width: 3em;">
|
||||
</label>
|
||||
<div class="subheading">
|
||||
Method specification:
|
||||
</div>
|
||||
<div>
|
||||
<label>
|
||||
@ -119,6 +108,9 @@
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="subheading">
|
||||
Tie-breaking:
|
||||
</div>
|
||||
<div>
|
||||
<label>
|
||||
Ties:
|
||||
@ -136,6 +128,26 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 cols-12" style="align-self: start;">
|
||||
<div class="col-12 subheading">
|
||||
Numeric representation:
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label>
|
||||
Numbers:
|
||||
<select id="selNumbers">
|
||||
<option value="native">Native</option>
|
||||
<option value="rational">Rational</option>
|
||||
<option value="fixed" selected>Fixed</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Decimal places (if Numbers = Fixed):
|
||||
<input type="number" id="txtDP" value="5" style="width: 3em;">
|
||||
</label>
|
||||
</div>
|
||||
<div class="col-12 subheading">
|
||||
Count optimisations:
|
||||
</div>
|
||||
<label class="col-6">
|
||||
<input type="checkbox" id="chkBulkElection" checked>
|
||||
Bulk election
|
||||
@ -148,10 +160,13 @@
|
||||
<input type="checkbox" id="chkDeferSurpluses">
|
||||
Defer surpluses
|
||||
</label>
|
||||
<div class="col-12 subheading">
|
||||
Rounding:
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<label>
|
||||
<input type="checkbox" id="chkRoundQuota" checked>
|
||||
Round quota to
|
||||
Quota:
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundQuota" value="0" min="0" style="width: 3em;">
|
||||
@ -161,7 +176,7 @@
|
||||
<div class="col-6">
|
||||
<label>
|
||||
<input type="checkbox" id="chkRoundVotes">
|
||||
Round votes to
|
||||
Votes:
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundVotes" value="0" min="0" style="width: 3em;">
|
||||
@ -171,7 +186,7 @@
|
||||
<div class="col-6">
|
||||
<label>
|
||||
<input type="checkbox" id="chkRoundTVs">
|
||||
Round transfer values to
|
||||
Transfer values:
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundTVs" value="0" min="0" style="width: 3em;">
|
||||
@ -181,7 +196,7 @@
|
||||
<div class="col-6">
|
||||
<label>
|
||||
<input type="checkbox" id="chkRoundWeights">
|
||||
Round ballot weights to
|
||||
Ballot weights:
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundWeights" value="0" min="0" style="width: 3em;">
|
||||
|
@ -33,6 +33,11 @@ body {
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.menudiv .subheading {
|
||||
font-size: 0.8em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.cols-12 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(12, 1fr);
|
||||
@ -42,6 +47,12 @@ body {
|
||||
.col-6 { grid-column-end: span 6; }
|
||||
.col-12 { grid-column-end: span 12; }
|
||||
|
||||
@media screen and (max-width: 17.5cm) {
|
||||
.cols-sm-6 {
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
/* Count table */
|
||||
|
||||
table {
|
||||
|
Reference in New Issue
Block a user