Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-10-26 16:46:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: better looking placeholder text for ACP search

Browse Source
This commit is contained in:
Julian Lam
2022-07-25 11:59:33 -04:00
parent 0529f2fb5d
commit 1b9c68196f
4 changed files with 37 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/language/en-GB/admin/menu.json
View File

@@ -76,7 +76,7 @@
"logout": "Log out", "logout": "Log out",
"view-forum": "View Forum", "view-forum": "View Forum",
"search.placeholder": "Press "/" to search for settings", "search.placeholder": "Search settings",
"search.no-results": "No results...", "search.no-results": "No results...",
"search.search-forum": "Search the forum for <strong></strong>", "search.search-forum": "Search the forum for <strong></strong>",
"search.keep-typing": "Type more to see results...", "search.keep-typing": "Type more to see results...",

30
public/less/admin/header.less
View File

@@ -86,6 +86,36 @@
} }
} }
.dropdown:not(.open) {
&:before {
content: '/';
border: 1px solid @gray;
border-radius: 5px;
padding: 0px 6px;
font-size: 12px;
font-weight: 600;
pointer-events: none;
position: absolute;
top: 10px;
left: 1em;
}
&:after {
content: attr(data-text);
position: absolute;
top: 10px;
left: 3em;
font-size: small;
font-weight: 600;
pointer-events: none;
}
input {
color: transparent;
}
}
.search-match { .search-match {
font-weight: 700; font-weight: 700;
color: black; color: black;

5
public/src/admin/modules/search.js
View File

@@ -63,6 +63,7 @@ define('admin/modules/search', ['mousetrap', 'alerts'], function (mousetrap, ale
const dropdown = $('#acp-search .dropdown'); const dropdown = $('#acp-search .dropdown');
const menu = $('#acp-search .dropdown-menu'); const menu = $('#acp-search .dropdown-menu');
const input = $('#acp-search input'); const input = $('#acp-search input');
const placeholderText = dropdown.attr('data-text');
if (!config.searchEnabled) { if (!config.searchEnabled) {
menu.addClass('search-disabled'); menu.addClass('search-disabled');
@@ -73,17 +74,19 @@ define('admin/modules/search', ['mousetrap', 'alerts'], function (mousetrap, ale
}); });
$('#acp-search').parents('form').on('submit', function (ev) { $('#acp-search').parents('form').on('submit', function (ev) {
const query = input.val();
let selected = menu.find('li.result > a.focus').attr('href'); let selected = menu.find('li.result > a.focus').attr('href');
if (!selected.length) { if (!selected.length) {
selected = menu.find('li.result > a').first().attr('href'); selected = menu.find('li.result > a').first().attr('href');
} }
const href = selected || config.relative_path + '/search?in=titlesposts&term=' + escape(input.val()); const href = selected || config.relative_path + '/search?in=titlesposts&term=' + escape(query);
ajaxify.go(href.replace(/^\//, '')); ajaxify.go(href.replace(/^\//, ''));
setTimeout(function () { setTimeout(function () {
dropdown.removeClass('open'); dropdown.removeClass('open');
input.blur(); input.blur();
dropdown.attr('data-text', query || placeholderText);
}, 150); }, 150);
ev.preventDefault(); ev.preventDefault();

4
src/views/admin/partials/menu.tpl
View File

@@ -139,8 +139,8 @@
{{{ if user.privileges.admin:settings }}} {{{ if user.privileges.admin:settings }}}
<form role="search"> <form role="search">
<div id="acp-search" > <div id="acp-search" >
<div class="dropdown"> <div class="dropdown" data-text="[[admin/menu:search.placeholder]]">
<input type="text" data-toggle="dropdown" class="form-control" placeholder="[[admin/menu:search.placeholder]]"> <input type="text" data-toggle="dropdown" class="form-control">
<ul class="dropdown-menu dropdown-menu-right state-start-typing" role="menu"> <ul class="dropdown-menu dropdown-menu-right state-start-typing" role="menu">
<li role="presentation" class="no-results"> <li role="presentation" class="no-results">
<a>[[admin/menu:search.no-results]]</a> <a>[[admin/menu:search.no-results]]</a>