improve tables

This commit is contained in:
Dennis Eichhorn 2020-02-29 20:54:48 +01:00
parent c5536fdf17
commit e0d586a4e0
2 changed files with 24 additions and 42 deletions

View File

@ -4304,20 +4304,20 @@ table .sort-asc, table .sort-desc, table .filter {
cursor: pointer; } cursor: pointer; }
table.default { table.default {
box-sizing: border-box; border-radius: 4px;
width: 100%; width: 100%;
font-size: 0.9em;
max-width: 100%; max-width: 100%;
overflow: hidden; } font-size: 0.9em;
box-sizing: border-box;
overflow-x: auto; }
table.default caption { table.default caption {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 400; font-weight: 400;
border-bottom: 1px solid var(--box-border); border-bottom: 1px solid var(--box-border);
background: var(--table-caption-background); background: var(--table-caption-background);
padding: .5rem; padding: .5rem;
border-right: 1px solid var(--box-border); border-top-left-radius: 4px;
border-left: 1px solid var(--box-border); border-top-right-radius: 4px;
border-top: 1px solid var(--box-border);
text-align: left; text-align: left;
height: 3rem; } height: 3rem; }
table.default caption i { table.default caption i {
@ -4325,29 +4325,23 @@ table.default {
table.default td { table.default td {
padding: 5px 10px 5px 10px; padding: 5px 10px 5px 10px;
white-space: nowrap; } white-space: nowrap; }
table.default tbody td:first-child, table.default tbody th:first-child {
border-left: 1px solid var(--box-border); }
table.default tbody td:last-child, table.default tbody th:last-child {
border-right: 1px solid var(--box-border); }
table.default tbody tr { table.default tbody tr {
height: 3rem; } height: 3rem; }
table.default tbody tr:nth-of-type(2n) { table.default tbody tr:nth-of-type(2n) td {
background: var(--table-row-background); } background: var(--table-row-background); }
table.default tbody tr:nth-of-type(2n+1) { table.default tbody tr:nth-of-type(2n+1) td {
background: var(--table-row-background-alt); } background: var(--table-row-background-alt); }
table.default tbody tr:hover { table.default tbody tr:hover td {
background: var(--table-row-background-hover); } background: var(--table-row-background-hover); }
table.default tbody tr td, table.default tbody tr th { table.default tbody tr td, table.default tbody tr th {
border-bottom: 1px solid var(--box-border); } border-bottom: 1px solid var(--box-border); }
table.default tbody tr:last-child td, table.default tbody tr:last-child th {
border: none; }
table.default tbody th { table.default tbody th {
background: var(--table-head-background); } background: var(--table-head-background); }
table.default thead { table.default thead {
height: 3rem; height: 3rem;
background: var(--table-head-background); } background: var(--table-head-background); }
table.default thead td:first-child {
border-left: 1px solid var(--box-border); }
table.default thead td:last-child {
border-right: 1px solid var(--box-border); }
table.default thead td { table.default thead td {
border-bottom: 1px solid var(--box-border); } border-bottom: 1px solid var(--box-border); }
table.default .empty { table.default .empty {

View File

@ -20,11 +20,12 @@ table .sort-asc, table .sort-desc, table .filter {
} }
table.default { table.default {
box-sizing: border-box; border-radius: 4px;
width: 100%; width: 100%;
font-size: 0.9em;
max-width: 100%; max-width: 100%;
overflow: hidden; font-size: 0.9em;
box-sizing: border-box;
overflow-x: auto;
caption { caption {
font-size: 1.5rem; font-size: 1.5rem;
@ -33,9 +34,8 @@ table.default {
background: var(--table-caption-background); background: var(--table-caption-background);
padding: .5rem; padding: .5rem;
border-right: 1px solid var(--box-border); border-top-left-radius: 4px;
border-left: 1px solid var(--box-border); border-top-right-radius: 4px;
border-top: 1px solid var(--box-border);
text-align: left; text-align: left;
@ -52,32 +52,28 @@ table.default {
} }
tbody { tbody {
td:first-child, th:first-child {
border-left: 1px solid var(--box-border);
}
td:last-child, th:last-child {
border-right: 1px solid var(--box-border);
}
tr { tr {
height: 3rem; height: 3rem;
&:nth-of-type(2n) { &:nth-of-type(2n) td {
background: var(--table-row-background); background: var(--table-row-background);
} }
&:nth-of-type(2n+1) { &:nth-of-type(2n+1) td {
background: var(--table-row-background-alt); background: var(--table-row-background-alt);
} }
&:hover { &:hover td {
background: var(--table-row-background-hover); background: var(--table-row-background-hover);
} }
td, th { td, th {
border-bottom: 1px solid var(--box-border); border-bottom: 1px solid var(--box-border);
} }
&:last-child td, &:last-child th {
border: none;
}
} }
th { th {
@ -89,14 +85,6 @@ table.default {
height: 3rem; height: 3rem;
background: var(--table-head-background); background: var(--table-head-background);
td:first-child {
border-left: 1px solid var(--box-border);
}
td:last-child {
border-right: 1px solid var(--box-border);
}
td { td {
border-bottom: 1px solid var(--box-border); border-bottom: 1px solid var(--box-border);
} }