From 44ce51e54f8f574d7bf2835a0704c17bb1f1984a Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Tue, 5 Dec 2017 21:55:01 +0300
Subject: [PATCH] dim regexp-tester note and avoid extending the report width

---
 edit/edit.css         |  6 ++++++
 edit/regexp-tester.js | 12 +++++++-----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/edit/edit.css b/edit/edit.css
index 4df2993d..11c1c08b 100644
--- a/edit/edit.css
+++ b/edit/edit.css
@@ -404,6 +404,12 @@ html:not(.usercss) .applies-to li:last-child .add-applies-to {
   margin-left: -20px;
   margin-top: -1px;
 }
+.regexp-report-note {
+  color: #999;
+  position: absolute;
+  margin: 0 0.5rem 0 0;
+  hyphens: auto;
+}
 /************ help popup ************/
 #help-popup {
   top: 3rem;
diff --git a/edit/regexp-tester.js b/edit/regexp-tester.js
index 4c5e63ff..8da9854c 100644
--- a/edit/regexp-tester.js
+++ b/edit/regexp-tester.js
@@ -160,13 +160,15 @@ var regExpTester = (() => {
           }
         }
       }
-      report.appendChild(
-        $create('p.regexp-report-note',
-          t('styleRegexpTestNote')
-            .split(/(\\+)/)
-            .map(s => (s.startsWith('\\') ? $create('code', s) : s))));
       showHelp(t('styleRegexpTestTitle'), report);
 
+      const note = $create('p.regexp-report-note',
+        t('styleRegexpTestNote')
+          .split(/(\\+)/)
+          .map(s => (s.startsWith('\\') ? $create('code', s) : s)));
+      report.appendChild(note);
+      report.style.paddingBottom = note.offsetHeight + 'px';
+
       report.onclick = event => {
         const target = event.target.closest('a, .regexp-report div');
         if (target) {