From 2a7ee2178bb3a8f3610e0e4bd3ea409941954b15 Mon Sep 17 00:00:00 2001 From: Jacob Hoffman-Andrews Date: Sat, 20 Nov 2021 21:13:56 -0800 Subject: [PATCH] Use fewer colors in rustdoc UI This reduces visual distractions when reading method signatures. --- src/librustdoc/html/static/css/themes/ayu.css | 18 +++--- .../html/static/css/themes/dark.css | 34 +++++------ .../html/static/css/themes/light.css | 60 +++++++++---------- src/test/rustdoc-gui/anchors.goml | 2 +- 4 files changed, 56 insertions(+), 58 deletions(-) diff --git a/src/librustdoc/html/static/css/themes/ayu.css b/src/librustdoc/html/static/css/themes/ayu.css index 13e8dc85a243..558ac4266459 100644 --- a/src/librustdoc/html/static/css/themes/ayu.css +++ b/src/librustdoc/html/static/css/themes/ayu.css @@ -167,28 +167,28 @@ pre, .rustdoc.source .example-wrap { .content .item-info::before { color: #ccc; } -.content span.foreigntype, .content a.foreigntype { color: #ef57ff; } -.content span.union, .content a.union { color: #98a01c; } +.content span.foreigntype, .content a.foreigntype { color: #ffa0a5; } +.content span.union, .content a.union { color: #ffa0a5; } .content span.constant, .content a.constant, -.content span.static, .content a.static { color: #6380a0; } -.content span.primitive, .content a.primitive { color: #32889b; } -.content span.traitalias, .content a.traitalias { color: #57d399; } -.content span.keyword, .content a.keyword { color: #de5249; } +.content span.static, .content a.static { color: #39AFD7; } +.content span.primitive, .content a.primitive { color: #ffa0a5; } +.content span.traitalias, .content a.traitalias { color: #39AFD7; } +.content span.keyword, .content a.keyword { color: #39AFD7; } .content span.externcrate, .content span.mod, .content a.mod { - color: #acccf9; + color: #39AFD7; } .content span.struct, .content a.struct { color: #ffa0a5; } .content span.enum, .content a.enum { - color: #99e0c9; + color: #ffa0a5; } .content span.trait, .content a.trait { color: #39AFD7; } .content span.type, .content a.type { - color: #cfbcf5; + color: #e6e1cf; } .content span.fn, .content a.fn, .content span.method, .content a.method, .content span.tymethod, diff --git a/src/librustdoc/html/static/css/themes/dark.css b/src/librustdoc/html/static/css/themes/dark.css index 8caf8a05d507..2114e3581a7d 100644 --- a/src/librustdoc/html/static/css/themes/dark.css +++ b/src/librustdoc/html/static/css/themes/dark.css @@ -119,47 +119,45 @@ pre, .rustdoc.source .example-wrap { a.result-trait:focus { background-color: #013191; } a.result-traitalias:focus { background-color: #013191; } a.result-mod:focus, -a.result-externcrate:focus { background-color: #afc6e4; } -a.result-mod:focus { background-color: #803a1b; } -a.result-externcrate:focus { background-color: #396bac; } -a.result-enum:focus { background-color: #5b4e68; } +a.result-externcrate:focus { background-color: #884719; } +a.result-enum:focus { background-color: #194e9f; } a.result-struct:focus { background-color: #194e9f; } -a.result-union:focus { background-color: #b7bd49; } +a.result-union:focus { background-color: #194e9f; } a.result-fn:focus, a.result-method:focus, a.result-tymethod:focus { background-color: #4950ed; } -a.result-type:focus { background-color: #38902c; } -a.result-foreigntype:focus { background-color: #b200d6; } +a.result-type:focus { background-color: #eee; } +a.result-foreigntype:focus { background-color: #194e9f; } a.result-attr:focus, a.result-derive:focus, a.result-macro:focus { background-color: #217d1c; } a.result-constant:focus, -a.result-static:focus { background-color: #0063cc; } -a.result-primitive:focus { background-color: #00708a; } +a.result-static:focus { background-color: #884719; } +a.result-primitive:focus { background-color: #194e9f; } a.result-keyword:focus { background-color: #884719; } .content .item-info::before { color: #ccc; } -.content span.enum, .content a.enum, .block a.current.enum { color: #82b089; } +.content span.enum, .content a.enum, .block a.current.enum { color: #2dbfb8; } .content span.struct, .content a.struct, .block a.current.struct { color: #2dbfb8; } -.content span.type, .content a.type, .block a.current.type { color: #ff7f00; } -.content span.foreigntype, .content a.foreigntype, .block a.current.foreigntype { color: #dd7de8; } +.content span.type, .content a.type, .block a.current.type { color: #ddd; } +.content span.foreigntype, .content a.foreigntype, .block a.current.foreigntype { color: #2dbfb8; } .content span.attr, .content a.attr, .block a.current.attr, .content span.derive, .content a.derive, .block a.current.derive, .content span.macro, .content a.macro, .block a.current.macro { color: #09bd00; } -.content span.union, .content a.union, .block a.current.union { color: #a6ae37; } +.content span.union, .content a.union, .block a.current.union { color: #2dbfb8; } .content span.constant, .content a.constant, .block a.current.constant, -.content span.static, .content a.static, .block a.current.static { color: #82a5c9; } -.content span.primitive, .content a.primitive, .block a.current.primitive { color: #43aec7; } +.content span.static, .content a.static, .block a.current.static { color: #D2991D; } +.content span.primitive, .content a.primitive, .block a.current.primitive { color: #2dbfb8; } .content span.externcrate, -.content span.mod, .content a.mod, .block a.current.mod { color: #bda000; } +.content span.mod, .content a.mod, .block a.current.mod { color: #D2991D; } .content span.trait, .content a.trait, .block a.current.trait { color: #b78cf2; } -.content span.traitalias, .content a.traitalias, .block a.current.traitalias { color: #b397da; } +.content span.traitalias, .content a.traitalias, .block a.current.traitalias { color: #b78cf2; } .content span.fn, .content a.fn, .block a.current.fn, .content span.method, .content a.method, .block a.current.method, .content span.tymethod, .content a.tymethod, .block a.current.tymethod, .content .fnname{ color: #2BAB63; } -.content span.keyword, .content a.keyword, .block a.current.keyword { color: #de5249; } +.content span.keyword, .content a.keyword, .block a.current.keyword { color: #D2991D; } pre.rust .comment { color: #8d8d8b; } pre.rust .doccomment { color: #8ca375; } diff --git a/src/librustdoc/html/static/css/themes/light.css b/src/librustdoc/html/static/css/themes/light.css index fec71674e634..89fc2bbfec68 100644 --- a/src/librustdoc/html/static/css/themes/light.css +++ b/src/librustdoc/html/static/css/themes/light.css @@ -9,7 +9,7 @@ h1, h2, h3, h4 { color: black; } h1.fqn { - border-bottom-color: #D5D5D5; + border-bottom-color: #DDDDDD; } h2, h3, h4 { border-bottom-color: #DDDDDD; @@ -31,7 +31,7 @@ pre, .rustdoc.source .example-wrap { } .sidebar { - background-color: #F1F1F1; + background-color: #F5F5F5; } /* Improve the scrollbar display on firefox */ @@ -90,7 +90,7 @@ pre, .rustdoc.source .example-wrap { .line-numbers span { color: #c67e2d; } .line-numbers .line-highlighted { - background-color: #f6fdb0 !important; + background-color: #FDFFD3 !important; } .docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 { @@ -120,44 +120,44 @@ a.result-trait:focus { background-color: #c7b6ff; } a.result-traitalias:focus { background-color: #c7b6ff; } a.result-mod:focus, a.result-externcrate:focus { background-color: #afc6e4; } -a.result-enum:focus { background-color: #b4d1b9; } +a.result-enum:focus { background-color: #e7b1a0; } a.result-struct:focus { background-color: #e7b1a0; } -a.result-union:focus { background-color: #b7bd49; } +a.result-union:focus { background-color: #e7b1a0; } a.result-fn:focus, a.result-method:focus, a.result-tymethod:focus { background-color: #c6afb3; } -a.result-type:focus { background-color: #ffc891; } -a.result-foreigntype:focus { background-color: #f5c4ff; } +a.result-type:focus { background-color: #ccc; } +a.result-foreigntype:focus { background-color: #e7b1a0; } a.result-attr:focus, a.result-derive:focus, a.result-macro:focus { background-color: #8ce488; } a.result-constant:focus, -a.result-static:focus { background-color: #c3e0ff; } -a.result-primitive:focus { background-color: #9aecff; } -a.result-keyword:focus { background-color: #f99650; } +a.result-static:focus { background-color: #afc6e4; } +a.result-primitive:focus { background-color: #e7b1a0; } +a.result-keyword:focus { background-color: #afc6e4; } .content .item-info::before { color: #ccc; } -.content span.enum, .content a.enum, .block a.current.enum { color: #508157; } -.content span.struct, .content a.struct, .block a.current.struct { color: #ad448e; } -.content span.type, .content a.type, .block a.current.type { color: #ba5d00; } -.content span.foreigntype, .content a.foreigntype, .block a.current.foreigntype { color: #cd00e2; } +.content span.enum, .content a.enum, .block a.current.enum { color: #AD378A; } +.content span.struct, .content a.struct, .block a.current.struct { color: #AD378A; } +.content span.type, .content a.type, .block a.current.type { color: black; } +.content span.foreigntype, .content a.foreigntype, .block a.current.foreigntype { color: #AD378A; } .content span.attr, .content a.attr, .block a.current.attr, .content span.derive, .content a.derive, .block a.current.derive, .content span.macro, .content a.macro, .block a.current.macro { color: #068000; } -.content span.union, .content a.union, .block a.current.union { color: #767b27; } +.content span.union, .content a.union, .block a.current.union { color: #AD378A; } .content span.constant, .content a.constant, .block a.current.constant, -.content span.static, .content a.static, .block a.current.static { color: #546e8a; } -.content span.primitive, .content a.primitive, .block a.current.primitive { color: #2c8093; } +.content span.static, .content a.static, .block a.current.static { color: #3873AD; } +.content span.primitive, .content a.primitive, .block a.current.primitive { color: #AD378A; } .content span.externcrate, -.content span.mod, .content a.mod, .block a.current.mod { color: #4d76ae; } -.content span.trait, .content a.trait, .block a.current.trait { color: #7c5af3; } -.content span.traitalias, .content a.traitalias, .block a.current.traitalias { color: #6841f1; } +.content span.mod, .content a.mod, .block a.current.mod { color: #3873AD; } +.content span.trait, .content a.trait, .block a.current.trait { color: #6E4FC9; } +.content span.traitalias, .content a.traitalias, .block a.current.traitalias { color: #5137AD; } .content span.fn, .content a.fn, .block a.current.fn, .content span.method, .content a.method, .block a.current.method, .content span.tymethod, .content a.tymethod, .block a.current.tymethod, -.content .fnname { color: #9a6e31; } -.content span.keyword, .content a.keyword, .block a.current.keyword { color: #de5249; } +.content .fnname { color: #AD7C37; } +.content span.keyword, .content a.keyword, .block a.current.keyword { color: #3873AD; } nav:not(.sidebar) { border-bottom-color: #e0e0e0; @@ -268,7 +268,7 @@ pre.rust .question-mark { } a.test-arrow { - background-color: rgba(78, 139, 202, 0.2); + background-color: rgb(78, 139, 202, 0.2); } a.test-arrow:hover{ @@ -285,7 +285,7 @@ a.test-arrow:hover{ } :target { - border-right: 3px solid #ffb44c; + border-right: 3px solid #AD7C37; } pre.compile_fail { @@ -337,7 +337,7 @@ pre.ignore:hover, .information:hover + pre.ignore { } .search-failed a { - color: #0089ff; + color: #3873AD; } .tooltip::after { @@ -374,18 +374,18 @@ pre.ignore:hover, .information:hover + pre.ignore { @media (max-width: 700px) { .sidebar-menu { - background-color: #F1F1F1; + background-color: #F5F5F5; border-bottom-color: #e0e0e0; border-right-color: #e0e0e0; } .sidebar-elems { - background-color: #F1F1F1; + background-color: #F5F5F5; border-right-color: #000; } #sidebar-filler { - background-color: #F1F1F1; + background-color: #F5F5F5; border-bottom-color: #e0e0e0; } } @@ -453,13 +453,13 @@ kbd { } #sidebar-toggle { - background-color: #F1F1F1; + background-color: #F5F5F5; } #sidebar-toggle:hover { background-color: #E0E0E0; } #source-sidebar { - background-color: #F1F1F1; + background-color: #F5F5F5; } #source-sidebar > .title { border-bottom-color: #ccc; diff --git a/src/test/rustdoc-gui/anchors.goml b/src/test/rustdoc-gui/anchors.goml index 4ce0ed1a4b8f..2344a4dfb14a 100644 --- a/src/test/rustdoc-gui/anchors.goml +++ b/src/test/rustdoc-gui/anchors.goml @@ -11,7 +11,7 @@ reload: assert-css: ("#toggle-all-docs", {"color": "rgb(0, 0, 0)"}) assert-css: (".fqn .in-band a:nth-of-type(1)", {"color": "rgb(0, 0, 0)"}) -assert-css: (".fqn .in-band a:nth-of-type(2)", {"color": "rgb(173, 68, 142)"}) +assert-css: (".fqn .in-band a:nth-of-type(2)", {"color": "rgb(173, 55, 138)"}) assert-css: (".srclink", {"color": "rgb(0, 0, 0)"}) assert-css: (".srclink", {"color": "rgb(0, 0, 0)"})