only one column is editable at a time editable columns have a different appearance from locked columns any column can be edited by anyone via an edit button columns and rows require confirmation before deletion
415 lines
7.5 KiB
CSS
415 lines
7.5 KiB
CSS
a.github-corner > svg {
|
|
fill: #46E981;
|
|
color: #302B28;
|
|
}
|
|
.table-refresh > svg {
|
|
width: .9em;
|
|
height: .9em;
|
|
fill: #46E981;
|
|
-webkit-transform: translate(0, 15%);
|
|
-moz-transform: translate(0, 15%);
|
|
-o-transform: translate(0, 15%);
|
|
-ms-transform: translate(0, 15%);
|
|
transform: translate(0, 15%);
|
|
}
|
|
/*
|
|
Apparently Chrome fails to render fonts half the time, so we just have to drop
|
|
lato for now :(
|
|
*/
|
|
.lato {
|
|
font-family: lato, Helvetica, sans-serif;
|
|
font-size: 1.02em;
|
|
}
|
|
html {
|
|
font-size: .875em;
|
|
background-color: #302B28;
|
|
color: #fafafa;
|
|
}
|
|
html,
|
|
body {
|
|
font-family: Georgia,Cambria,serif;
|
|
height: 100%;
|
|
}
|
|
body {
|
|
font-size: 1rem;
|
|
font-weight: 400;
|
|
line-height: 2rem;
|
|
}
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
color: #fafafa;
|
|
font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
-webkit-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
|
|
-moz-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
|
|
font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
margin-top: 0;
|
|
}
|
|
h1 {
|
|
line-height: 3rem;
|
|
font-size: 2.05714rem;
|
|
margin-bottom: .21999rem;
|
|
padding-top: .78001rem;
|
|
}
|
|
h2 {
|
|
font-size: 1.95312rem;
|
|
margin-bottom: .18358rem;
|
|
padding-top: .81642rem;
|
|
}
|
|
h2,
|
|
h3 {
|
|
line-height: 3rem;
|
|
}
|
|
h3 {
|
|
font-size: 1.64571rem;
|
|
margin-bottom: .07599rem;
|
|
padding-top: .92401rem;
|
|
}
|
|
h4 {
|
|
font-size: 1.5625rem;
|
|
margin-bottom: .54686rem;
|
|
padding-top: .45314rem;
|
|
}
|
|
h5 {
|
|
font-size: 1.25rem;
|
|
margin-bottom: -0.56251rem;
|
|
padding-top: .56251rem;
|
|
}
|
|
h6 {
|
|
font-size: 1rem;
|
|
margin-bottom: -0.65001rem;
|
|
padding-top: .65001rem;
|
|
}
|
|
a {
|
|
cursor: pointer;
|
|
color: #46E981;
|
|
text-decoration: none;
|
|
}
|
|
a:hover {
|
|
color: #a1f4bf;
|
|
}
|
|
img {
|
|
height: auto;
|
|
max-width: 100%;
|
|
}
|
|
img.cryptofist {
|
|
filter: invert(100%);
|
|
-webkit-filter: invert(100%);
|
|
}
|
|
p {
|
|
padding-top: .66001rem;
|
|
margin-top: 0;
|
|
}
|
|
p,
|
|
pre {
|
|
margin-bottom: 1.33999rem;
|
|
}
|
|
p,
|
|
pre,
|
|
td,
|
|
a,
|
|
table,
|
|
tr {
|
|
font-family: lato, Helvetica, sans-serif;
|
|
font-size: 1.02em;
|
|
}
|
|
#main {
|
|
width: 70vw;
|
|
margin: auto;
|
|
font-size: medium;
|
|
padding-bottom: 1em;
|
|
}
|
|
/* buttons */
|
|
.create,
|
|
.action {
|
|
border: 2px solid #46E981;
|
|
border-radius: 10px;
|
|
background-color: #302B28;
|
|
color: #46E981;
|
|
font-weight: bold;
|
|
font-size: large;
|
|
margin-right: 5px;
|
|
margin-left: 5px;
|
|
}
|
|
.create:hover,
|
|
.action:hover {
|
|
border: 2px solid #a1f4bf;
|
|
color: #46E981;
|
|
}
|
|
.buttons {
|
|
margin-bottom: 50px;
|
|
margin-top: 20px;
|
|
}
|
|
.button {
|
|
padding: 4px 12px 4px 12px;
|
|
border-radius: 5px;
|
|
margin-top: 12px;
|
|
margin-bottom: 12px;
|
|
white-space: nowrap;
|
|
display: inline-block;
|
|
}
|
|
/* Tables */
|
|
table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
margin: 20px;
|
|
}
|
|
tbody {
|
|
border: 2px solid black;
|
|
}
|
|
tbody tr {
|
|
text-align: center;
|
|
}
|
|
tbody tr:first-of-type th {
|
|
font-size: 20px;
|
|
border-top: 0px;
|
|
font-weight: bold;
|
|
padding: 10px;
|
|
text-decoration: underline;
|
|
}
|
|
tbody tr:first-of-type th.table-refresh {
|
|
color: #46E981;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
tbody tr:nth-child(odd) {
|
|
background-color: #685d56;
|
|
}
|
|
tbody tr th:first-of-type {
|
|
border-left: 0px;
|
|
}
|
|
tbody tr th {
|
|
box-sizing: border-box;
|
|
border: 1px solid black;
|
|
}
|
|
tbody tr th,
|
|
tbody tr td {
|
|
color: #fafafa;
|
|
}
|
|
tbody tr th .remove,
|
|
tbody tr td .remove {
|
|
cursor: pointer;
|
|
color: #FF0073;
|
|
}
|
|
tbody tr th:last-child {
|
|
border-right: 0px;
|
|
}
|
|
tbody td {
|
|
border-right: 1px solid black;
|
|
padding: 12px;
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
}
|
|
tbody td:last-child {
|
|
border-right: none;
|
|
}
|
|
/* Bottom Bar */
|
|
.bottom-bar {
|
|
position: fixed;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
height: 4%;
|
|
height: 2.5em;
|
|
display: inline-block;
|
|
width: 100%;
|
|
background: #302B28;
|
|
border-top: 1px solid #444;
|
|
}
|
|
.bottom-bar a {
|
|
color: #46E981;
|
|
text-decoration: none;
|
|
}
|
|
.bottom-bar p {
|
|
margin: -1px;
|
|
font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif;
|
|
font-size: 20px;
|
|
display: block;
|
|
float: left;
|
|
padding-top: 3px;
|
|
color: #fafafa;
|
|
}
|
|
.bottom-bar img {
|
|
margin-right: 4px;
|
|
position: relative;
|
|
}
|
|
.bottom-bar-left {
|
|
display: block;
|
|
float: left;
|
|
padding-left: 10px;
|
|
}
|
|
.bottom-bar-right {
|
|
display: block;
|
|
float: right;
|
|
padding-right: 20px;
|
|
}
|
|
.bottom-bar-center {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 20%;
|
|
}
|
|
.bottom-bar-heart {
|
|
top: 2px;
|
|
}
|
|
.bottom-bar-xwiki {
|
|
top: 3px;
|
|
}
|
|
.bottom-bar-openpaas {
|
|
top: 3px;
|
|
max-width: 100px;
|
|
}
|
|
.bottom-left {
|
|
border-bottom-left-radius: 5px;
|
|
}
|
|
.top-left {
|
|
border-top-left-radius: 5px;
|
|
}
|
|
form.realtime {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
form.realtime > textarea {
|
|
width: 50%;
|
|
height: 15vh;
|
|
}
|
|
form.realtime table {
|
|
border-collapse: collapse;
|
|
}
|
|
form.realtime table tr td {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
form.realtime table tr td div.text-cell {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
height: 100%;
|
|
}
|
|
form.realtime table tr td div.text-cell input {
|
|
width: 90%;
|
|
height: 100%;
|
|
border: 0px;
|
|
}
|
|
form.realtime table tr td.checkbox-cell {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain {
|
|
display: block;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) {
|
|
display: none;
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover {
|
|
font-weight: bold;
|
|
background-color: #FF0073;
|
|
color: #302B28;
|
|
display: block;
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover:after {
|
|
content: "✖";
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes {
|
|
background-color: #46E981;
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.yes:after {
|
|
content: "✔";
|
|
}
|
|
form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"]:not(.editable) ~ .cover.mine {
|
|
display: none;
|
|
}
|
|
form.realtime table input[type="text"] {
|
|
height: 100%;
|
|
width: 80%;
|
|
border: 3px solid #302B28;
|
|
}
|
|
form.realtime table thead tr th .remove {
|
|
color: #FF0073;
|
|
cursor: pointer;
|
|
font-size: 20px;
|
|
}
|
|
form.realtime table thead tr th .edit {
|
|
color: #46E981;
|
|
cursor: pointer;
|
|
width: 10%;
|
|
font-size: 20px;
|
|
}
|
|
form.realtime table thead tr th .edit:after {
|
|
content: '✐';
|
|
}
|
|
form.realtime table thead tr th .edit.editable {
|
|
display: none;
|
|
}
|
|
form.realtime table tfoot tr td {
|
|
z-index: 4000;
|
|
cursor: pointer;
|
|
}
|
|
form.realtime #adduser,
|
|
form.realtime #addoption {
|
|
color: #46E981;
|
|
border: 1px solid #46E981;
|
|
padding: 15px;
|
|
}
|
|
form.realtime #adduser {
|
|
border-top-left-radius: 5px;
|
|
}
|
|
form.realtime #addoption {
|
|
border-bottom-left-radius: 5px;
|
|
}
|
|
div.modal {
|
|
box-sizing: border-box;
|
|
z-index: 9001;
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100vh;
|
|
display: none;
|
|
background-color: #302B28;
|
|
}
|
|
div.modal .center {
|
|
position: relative;
|
|
width: 80%;
|
|
height: 80%;
|
|
margin: auto;
|
|
border: 1px solid #685d56;
|
|
text-align: center;
|
|
}
|
|
div.modal.shown {
|
|
display: block;
|
|
}
|
|
div.modal table {
|
|
margin: 30px;
|
|
border-collapse: collapse;
|
|
}
|
|
div.modal table input {
|
|
height: 100%;
|
|
width: 90%;
|
|
border: 3px solid #302B28;
|
|
}
|
|
div.modal table thead tr th span.remove {
|
|
color: #FF0073;
|
|
cursor: pointer;
|
|
}
|
|
div.modal table tfoot tr td {
|
|
z-index: 4000;
|
|
cursor: pointer;
|
|
}
|
|
div.modal #addtime,
|
|
div.modal #adddate {
|
|
color: #46E981;
|
|
border: 1px solid #46E981;
|
|
padding: 15px;
|
|
}
|
|
div.modal #adddate {
|
|
border-top-left-radius: 5px;
|
|
}
|
|
div.modal #addtime {
|
|
border-bottom-left-radius: 5px;
|
|
}
|