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

app/assets/javascripts/discourse/app/widgets/search-menu-results.js

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

app/assets/javascripts/discourse/tests/acceptance/search-test.js

@@ -53,7 +53,7 @@ acceptance("Search - Anonymous", function (needs) {
 
     assert.equal(
       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(),
       `dev ${I18n.t("search.in_topics_posts")}`,
       "shows topic search as first dropdown item"

app/assets/stylesheets/common/base/search-menu.scss

@@ -184,7 +184,14 @@ $search-pad-horizontal: 0.5em;
       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);
       margin-left: 2px;
     }

config/locales/client.en.yml

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