mirror of
https://github.com/chylex/Lightning-Tracker.git
synced 2024-11-25 07:42:55 +01:00
296 lines
5.2 KiB
CSS
296 lines
5.2 KiB
CSS
table {
|
|
width: 100%;
|
|
border: 1px solid #073e61;
|
|
border-radius: 5px;
|
|
border-spacing: 0;
|
|
font-size: 15px;
|
|
}
|
|
|
|
thead, tfoot, details.filtering > summary {
|
|
color: #ffffff;
|
|
background: linear-gradient(#0c6ba6, #0a5e91);
|
|
text-align: left;
|
|
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
|
|
}
|
|
|
|
thead {
|
|
box-shadow: 0 1px 0 0 #000;
|
|
}
|
|
|
|
tbody > tr {
|
|
height: 44px;
|
|
}
|
|
|
|
tbody > tr:first-child,
|
|
tbody > tr:last-child {
|
|
height: 45px;
|
|
}
|
|
|
|
tbody > tr:nth-child(2n) {
|
|
background: #f2f2f2;
|
|
}
|
|
|
|
tfoot {
|
|
box-shadow: 0 -1px 0 0 #000;
|
|
}
|
|
|
|
tfoot td {
|
|
padding: 7px 11px 7px 5px;
|
|
}
|
|
|
|
th, td {
|
|
padding: 10px 18px 9px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
th a,
|
|
th a:visited {
|
|
color: #ffffff;
|
|
text-decoration: none;
|
|
}
|
|
|
|
th span.sort {
|
|
display: inline-block;
|
|
width: 15px;
|
|
height: 15px;
|
|
vertical-align: -10%;
|
|
filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.5));
|
|
}
|
|
|
|
th span.sort.sort-default {
|
|
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8,2.2l5,5l-10,0l5,-5Z'/%3E%3Cpath d='M8,14.5l-5,-5l10,0l-5,5Z'/%3E%3C/svg%3E%0A") no-repeat;
|
|
}
|
|
|
|
th span.sort.sort-asc {
|
|
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8,5.7l5,5l-10,-0l5,-5Z'/%3E%3C/svg%3E%0A") no-repeat;
|
|
}
|
|
|
|
th span.sort.sort-desc {
|
|
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8,11.3l-5,-5l10,0l-5,5Z'/%3E%3C/svg%3E%0A") no-repeat;
|
|
}
|
|
|
|
tr.link > td {
|
|
padding: 0;
|
|
}
|
|
|
|
tr.link > td > a {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
margin: -3px 0; /* work around link not filling cell height, all vertical padding is bumped up by 3px */
|
|
padding: 13px 18px 12px;
|
|
color: #000000;
|
|
text-decoration: none;
|
|
}
|
|
|
|
tr.link:hover, tr.link.active {
|
|
background-color: #d2e1ea;
|
|
}
|
|
|
|
tbody > tr:first-child:not(.link) > td {
|
|
padding-top: 11px;
|
|
}
|
|
|
|
tbody > tr:first-child.link > td > a {
|
|
padding-top: 14px;
|
|
}
|
|
|
|
tbody > tr:last-child:not(.link) > td {
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
tbody > tr:last-child.link > td > a {
|
|
padding-bottom: 13px;
|
|
}
|
|
|
|
th.collapsed,
|
|
td.collapsed,
|
|
tr.link > td.collapsed > a {
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
tr:not(.link) th:first-child,
|
|
tr:not(.link) td:first-child,
|
|
tr.link > td:first-child > a {
|
|
padding-left: 16px;
|
|
}
|
|
|
|
tr:not(.link) th:last-child,
|
|
tr:not(.link) td:last-child,
|
|
tr.link > td:last-child > a {
|
|
padding-right: 16px;
|
|
}
|
|
|
|
td.center {
|
|
text-align: center;
|
|
}
|
|
|
|
td.right {
|
|
text-align: right;
|
|
}
|
|
|
|
td.bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
td .icon {
|
|
font-size: 20px;
|
|
vertical-align: -5%;
|
|
}
|
|
|
|
td .icon.faded {
|
|
color: #444444;
|
|
}
|
|
|
|
td button.icon + button.icon {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
td button.icon.flush-left {
|
|
margin-left: 1px;
|
|
}
|
|
|
|
td form {
|
|
display: inline;
|
|
}
|
|
|
|
details.filtering {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
details[open].filtering .hide-if-open,
|
|
details:not([open]).filtering .show-if-open {
|
|
display: none;
|
|
}
|
|
|
|
details[open].filtering .show-if-open,
|
|
details:not([open]).filtering .hide-if-open {
|
|
display: inline;
|
|
}
|
|
|
|
details.filtering > summary {
|
|
border: 1px solid #073e61;
|
|
border-radius: 5px;
|
|
font-size: 15px;
|
|
font-weight: bold;
|
|
padding: 9px 12px 8px;
|
|
box-shadow: 0 1px 0 0 #000;
|
|
cursor: pointer;
|
|
list-style: none;
|
|
}
|
|
|
|
details.filtering > summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
details.filtering > summary .icon {
|
|
margin-right: 4px;
|
|
font-size: 13px;
|
|
}
|
|
|
|
details.filtering > article {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin: -3px 2px 27px !important;
|
|
}
|
|
|
|
details.filtering > article > div {
|
|
flex: 0 1 100%;
|
|
max-width: 225px;
|
|
max-height: 50px;
|
|
margin: 20px 8px 0;
|
|
font-size: 15px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
details.filtering > article > div.buttons {
|
|
flex: 0 0 auto;
|
|
align-self: flex-end;
|
|
margin: 15px 8px 0;
|
|
}
|
|
|
|
details.filtering > article > div.buttons button.styled {
|
|
margin: 0 3px 0 0;
|
|
padding: 3px 7px 4px 8px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
details.filtering > article > div.buttons button.styled .icon {
|
|
margin: 0;
|
|
}
|
|
|
|
details.filtering > article label {
|
|
display: block;
|
|
}
|
|
|
|
details.filtering > article input[type="text"] {
|
|
padding: 4px 7px;
|
|
}
|
|
|
|
details.filtering > article input[type="checkbox"] + label {
|
|
display: inline;
|
|
}
|
|
|
|
details.filtering details.multiselect > article {
|
|
width: 225px;
|
|
}
|
|
|
|
div.pagination {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
font-size: 15px;
|
|
margin-bottom: -7px;
|
|
}
|
|
|
|
div.pagination ul.pages {
|
|
margin: 0 0 7px -4px;
|
|
padding: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
div.pagination ul.pages li {
|
|
display: inline-block;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
div.pagination ul.pages li a {
|
|
display: inline-block;
|
|
padding: 0 6px;
|
|
width: 100%;
|
|
color: #ffffff;
|
|
opacity: 0.6;
|
|
text-decoration: none;
|
|
text-shadow: 1px 1px 1px #000000, 1px 1px 0 #000000;
|
|
}
|
|
|
|
div.pagination ul.pages li a:hover,
|
|
div.pagination ul.pages li.active a {
|
|
opacity: 1;
|
|
text-shadow: 1px 1px 1px #000000;
|
|
}
|
|
|
|
div.pagination ul.pages li:first-child a {
|
|
padding: 0 4px 0 4px;
|
|
}
|
|
|
|
div.pagination ul.pages li:last-child a {
|
|
padding: 0 0 0 6px;
|
|
}
|
|
|
|
div.pagination ul.pages li .icon {
|
|
font-size: 14px;
|
|
vertical-align: -5%;
|
|
}
|
|
|
|
div.pagination .element-info {
|
|
flex: 1 0 auto;
|
|
margin: 0 0 7px 25px;
|
|
text-align: right;
|
|
font-weight: bold;
|
|
}
|