From 7b849f72bfe07691f9d0abbed59deed3d6035703 Mon Sep 17 00:00:00 2001
From: Thatcher Peskens <thatcher@gmx.net>
Date: Sun, 10 Jan 2021 12:10:44 +0100
Subject: [PATCH] Fixed a display issue for long ipv6 addresses and port input
 on mobile

---
 Makefile         |  2 +-
 html/index.html  | 23 ++++++++++++-----------
 html/script.html |  1 -
 html/styles.html | 11 ++++++-----
 4 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/Makefile b/Makefile
index d51a752..d737343 100644
--- a/Makefile
+++ b/Makefile
@@ -71,4 +71,4 @@ endif
 	@sha256sum $(GOPATH)/bin/$(XBIN)
 
 run:
-	go run cmd/echoip/main.go -a data/asn.mmdb -c data/city.mmdb -f data/country.mmdb -H x-forwarded-for -r -s
+	go run cmd/echoip/main.go -a data/asn.mmdb -c data/city.mmdb -f data/country.mmdb -H x-forwarded-for -r -s -p
diff --git a/html/index.html b/html/index.html
index dc814ee..00c3d6b 100644
--- a/html/index.html
+++ b/html/index.html
@@ -200,52 +200,52 @@
             </p>
             <div class="pure-form">
               <!-- COMMAND WIDGET -->
-              <div class="buttons">
+              <div class="input-buttons">
                 <button
                   name="ip"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   ip
                 </button>
                 <button
                   name="country"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   country
                 </button>
                 <button
                   name="country-iso"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   country-iso
                 </button>
                 <button
                   name="city"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   city
                 </button>
                 <button
                   name="asn"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   asn
                 </button>
                 <button
                   name="json"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   json
                 </button>
                 <button
                   name="port"
-                  class="button widget-select"
+                  class="pure-button widget-select"
                   onclick="changeInput(this.name, this)"
                 >
                   port
@@ -266,12 +266,13 @@
               </div>
               <div id="output" class="widgetbox output"></div>
 
-              <form class="pure-form">
+              <form class="pure-form input-buttons">
                 <fieldset>
-                  <label for="ipCheckBox">
+                  <label for="ipInput">
+                    Check another IP (optional)
                     <input
                       id="ipInput"
-                      class="medium-input pure-input"
+                      class=""
                       type="text"
                       placeholder="IP to query"
                       onkeyup="updateIP(this.value)"
diff --git a/html/script.html b/html/script.html
index 1e4b7f8..cd57f8d 100644
--- a/html/script.html
+++ b/html/script.html
@@ -71,7 +71,6 @@
   function navigate(event) {
     console.log("navigate", compositePath)
     window.location = compositePath
-    event.preventDefault()
   }
 
   function updatePort(value) {
diff --git a/html/styles.html b/html/styles.html
index e2cd974..f246b92 100644
--- a/html/styles.html
+++ b/html/styles.html
@@ -26,6 +26,7 @@
     background: #f2f2f2;
     font-size: 36px;
     padding: 6px;
+    word-wrap: break-word;
   }
   svg.github-corner {
     fill: #151513;
@@ -88,11 +89,6 @@
     text-align: right;
   }
 
-  .narrow-input {
-    width: 5.5em;
-    margin-top: 0.2em;
-  }
-
   .medium-input {
     width: 10em;
   }
@@ -101,6 +97,11 @@
     background-color: rgb(208 208 208);
   }
 
+  .input-buttons {
+    line-height: 2.6em;
+    font-size: smaller;
+  }
+
   /* POST CORRECTION */
   .leafcloud-logo .letters {
     fill: black;