UI improvements for JS client
This commit is contained in:
parent
7ee56f97f8
commit
36a4e2a9d1
GPG Key ID:
7234E476BF21C61A
@ -1,44 +1,27 @@
|
||||
<!--
|
||||
pyRCV2: Preferential vote counting
|
||||
Copyright © 2020–2021 Lee Yingtong Li (RunasSudo)
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU Affero General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>pyRCV2</title>
|
||||
<style type="text/css">
|
||||
html, body {
|
||||
font-family: 'Liberation Sans', FreeSans, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
td {
|
||||
padding: 0px 8px;
|
||||
min-height: 1em;
|
||||
}
|
||||
td.count {
|
||||
text-align: right;
|
||||
}
|
||||
tr:first-child td {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
td.excluded {
|
||||
background-color: #fecfcfff;
|
||||
}
|
||||
td.elected {
|
||||
background-color: #d1fca7ff;
|
||||
}
|
||||
tr.info td {
|
||||
background-color: #edededff;
|
||||
}
|
||||
i.sep::after {
|
||||
content: "•";
|
||||
color: #ccc;
|
||||
}
|
||||
.menudiv {
|
||||
margin-bottom: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" />
|
||||
<link rel="stylesheet" type="text/css" href="main.css?v=GITVERSION">
|
||||
</head>
|
||||
<body>
|
||||
<div class="menudiv">
|
||||
@ -121,7 +104,7 @@
|
||||
Round quota to
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundQuota" value="0" style="width: 3em;">
|
||||
<input type="number" id="txtRoundQuota" value="0" min="0" style="width: 3em;">
|
||||
d.p.
|
||||
</label>
|
||||
<i class="sep"></i>
|
||||
@ -130,7 +113,7 @@
|
||||
Round votes to
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundVotes" value="0" style="width: 3em;">
|
||||
<input type="number" id="txtRoundVotes" value="0" min="0" style="width: 3em;">
|
||||
d.p.
|
||||
</label>
|
||||
<i class="sep"></i>
|
||||
@ -139,7 +122,7 @@
|
||||
Round transfer values to
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundTVs" value="0" style="width: 3em;">
|
||||
<input type="number" id="txtRoundTVs" value="0" min="0" style="width: 3em;">
|
||||
d.p.
|
||||
</label>
|
||||
<i class="sep"></i>
|
||||
@ -148,7 +131,7 @@
|
||||
Round ballot weights to
|
||||
</label>
|
||||
<label>
|
||||
<input type="number" id="txtRoundWeights" value="0" style="width: 3em;">
|
||||
<input type="number" id="txtRoundWeights" value="0" min="0" style="width: 3em;">
|
||||
d.p.
|
||||
</label>
|
||||
<br>
|
||||
@ -206,7 +189,7 @@
|
||||
<script src="vendor/BigInt_BigRat-a5f89e2.min.js"></script>
|
||||
<script src="vendor/big-6.0.0.min.js"></script>
|
||||
<script src="vendor/sjcl-1.0.8.min.js"></script>
|
||||
<script src="bundle.js"></script>
|
||||
<script src="index.js"></script>
|
||||
<script src="bundle.js?v=GITVERSION"></script>
|
||||
<script src="index.js?v=GITVERSION"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
127
html/main.css
Normal file
127
html/main.css
Normal file
@ -0,0 +1,127 @@
|
||||
/*
|
||||
pyRCV2: Preferential vote counting
|
||||
Copyright © 2020–2021 Lee Yingtong Li (RunasSudo)
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU Affero General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
html, body {
|
||||
font-family: 'Liberation Sans', FreeSans, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
/* Menu styling */
|
||||
|
||||
i.sep::after {
|
||||
content: "•";
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.menudiv {
|
||||
border-bottom: 1px solid #ccc;
|
||||
line-height: 1.8;
|
||||
margin-bottom: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
||||
/* Count table */
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
td {
|
||||
padding: 0px 8px;
|
||||
min-height: 1em;
|
||||
}
|
||||
td.count {
|
||||
text-align: right;
|
||||
}
|
||||
tr:first-child td {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
td.excluded {
|
||||
background-color: #fecfcfff;
|
||||
}
|
||||
td.elected {
|
||||
background-color: #d1fca7ff;
|
||||
}
|
||||
tr.info td {
|
||||
background-color: #edededff;
|
||||
}
|
||||
|
||||
/* Form styling */
|
||||
/* Adapted in part from https://github.com/nathansmith/formalize (GPL/MIT) */
|
||||
|
||||
select, input, button {
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
select, input[type="text"], input[type="number"] {
|
||||
appearance: none;
|
||||
background-color: #fff;
|
||||
border: 1px solid;
|
||||
border-color: #999 #bbb #ddd;
|
||||
border-radius: 0;
|
||||
box-sizing: border-box;
|
||||
color: #000;
|
||||
padding: 2px 3px;
|
||||
}
|
||||
|
||||
select {
|
||||
/* Dropdown arrow */
|
||||
background-image: url(data:image/png;base64,R0lGODlhDQAEAIAAAAAAAP8A/yH5BAEHAAEALAAAAAANAAQAAAILhA+hG5jMDpxvhgIAOw==);
|
||||
background-position: right center;
|
||||
background-repeat: no-repeat;
|
||||
padding-right: 20px; /* Padding for dropdown arrow */
|
||||
}
|
||||
|
||||
button, input[type="file"]::file-selector-button {
|
||||
background-color: #f0f0f0;
|
||||
border: 1px solid;
|
||||
border-color: #ddd #bbb #999;
|
||||
border-radius: 4px;
|
||||
color: #000;
|
||||
font-family: inherit;
|
||||
padding: 2px 10px;
|
||||
}
|
||||
button:hover, input[type="file"]::file-selector-button:hover {
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
button:active, input[type="file"]::file-selector-button:active {
|
||||
background-color: #dfdfdf;
|
||||
border-color: #999 #bbb #ddd;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
appearance: none;
|
||||
position: relative;
|
||||
width: 0.9em;
|
||||
height: 0.9em;
|
||||
border: 1px solid;
|
||||
border-color: #999 #bbb #ddd;
|
||||
vertical-align: -2px;
|
||||
}
|
||||
input[type="checkbox"]:checked {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABhGlDQ1BJQ0MgcHJvZmlsZQAAKJF9kT1Iw1AUhU9Ti0VaHMwg4pChOlkQFXHUKhShQqgVWnUweekfNGlJUlwcBdeCgz+LVQcXZ10dXAVB8AfEzc1J0UVKvC8ptIjxwuN9nHfP4b37AKFZYbrVMw7ohm2mkwkpm1uVel8RQAhhRCEqzKrNyXIKvvV1T91Ud3Ge5d/3Z0W1vMWAgEQ8y2qmTbxBPL1p1zjvE4uspGjE58RjJl2Q+JHrqsdvnIsuCzxTNDPpeWKRWCp2sdrFrGTqxFPEMU03KF/Ieqxx3uKsV+qsfU/+wkjeWFnmOq1hJLGIJciQoKKOMiqwEafdIMVCms4TPv4h1y+TSyVXGYwcC6hCh+L6wf/g92ytwuSElxRJAKEXx/kYAXp3gVbDcb6PHad1AgSfgSuj4682gZlP0hsdLXYE9G8DF9cdTd0DLneAwaeaYiquFKQlFArA+xl9Uw4YuAX61ry5tc9x+gBkaFapG+DgEBgtUva6z7vD3XP7t6c9vx/h6nJtOtJaHwAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAd0SU1FB+UBBQgnA808S3QAAABpSURBVDjLxZNLEsAgCEPRO3pKuOPrrkXRDtZFs/PzkjGMBUAOVOVQnwzM7FmwKVVFRFBVAOpucmut39xN9ukAcgJ3BuNBBr4NxmKycDDwFzNweIIHMnAo0YMZeDqFVR9pg7eJzFR+/40Xt0cwTrDq4YsAAAAASUVORK5C);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
select:focus, input:focus {
|
||||
border-color: #3daee9;
|
||||
}
|
||||
Reference in New Issue
Block a user