diff --git a/index.html b/index.html index 20cccf6d..b57907fc 100644 --- a/index.html +++ b/index.html @@ -30,9 +30,8 @@ padding-bottom: 5px; } - table.dataTable > tbody > tr:target, - table.dataTable > tbody > tr.shown:target + tr { - background: #fd0; + table.dataTable > tbody > tr:is(:target, .shown:target + tr) { + background: #fdeb8b; } tr:not(:hover):not(:focus-within) > .link-control > a { @@ -44,12 +43,44 @@ height: 1em; background: currentColor; } - .clipicon-MDN { -webkit-mask: url(asset/MDN.svg) center no-repeat; mask: url(asset/MDN.svg) center no-repeat; width: 1.20833em; } + + @media (prefers-color-scheme: dark) { + :root { + color-scheme: dark; + } + :root, body { + background-color: #111; + color: white; + } + .jumbotron { + background-color: #333; + color: white; + } + a { + color: #6db5f2; + } + .dataTables_wrapper :is(.dataTables_length, .dataTables_filter, + .dataTables_info, .dataTables_processing, .dataTables_paginate) { + color: #ccc; + } + table.dataTable > tbody > tr:is(:target, .shown:target + tr) { + background: #443103; + } + .table > :is(thead, tbody, tfoot) > tr > :is(td, th) { + border-top-color: #333; + } + table.dataTable tbody tr { + background-color: #111; + } + table.dataTable.no-footer { + border-bottom-color: #ccc; + } + }
@@ -108,7 +139,7 @@