diff options
| -rw-r--r-- | app/css/style.css | 14 | ||||
| -rw-r--r-- | app/scripts/search.js | 28 |
2 files changed, 41 insertions, 1 deletions
diff --git a/app/css/style.css b/app/css/style.css index 8070c1c..73abc7b 100644 --- a/app/css/style.css +++ b/app/css/style.css @@ -2,6 +2,7 @@ body { margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + color: #ffffff; } .dict_ui { @@ -46,5 +47,16 @@ body { height: 50%; overflow-y: scroll; width: 80%; - margin: 50px auto 0px auto; + margin: 0px auto 0px auto; +} + +.wordType { + color: #e2e2e2; + font-size: 1.5rem; + margin-bottom: 0px; +} + +.definition { + margin-top: 5px; + font-size: 2rem; } diff --git a/app/scripts/search.js b/app/scripts/search.js index e7146fb..f7f949c 100644 --- a/app/scripts/search.js +++ b/app/scripts/search.js @@ -5,10 +5,38 @@ const wordnet = new natural.WordNet(); searchBox.addEventListener('keypress', (e) => { if (e.keyCode === 13) { + results.innerHTML = ''; const word = searchBox.value; wordnet.lookup(word, details => { console.log(details); details.forEach(detail => { + let pos = ''; + switch (detail.pos) { + case 'n': + pos = 'noun'; + break; + case 'v': + pos = 'verb'; + break; + case 'a': + pos = 'adjective'; + break; + case 's': + pos = 'adjective'; + break; + case 'r': + pos = 'adverb'; + break; + default: + pos = ''; + break; + } + + const wordType = document.createElement('p'); + wordType.innerHTML = pos; + wordType.className = 'wordType'; + results.appendChild(wordType); + const definition = document.createElement('p'); definition.innerHTML = detail.def; definition.className = 'definition'; |