diff --git a/static/index.css b/static/index.css
index d7f50ab..de851b6 100644
--- a/static/index.css
+++ b/static/index.css
@@ -8,25 +8,25 @@
background-color: white;
}
-#search-form {
- z-index: 10;
+#header {
+ z-index: 15;
background-color: #56517c;
padding: .4em;
+ height: 3em;
display: flex;
height: 3em;
}
-#search {
- width: 3em;
+#search-form {
+ flex-basis: 100%;
}
#search-widget {
- flex-basis: 100%;
+ height: 100%;
}
#search-bar {
width: 100%;
- height: 100%;
border: 1px solid lightgray;
padding: .3em;
}
diff --git a/static/index.html b/static/index.html
index edffca0..410966a 100644
--- a/static/index.html
+++ b/static/index.html
@@ -15,15 +15,15 @@
diff --git a/static/index.js b/static/index.js
index dd309c5..d592a14 100644
--- a/static/index.js
+++ b/static/index.js
@@ -58,7 +58,7 @@ $(document).ready(() => {
appendTo: '#search-form',
source: (request, response) => {
$.ajax({
- url: `/langs/${selectedLang.code}/words?like=${request.term}&limit=20&offset=0`,
+ url: `/langs/${selectedLang.code}/words?like=${request.term.trim()}&limit=20&offset=0`,
success: data => response(data)
})
},
@@ -81,7 +81,8 @@ $(document).ready(() => {
const word = window.location.hash.replace('#', '');
if (word) {
- document.title = `Inflective - ${decodeURIComponent(word)}`;
+ const decodedWord = decodeURIComponent(word);
+ document.title = `Inflective - ${decodedWord}`;
$.ajax({
url: `/langs/${selectedLang.code}/words/${word}`,
@@ -94,6 +95,7 @@ $(document).ready(() => {
})
window.scrollTo(0, 0);
+ searchBar.val(decodedWord);
searchBar.select();
searchBar.autocomplete('close');
// Sometimes autocomplete opens after close was called