edit: invalid input error message, loader

nyakotey · Sep 14, 2022 · f4b313a · f4b313a
1 parent 2e7be89
commit f4b313a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/css/style.css b/css/style.css
@@ -136,8 +136,12 @@ body {
     scroll-snap-type: y mandatory;
 }
 
+.loader {
+    color: #aaaaaabb;
+}
+
 .country {
-    width: min(75vmin,290px);
+    width: min(75vmin, 290px);
     display: flex;
     /*! flex: 0 0 max-content; */
     gap: 0.8rem;

diff --git a/js/script.js b/js/script.js
@@ -166,7 +166,9 @@ function generateHtml(mainData, externalInfo = [{}], city = {}, query = "+XXX")
 
 async function response() {
     hideInfoPane();
-    const loadingHtml = "<div style='color: #aaaaaabb;'>loading...</div>";
+    const loadingHtml = `<div class="loader">
+    <i class="fas fa-magnifying-glass search-icon"></i> &nbsp;Searching...
+    </div>`;
     render(output, loadingHtml);
 
     let query = getQuery();
@@ -208,6 +210,7 @@ function hideInfoPane() {
 
 
 async function tests() {
+    hideInfoPane();
     render(output, "<b style='color:#ccc'>testing...</b>");
 
     const testRandomCountry = () => {
@@ -227,7 +230,7 @@ async function tests() {
 
 // main
 const err = {
-    invalidInput: `<div class="error">Please revise your input</div>`,
+    invalidInput: `<div class="error">Input is empty or in a wrong format</div>`,
     notFound: `<div class="error">Not found</div>`,
     oops: `<div class="error">Oops an error occurred</div>`,
 }