MediaWiki:Datatables.css: Difference between revisions
From WikiMSK
(Replaced content with ".datatable { display: flex; flex-direction: row; flex-wrap: wrap; } .datatable thead { width: 260px; order: 0; } .datatable thead .sorting { background-positio...") Tag: Replaced |
No edit summary |
||
(5 intermediate revisions by the same user not shown) | |||
Line 8: | Line 8: | ||
order: 0; | order: 0; | ||
} | } | ||
.datatable thead .sorting { | .datatable thead .sorting, table.dataTable thead .sorting_asc { | ||
background-position: 0 50%; | background-position: 0 50%!important; | ||
background-position: center left!important; | |||
} | } | ||
.datatable thead tr { | .datatable thead tr { | ||
Line 50: | Line 51: | ||
flex-basis: 120px; | flex-basis: 120px; | ||
min-width: 120px; | min-width: 120px; | ||
} | |||
#joints thead .sorting, #muscles thead .sorting { | |||
background-position: center left!important; | |||
} | } |
Latest revision as of 20:10, 2 May 2022
.datatable {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.datatable thead {
width: 260px;
order: 0;
}
.datatable thead .sorting, table.dataTable thead .sorting_asc {
background-position: 0 50%!important;
background-position: center left!important;
}
.datatable thead tr {
display: flex;
flex-direction: column;
}
.datatable thead tr th {
border: 0 !important;
}
.datatable tbody {
display: flex;
flex-direction: column;
width: calc(100% - 260px);
order: 1;
}
@media only screen and (max-width: 1000px) {
.datatable tbody {
width: 100%;
}
}
.datatable tbody tr {
display: flex;
flex-direction: column;
width: 100%;
flex: 1;
border: 1px solid #aaa;
padding: 6px;
margin-bottom: 1rem;
}
.datatable td {
padding: 4px 1rem;
display: flex;
gap: 2px;
}
.datatable td:empty {
display: none;
}
.datatable tr td:not(:first-of-type) b {
flex-basis: 120px;
min-width: 120px;
}
#joints thead .sorting, #muscles thead .sorting {
background-position: center left!important;
}