From 99d04970bb9cc9f8d5fe5d5fae8070a03e489c04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Stephan=20B=C3=B6sch-Plepelits?= <skunk@xover.mud.at>
Date: Wed, 18 Oct 2017 09:44:48 +0200
Subject: [PATCH] CategoryOverpass: border around info; add close button

---
 src/CategoryOverpass.js | 11 +++++++++++
 style.css               | 11 +++++++++++
 2 files changed, 22 insertions(+)

diff --git a/src/CategoryOverpass.js b/src/CategoryOverpass.js
index 9d9247d4..a4baec71 100644
--- a/src/CategoryOverpass.js
+++ b/src/CategoryOverpass.js
@@ -201,6 +201,17 @@ CategoryOverpass.prototype.open = function () {
 
     var template = OverpassLayer.twig.twig({ data: this.data.info, autoescape: true })
     this.domInfo.innerHTML = template.render(this.data)
+
+    var closeButton = document.createElement('a')
+
+    closeButton.href = '#'
+    closeButton.innerHTML = '×'
+    closeButton.className = 'closeButton'
+    this.domInfo.appendChild(closeButton)
+
+    closeButton.onclick = function () {
+      this.domInfo.parentNode.removeChild(this.domInfo)
+    }.bind(this)
   }
 }
 
diff --git a/style.css b/style.css
index 5e1cab45..6f1002eb 100644
--- a/style.css
+++ b/style.css
@@ -192,6 +192,17 @@ body {
 #content .category.open > .status {
   display: block;
 }
+.info {
+  position: relative;
+  border: 1px solid black;
+}
+.info > .closeButton {
+  position: absolute;
+  top: 0;
+  right: 0;
+  text-decoration: none;
+  font-size: 12px;
+}
 #content .category > .status,
 #content .category > .content > ul.overpass-layer-list {
   padding-top: 3px;