diff --git a/CHANGES.md b/CHANGES.md index d62024a56d..8f9baaf29c 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -38,6 +38,7 @@ CUPS v2.4rc1 (Pending) - The IPP backend now retries Validate-Job requests (Issue #132) - Now show better error messages when a driver interface program fails to provide a PPD file (Issue #148) +- Added dark mode support to the CUPS web interface (Issue #152) - Added a workaround for Solaris in `httpAddrConnect2` (Issue #156) - Fixed an interaction between `--remote-admin` and `--remote-any` for the `cupsctl` command (Issue #158) diff --git a/doc/cups.css b/doc/cups.css index d91d8949a2..7d7f414d88 100644 --- a/doc/cups.css +++ b/doc/cups.css @@ -281,7 +281,7 @@ tr.data th { } div.table table { - border: solid thin #999999; + border: solid thin rgba(191,191,191,.3); border-collapse: collapse; border-spacing: 0; margin-left: auto; @@ -299,14 +299,14 @@ div.table caption { div.table table td { background: white; - border: solid thin #bbbbbb; + border: solid thin rgba(191,191,191,.45); padding: 5pt 10pt 0; } div.table table th { - background: #f0f0f0; + background: rgba(191,191,191,.15); border: none; - border-bottom: solid thin #999999; + border-bottom: solid thin rgba(191,191,191,.3); } div.figure table { @@ -394,9 +394,9 @@ table.list { table.list th { background: white; border-bottom: solid thin #cccccc; + border-right: 2px solid rgba(191,191,191,.45); color: #444444; - padding-top: 10pt; - padding-left: 5pt; + padding: 5px 10px 5px 12px; text-align: left; vertical-align: bottom; white-space: nowrap; @@ -407,17 +407,16 @@ table.list th a { } table.list td { - border-bottom: solid thin #eeeeee; - padding-top: 5pt; - padding-left: 5pt; + border-bottom: solid thin rgba(191,191,191,.45); + padding: 5px 2px 5px 10px; } table.list tr:nth-child(even) { - background: #f8f8f8; + background: rgba(191,191,191,0.15); } table.list tr:nth-child(odd) { - background: #f4f4f4; + background: rgba(191,191,191,0.3); } div.sidebar { @@ -452,8 +451,8 @@ div.sidebar p.l2 { } table.inset { - background: #f0f0f0; - border: thin solid #e0e0e0; + background: rgba(191,191,191,0.15); + border: thin solid rgba(191,191,191,0.3); margin-top: 1em; padding: 0; width: 100%; @@ -634,25 +633,6 @@ ul.contents > li { ul.contents li ul.code, ul.contents li ul.subcontents { padding-left: 2em; } -table.list { - border-collapse: collapse; - width: 100%; -} -table.list tr:nth-child(even) { - background: rgba(127,127,127,0.1); -} -table.list th { - border-right: 2px solid gray; - font-family: monospace; - padding: 5px 10px 5px 12px; - text-align: left; - vertical-align: top; -} -table.list td { - padding: 5px 2px 5px 10px; - text-align: left; - vertical-align: top; -} /* iPhone/iPod touch overrides */ @media only screen and (min-device-width: 320px) and (max-device-width: 480px), @@ -719,3 +699,25 @@ table.list td { display: none; } } + +/* Dark mode overrides */ +@media (prefers-color-scheme: dark) { + body { + background: black; + color: #ccc; + } + a:link, a:visited, table.list th a { + color: #6666ff; + } + a:link:hover, a:visited:hover, a:active, table.list th a { + color: #ff66ff; + } + hr { + color: #666; + } + div.table table td, table.list th { + background: black; + } + table.list th { + color: #666; +}