diff options
| author | Michael Howell <michael@notriddle.com> | 2022-12-07 21:59:54 -0700 |
|---|---|---|
| committer | Michael Howell <michael@notriddle.com> | 2022-12-07 22:49:10 -0700 |
| commit | a09e8c55c663d2b070f99ab0fdadbcc2c45656b2 (patch) | |
| tree | bb0c155d021df1dbdc08b716bb8a281bc3c6e40b | |
| parent | b28d30e1e3c2b90fd08b7dd79d8e63884d1e0339 (diff) | |
| download | rust-a09e8c55c663d2b070f99ab0fdadbcc2c45656b2.tar.gz rust-a09e8c55c663d2b070f99ab0fdadbcc2c45656b2.zip | |
rustdoc: clean up docblock table CSS
* The rule `display: block` had no noticeable effect. Technically, because markdown tables have a tbody and thead, they get wrapped in an [anonymous table box] in the CSS tree, nested within the `<table>` element's block layout box. This rule was added in #87230 to make the table side-scrolling, but this same issue was doubly fixed in #88742 by wrapping it in an explicit `<div>` tag. Since accessibility advocates recommend the wrapper div over marking the table as `display: block`, we'll stick with that. https://adrianroselli.com/2020/11/under-engineered-responsive-tables.html * The rule `width: calc(100% - 2px)` had no visible effect, because the anonymous table box was not affected. * The style is tweaked to basically be the same style GitHub uses. In particular, it adds zebra stripes, and removes dotted borders. [anonymous table box]: https://www.w3.org/TR/CSS2/tables.html#anonymous-boxes
| -rw-r--r-- | src/librustdoc/html/static/css/rustdoc.css | 14 | ||||
| -rw-r--r-- | src/librustdoc/html/static/css/themes/ayu.css | 1 | ||||
| -rw-r--r-- | src/librustdoc/html/static/css/themes/dark.css | 1 | ||||
| -rw-r--r-- | src/librustdoc/html/static/css/themes/light.css | 1 |
4 files changed, 7 insertions, 10 deletions
diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 0cd15768ac6..63bb2cdbaf2 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -631,22 +631,16 @@ pre, .rustdoc.source .example-wrap { .docblock table { margin: .5em 0; - width: calc(100% - 2px); - overflow-x: auto; - display: block; border-collapse: collapse; } -.docblock table td { +.docblock table td, .docblock table th { padding: .5em; - border: 1px dashed var(--border-color); - vertical-align: top; + border: 1px solid var(--border-color); } -.docblock table th { - padding: .5em; - text-align: left; - border: 1px solid var(--border-color); +.docblock table tr:nth-child(2n) { + background: var(--table-alt-row-background-color); } /* Shift "where ..." part of method or fn definition down a line */ diff --git a/src/librustdoc/html/static/css/themes/ayu.css b/src/librustdoc/html/static/css/themes/ayu.css index 6e0905e730d..0436fe0138e 100644 --- a/src/librustdoc/html/static/css/themes/ayu.css +++ b/src/librustdoc/html/static/css/themes/ayu.css @@ -87,6 +87,7 @@ Original by Dempfi (https://github.com/dempfi/ayu) --crate-search-hover-border: #e0e0e0; --source-sidebar-background-selected: #14191f; --source-sidebar-background-hover: #14191f; + --table-alt-row-background-color: #191f26; } h1, h2, h3, h4 { diff --git a/src/librustdoc/html/static/css/themes/dark.css b/src/librustdoc/html/static/css/themes/dark.css index 334fc3de561..d945e956c53 100644 --- a/src/librustdoc/html/static/css/themes/dark.css +++ b/src/librustdoc/html/static/css/themes/dark.css @@ -82,6 +82,7 @@ --crate-search-hover-border: #2196f3; --source-sidebar-background-selected: #333; --source-sidebar-background-hover: #444; + --table-alt-row-background-color: #2A2A2A; } .content .item-info::before { color: #ccc; } diff --git a/src/librustdoc/html/static/css/themes/light.css b/src/librustdoc/html/static/css/themes/light.css index 453e7508af4..58955a79316 100644 --- a/src/librustdoc/html/static/css/themes/light.css +++ b/src/librustdoc/html/static/css/themes/light.css @@ -79,6 +79,7 @@ --crate-search-hover-border: #717171; --source-sidebar-background-selected: #fff; --source-sidebar-background-hover: #e0e0e0; + --table-alt-row-background-color: #F5F5F5; } .content .item-info::before { color: #ccc; } |
