diff --git a/WebHostLib/static/tablepage.css b/WebHostLib/static/tablepage.css index 79fc2247..da81621c 100644 --- a/WebHostLib/static/tablepage.css +++ b/WebHostLib/static/tablepage.css @@ -14,6 +14,10 @@ table.dataTable, table.dataTable.no-footer{ text-align: left; } +table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc{ + background-image: none; +} + table.dataTable thead{ background-color: #b0a77d; } @@ -26,3 +30,7 @@ table.dataTable thead tr th{ table.dataTable tbody tr{ background-color: inherit; } + +table.dataTable tbody tr:hover{ + background-color: #e2eabb; +} diff --git a/WebHostLib/static/tracker.css b/WebHostLib/static/tracker.css index 5a1798fa..3ea8ae02 100644 --- a/WebHostLib/static/tracker.css +++ b/WebHostLib/static/tracker.css @@ -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; } diff --git a/WebHostLib/static/tracker.js b/WebHostLib/static/tracker.js index cdf10cde..8720aaf1 100644 --- a/WebHostLib/static/tracker.js +++ b/WebHostLib/static/tracker.js @@ -40,7 +40,7 @@ window.addEventListener('load', () => { window.addEventListener('resize', () => tables.draw()); - $(".dataTables_scrollBody").scrollsync({ + $(".table-wrapper").scrollsync({ y_sync: true, x_sync: true }); diff --git a/WebHostLib/templates/tracker.html b/WebHostLib/templates/tracker.html index d352ae0e..aeafa730 100644 --- a/WebHostLib/templates/tracker.html +++ b/WebHostLib/templates/tracker.html @@ -86,7 +86,7 @@ {% set colspan = colspan + 1 %} {% endif %} {% if area in icons %} -