OpenTally/html/main.css

267 lines
6.2 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/*
pyRCV2: Preferential vote counting
Copyright © 20202021 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/>.
*/
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
html, body {
font-family: 'Source Sans Pro', sans-serif;
}
body {
padding: 0.5em;
}
a {
color: #1d46c4;
text-decoration: none;
}
a:hover {
color: #1d3da2;
text-decoration: underline;
}
/* Menu styling */
.menudiv {
border-bottom: 1px solid #ccc;
line-height: 1.8;
margin-bottom: 0.5em;
padding-bottom: 0.5em;
}
.menudiv .subheading {
font-size: 0.8em;
font-weight: bold;
}
.cols-12 {
display: grid;
grid-template-columns: repeat(12, 1fr);
}
.col-3 { grid-column-end: span 3; }
.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 {
border-collapse: collapse;
color-adjust: exact;
-webkit-print-color-adjust: exact;
}
.result td {
padding: 0px 8px;
height: 1em;
}
td.count {
text-align: right;
}
td.count sup {
font-size: 0.6rem;
top: 0;
}
tr.stage-no td, tr.stage-kind td, tr.stage-comment td {
text-align: center;
}
tr.stage-kind td {
font-size: 0.75em;
min-width: 5rem;
color: #1b2839;
background-color: #f0f5fb;
}
td.excluded {
background-color: #fde2e2;
}
td.elected {
background-color: #e0fdc5;
}
tr.info td {
background-color: #f0f5fb;
}
tr.stage-no td:not(:empty), tr.transfers td {
border-top: 1px solid #76858c;
}
tr.info:last-child td, .bb {
border-bottom: 1px solid #76858c;
}
/* Table stripes */
tr.stage-no td:nth-child(even):not([rowspan]),
tr.stage-comment td:nth-child(odd),
tr.candidate.transfers td:nth-child(even):not(.elected):not(.excluded),
tr.candidate.votes td:nth-child(odd):not(.elected):not(.excluded) {
background-color: #f9f9f9;
}
tr.candidate.transfers td.elected:nth-child(even),
tr.candidate.votes td.elected:nth-child(odd) {
background-color: #e0f7ca;
}
tr.candidate.transfers td.excluded:nth-child(even),
tr.candidate.votes td.excluded:nth-child(odd) {
background-color: #fbdfdf;
}
tr.info.stage-kind td:nth-child(odd),
tr.info.transfers td:nth-child(even),
tr.info.votes td:nth-child(odd) {
background-color: #e8eef7;
}
/* BLT input tool */
#selBallots {
min-width: 10em;
margin-right: 1em;
}
#bltMain {
display: flex;
}
#tblBallot {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
#tblBallot input {
margin-right: 0.5ex;
}
#divEditCandidates div {
margin-bottom: 0.5em;
}
#txtCandidates {
min-width: 20em;
min-height: 10em;
}
/* Print stylesheet */
#printWarning {
display: none;
}
#printContainer > div:first-child > p:first-child {
margin-top: 0;
}
@media print {
#divUI {
display: none !important;
}
#printWarning {
display: block;
}
}
/* 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"], textarea {
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"]::-webkit-file-upload-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"]::-webkit-file-upload-button:hover {
background-color: #eaeaea;
}
button:active, input[type="file"]::-webkit-file-upload-button:active {
background-color: #dfdfdf;
border-color: #999 #bbb #ddd;
}
/* Chrome can't parse this and ignores the entire rule */
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: #f5f5f5;
}
button:active, input[type="file"]::file-selector-button:active {
background-color: #eaeaea;
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;
}
button:focus, select:focus, input:focus, textarea:focus {
outline: 0;
}
select:focus, input:focus, textarea:focus {
border-color: #3daee9;
}
label {
white-space: nowrap;
}