diff --git a/src/options.css b/src/options.css index cc731aa..cde8163 100644 --- a/src/options.css +++ b/src/options.css @@ -37,6 +37,10 @@ /* Phrase & URL lists */ +#PhraseLists__search { + margin-bottom: 1.5rem; +} + #PhraseList--invisible, #PhraseListPreview--invisible { display: none; diff --git a/src/options.html b/src/options.html index 6ab9c6f..2038980 100644 --- a/src/options.html +++ b/src/options.html @@ -170,6 +170,7 @@

Settings

Lists

+
diff --git a/src/options.js b/src/options.js index 7cf0977..98cdf2d 100644 --- a/src/options.js +++ b/src/options.js @@ -14,6 +14,7 @@ $(function () { // These handlers should only be ran once. if (fresh) { + setupSearchPhraseListsHandler(); addExistingURLLists(options); setPrimarySettings(options); setupAutoHighlightHandler(); @@ -57,6 +58,21 @@ $(function () { } } + function setupSearchPhraseListsHandler() { + $('#PhraseLists__search').on('keyup', function () { + $('.PhraseList__phrase').each(function () { + let $phrase = $(this); + let phraseText = $phrase.text().toLowerCase(); + let searchText = $('#PhraseLists__search').val().toLowerCase(); + if (phraseText.indexOf(searchText) === -1) { + $phrase.hide(); + } else { + $phrase.show(); + } + }); + }); + } + function setupAutoHighlightHandler() { $('#Settings__enableAutoHighlight').on('click', function () { showHideAutoHighlightSettings();