From ca0aad8795610a9650d061bf902e58f252a67565 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Mon, 21 Nov 2022 11:15:41 +0100 Subject: [PATCH 1/2] Migrate search result alias to CSS variables --- src/librustdoc/html/static/css/rustdoc.css | 7 +++++++ src/librustdoc/html/static/css/themes/ayu.css | 11 +++-------- src/librustdoc/html/static/css/themes/dark.css | 11 +++-------- src/librustdoc/html/static/css/themes/light.css | 11 +++-------- 4 files changed, 16 insertions(+), 24 deletions(-) diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 589df77365d..433dbc9c8c3 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -906,6 +906,13 @@ so that we can apply CSS-filters to change the arrow color in themes */ background-color: var(--search-result-link-focus-background-color); } +.search-results .result-name span.alias { + color: var(--search-results-alias-color); +} +.search-results .result-name span.grey { + color: var(--search-results-grey-color); +} + .popover { position: absolute; right: 0; diff --git a/src/librustdoc/html/static/css/themes/ayu.css b/src/librustdoc/html/static/css/themes/ayu.css index 952d3e833fb..eb66377670c 100644 --- a/src/librustdoc/html/static/css/themes/ayu.css +++ b/src/librustdoc/html/static/css/themes/ayu.css @@ -41,9 +41,11 @@ Original by Dempfi (https://github.com/dempfi/ayu) --sidebar-current-link-background-color: transparent; --search-result-link-focus-background-color: #3c3c3c; --search-result-border-color: #aaa3; + --search-color: #fff; + --search-results-alias-color: #c5c5c5; + --search-results-grey-color: #999; --stab-background-color: #314559; --stab-code-color: #e6e1cf; - --search-color: #fff; --code-highlight-kw-color: #ff7733; --code-highlight-kw-2-color: #ff7733; --code-highlight-lifetime-color: #ff7733; @@ -202,13 +204,6 @@ pre.rust .kw-2, pre.rust .prelude-ty {} filter: invert(100); } -.search-results .result-name span.alias { - color: #c5c5c5; -} -.search-results .result-name span.grey { - color: #999; -} - #source-sidebar > .title { color: #fff; } diff --git a/src/librustdoc/html/static/css/themes/dark.css b/src/librustdoc/html/static/css/themes/dark.css index 6327083f6ae..44598a6b778 100644 --- a/src/librustdoc/html/static/css/themes/dark.css +++ b/src/librustdoc/html/static/css/themes/dark.css @@ -36,9 +36,11 @@ --sidebar-current-link-background-color: #444; --search-result-link-focus-background-color: #616161; --search-result-border-color: #aaa3; + --search-color: #111; + --search-results-alias-color: #fff; + --search-results-grey-color: #ccc; --stab-background-color: #314559; --stab-code-color: #e6e1cf; - --search-color: #111; --code-highlight-kw-color: #ab8ac1; --code-highlight-kw-2-color: #769acb; --code-highlight-lifetime-color: #d97f26; @@ -103,13 +105,6 @@ details.rustdoc-toggle > summary::before { color: #888; } -.search-results .result-name span.alias { - color: #fff; -} -.search-results .result-name span.grey { - color: #ccc; -} - #source-sidebar div.files > a:hover, details.dir-entry summary:hover, #source-sidebar div.files > a:focus, details.dir-entry summary:focus { background-color: #444; diff --git a/src/librustdoc/html/static/css/themes/light.css b/src/librustdoc/html/static/css/themes/light.css index 0ea709e3e8d..f0db14fd59f 100644 --- a/src/librustdoc/html/static/css/themes/light.css +++ b/src/librustdoc/html/static/css/themes/light.css @@ -36,9 +36,11 @@ --sidebar-current-link-background-color: #fff; --search-result-link-focus-background-color: #ccc; --search-result-border-color: #aaa3; + --search-color: #000; + --search-results-alias-color: #000; + --search-results-grey-color: #999; --stab-background-color: #fff5d6; --stab-code-color: #000; - --search-color: #000; --code-highlight-kw-color: #8959a8; --code-highlight-kw-2-color: #4271ae; --code-highlight-lifetime-color: #b76514; @@ -96,13 +98,6 @@ body.source .example-wrap pre.rust a { color: #888; } -.search-results .result-name span.alias { - color: #000; -} -.search-results .result-name span.grey { - color: #999; -} - #source-sidebar div.files > a:hover, details.dir-entry summary:hover, #source-sidebar div.files > a:focus, details.dir-entry summary:focus { background-color: #E0E0E0; From 90d7beb624324bd60d52260bd301689fdac84504 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Mon, 21 Nov 2022 11:15:54 +0100 Subject: [PATCH 2/2] Extend GUI test for alias search result --- src/test/rustdoc-gui/search-result-color.goml | 53 +++++++++++++------ 1 file changed, 36 insertions(+), 17 deletions(-) diff --git a/src/test/rustdoc-gui/search-result-color.goml b/src/test/rustdoc-gui/search-result-color.goml index d437ad75970..dde43b1c980 100644 --- a/src/test/rustdoc-gui/search-result-color.goml +++ b/src/test/rustdoc-gui/search-result-color.goml @@ -366,23 +366,42 @@ assert-css: ( {"color": "rgb(0, 0, 0)", "background-color": "rgba(0, 0, 0, 0)"}, ) -// Check the alias more specifically in the dark theme. +// Check the alias. goto: "file://" + |DOC_PATH| + "/test_docs/index.html" -// We set the theme so we're sure that the correct values will be used, whatever the computer -// this test is running on. -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-use-system-theme": "false", -} // If the text isn't displayed, the browser doesn't compute color style correctly... show-text: true -// We reload the page so the local storage settings are being used. -reload: -write: (".search-input", "thisisanalias") -// To be SURE that the search will be run. -press-key: 'Enter' -// Waiting for the search results to appear... -wait-for: "#titles" -// Checking that the colors for the alias element are the ones expected. -assert-css: (".result-name > .alias", {"color": "rgb(255, 255, 255)"}) -assert-css: (".result-name > .alias > .grey", {"color": "rgb(204, 204, 204)"}) + +define-function: ( + "check-alias", + (theme, alias, grey), + [ + ("local-storage", {"rustdoc-theme": |theme|, "rustdoc-use-system-theme": "false"}), + ("reload"), + ("write", (".search-input", "thisisanalias")), + // To be SURE that the search will be run. + ("press-key", 'Enter'), + // Waiting for the search results to appear... + ("wait-for", "#titles"), + // Checking that the colors for the alias element are the ones expected. + ("assert-css", (".result-name > .alias", {"color": |alias|})), + ("assert-css", (".result-name > .alias > .grey", {"color": |grey|})), + // Leave the search results to prevent reloading with an already filled search input. + ("press-key", "Escape"), + ], +) + +call-function: ("check-alias", { + "theme": "ayu", + "alias": "rgb(197, 197, 197)", + "grey": "rgb(153, 153, 153)", +}) +call-function: ("check-alias", { + "theme": "dark", + "alias": "rgb(255, 255, 255)", + "grey": "rgb(204, 204, 204)", +}) +call-function: ("check-alias", { + "theme": "light", + "alias": "rgb(0, 0, 0)", + "grey": "rgb(153, 153, 153)", +})