UX: Add Enter hint to search dropdown (#14587)

This commit is contained in:
Penar Musaraj 2021-10-13 12:09:28 -04:00 committed by GitHub
parent a3fde50b62
commit 74706bab10
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 18 additions and 7 deletions

View File

@ -564,12 +564,12 @@ createWidget("search-menu-initial-options", {
defaultRow(term, opts = { withLabel: false }) { defaultRow(term, opts = { withLabel: false }) {
return this.attach("search-menu-assistant-item", { return this.attach("search-menu-assistant-item", {
slug: term, slug: term,
extraHint: I18n.t("search.enter_hint"),
label: [ label: [
h("span", `${term} `), h("span.keyword", `${term} `),
h( opts.withLabel
"span.label-suffix", ? h("span.label-suffix", I18n.t("search.in_topics_posts"))
opts.withLabel ? I18n.t("search.in_topics_posts") : null : null,
),
], ],
}); });
}, },
@ -619,6 +619,9 @@ createWidget("search-menu-assistant-item", {
content.push(h("span.search-item-user", userResult)); content.push(h("span.search-item-user", userResult));
} else { } else {
content.push(h("span.search-item-slug", attrs.label || attrs.slug)); content.push(h("span.search-item-slug", attrs.label || attrs.slug));
if (attrs.extraHint) {
content.push(h("span.extra-hint", attrs.extraHint));
}
} }
return h("a.widget-link.search-link", { attributes }, content); return h("a.widget-link.search-link", { attributes }, content);
}, },

View File

@ -53,7 +53,7 @@ acceptance("Search - Anonymous", function (needs) {
assert.equal( assert.equal(
query( query(
".search-menu .results ul.search-menu-initial-options li:first-child" ".search-menu .results ul.search-menu-initial-options li:first-child .search-item-slug"
).innerText.trim(), ).innerText.trim(),
`dev ${I18n.t("search.in_topics_posts")}`, `dev ${I18n.t("search.in_topics_posts")}`,
"shows topic search as first dropdown item" "shows topic search as first dropdown item"

View File

@ -184,7 +184,14 @@ $search-pad-horizontal: 0.5em;
color: var(--primary-medium); color: var(--primary-medium);
} }
.badge-wrapper { .extra-hint {
color: var(--primary-low-mid);
font-size: var(--font-down-1);
float: right;
margin-top: 2px;
}
.search-item-slug .badge-wrapper {
font-size: var(--font-0); font-size: var(--font-0);
margin-left: 2px; margin-left: 2px;
} }

View File

@ -2366,6 +2366,7 @@ en:
in: "in" in: "in"
in_this_topic: "in this topic" in_this_topic: "in this topic"
in_topics_posts: "in all topics and posts" in_topics_posts: "in all topics and posts"
enter_hint: "or press Enter"
in_posts_by: "in posts by %{username}" in_posts_by: "in posts by %{username}"
type: type: