mirror/Archipelago
1
0
Fork 1
mirror of https://github.com/ArchipelagoMW/Archipelago.git synced 2026-04-10 08:18:17 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix thead not sticking properly in chromium-based browsers, restore scroll-sync

Browse Source
This commit is contained in:
Chris Wilson
2020-07-25 17:24:23 -04:00
parent 5cd5223ae0
commit 1d22c7fb97
4 changed files with 69 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
WebHostLib/static/tracker.css
View File

@@ -12,21 +12,23 @@
max-height: 425px;
}
#tracker-header-bar{
display: flex;
flex-direction: row;
justify-content: flex-start;
}
#search{
width: 200px;
height: 20px;
margin-bottom: 0.5rem;
}
.table-wrapper table tbody tr:hover{
background-color: #e2eabb;
}
div.dataTables_wrapper.no-footer .dataTables_scrollBody{
border: none;
}
table.dataTable tbody th, table.dataTable tbody td{
table.dataTable tbody td{
padding: 4px 6px;
}
@@ -36,13 +38,27 @@ table.dataTable, table.dataTable.no-footer{
font-size: 1rem;
}
table.dataTable thead{
table.dataTable thead th{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
top: 0;
}
table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc{
background-image: none;
table.dataTable thead th.upper-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 36px;
top: 0;
}
table.dataTable thead th.lower-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 22px;
top: 46px;
}
table.dataTable tbody td{
@@ -68,6 +84,22 @@ img.alttp-sprite {
}
@media all and (max-width: 1700px) {
table.dataTable thead th.upper-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 27px;
top: 0;
}
table.dataTable thead th.lower-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 20px;
top: 37px;
}
table.dataTable, table.dataTable.no-footer{
font-size: 0.8rem;
}
@@ -80,6 +112,22 @@ img.alttp-sprite {
}
@media all and (max-width: 1400px) {
table.dataTable thead th.upper-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 22px;
top: 0;
}
table.dataTable thead th.lower-row{
position: -webkit-sticky;
position: sticky;
background-color: #b0a77d;
height: 19px;
top: 32px;
}
table.dataTable, table.dataTable.no-footer{
font-size: 0.6rem;
}