From dbc4f902ca3f31e14f2f5c4e7a858e2a7660b955 Mon Sep 17 00:00:00 2001
From: Gerome Matilla <gerome.matilla07@gmail.com>
Date: Sat, 6 Jun 2020 11:34:20 +0800
Subject: [PATCH] cleanups and readme

---
 README.md                                    | 14 +++++++++++---
 css/{suggestions.css => auto-suggestion.css} | 10 +++++-----
 css/style.css                                |  2 +-
 js/search-query-send.js                      |  2 ++
 4 files changed, 19 insertions(+), 9 deletions(-)
 rename css/{suggestions.css => auto-suggestion.css} (94%)

diff --git a/README.md b/README.md
index b1f0e43..3cefc1c 100644
--- a/README.md
+++ b/README.md
@@ -28,6 +28,7 @@
 ## Features
 
 + Responsive UI
++ Web search Suggestions
 + Mobile Support with Swipe Gestures
 + Theme Settings - Change colors on-the-fly
 + Weather Forecast - OpenWeatherMap
@@ -40,12 +41,19 @@
 
 ## Keybindings
 
-+ <kbd>alt + s</kbd> - toggles dashboard
-+ <kbd>alt + e</kbd> - toggles web menu
-+ <kbd>alt + x</kbd> - toggles weather screen
++ <kbd>alt + S</kbd> - toggles dashboard
++ <kbd>alt + E</kbd> - toggles web menu
++ <kbd>alt + X</kbd> - toggles weather screen
 + <kbd>Escape</kbd> - close panels/toggles web menu
 + <kbd>Backspace</kbd> - toggles search box
 
+## Swipe gestures
+
++ <kbd>swipe right</kbd> - opens web menu
++ <kbd>swipe left</kbd> - opens dashboard
++ <kbd>swipe up</kbd> - opens weather screen
++ <kbd>swipe down</kbd> - opens search box
+
 ## Customization and Settings
 
 #### Changing the colors and blur strength on-the-fly
diff --git a/css/suggestions.css b/css/auto-suggestion.css
similarity index 94%
rename from css/suggestions.css
rename to css/auto-suggestion.css
index 9817b3e..72fea0b 100644
--- a/css/suggestions.css
+++ b/css/auto-suggestion.css
@@ -20,11 +20,12 @@
 	user-select: none;
 }
 
+/*Show suggestion*/
 .suggestionsShow {
 	opacity: 1 !important;
 }
 
-/*The UL*/
+/*ul*/
 #suggestions {
 	
 	height: auto;
@@ -43,7 +44,7 @@
   	table-layout: fixed;
 }
 
-/*The Li*/
+/*li*/
 #phrase {
 	/*Align list horizontally*/
 	justify-content: center;
@@ -61,8 +62,7 @@
   	text-align: center;
 }
 
-/*The Li's child*/
-
+/*The li's child*/
 .phraseButton {
 
 	background: transparent;
@@ -81,7 +81,7 @@
 }
 
 .phraseButton:focus {
-	background: var(--base-hover-bg);
+	background: var(--base-bg);
 }
 
 .phraseButton:active {
diff --git a/css/style.css b/css/style.css
index dcaf2ab..4dcc572 100644
--- a/css/style.css
+++ b/css/style.css
@@ -17,7 +17,7 @@
 @import url('weather-screen.css');
 @import url('weather-settings.css');
 @import url('web-menu.css');
-@import url('suggestions.css');
+@import url('auto-suggestion.css');
 
 :root {
 	/* Colors */
diff --git a/js/search-query-send.js b/js/search-query-send.js
index cfe1a53..d05f229 100644
--- a/js/search-query-send.js
+++ b/js/search-query-send.js
@@ -12,6 +12,8 @@ searchBox.addEventListener(
 	"keyup",
 	(event) => {
 		
+		if (event.key === 'Tab') return;
+
 		// Number 13 is the "Enter" key on the keyboard
 	  	if (event.key === 'Enter') {