aboutsummaryrefslogtreecommitdiff
path: root/html/display_panel/content
diff options
context:
space:
mode:
authorhackademix <giorgio@maone.net>2019-02-25 23:05:22 +0100
committerhackademix <giorgio@maone.net>2019-02-25 23:05:22 +0100
commit5d9ab3778bcdb12913333deff64196590688789f (patch)
tree2423bfebc6d5fa0727edbfb3dbc2ebaa13615c70 /html/display_panel/content
parent881101334654012dd2289b5a73f123bb5d55a462 (diff)
Cosmetic changes to the inline code viewer toggle button.
Diffstat (limited to 'html/display_panel/content')
-rw-r--r--html/display_panel/content/display-panel.html6
-rw-r--r--html/display_panel/content/main_panel.js11
-rw-r--r--html/display_panel/content/panel-styles.css12
3 files changed, 24 insertions, 5 deletions
diff --git a/html/display_panel/content/display-panel.html b/html/display_panel/content/display-panel.html
index 5eccf60..5b9f99f 100644
--- a/html/display_panel/content/display-panel.html
+++ b/html/display_panel/content/display-panel.html
@@ -73,8 +73,10 @@
</p>
<ul>
<li id="li-template">
- <button class="toggle-source" title="Show/Hide code inline">👓</button><a class="script-url" href="#"></a>:
- <pre class="source">No code</pre>
+ <button class="toggle-source show" title="Show code inline">Show</button>
+ <button class="toggle-source hide" title="Hide code inline">Hide</button>
+ <a class="script-url" href="#" target="librejs_viewsource"></a>:
+ <pre class="source"></pre>
<p class="reason"></p>
<div class="buttons">
<button class="whitelist">Whitelist</button>
diff --git a/html/display_panel/content/main_panel.js b/html/display_panel/content/main_panel.js
index 60eae55..022be8c 100644
--- a/html/display_panel/content/main_panel.js
+++ b/html/display_panel/content/main_panel.js
@@ -55,8 +55,17 @@ liTemplate.remove();
document.querySelector("#info").addEventListener("click", e => {
let button = e.target;
+ if (button.tagName === "A") {
+ setTimeout(close, 100);
+ return;
+ }
if (button.matches(".toggle-source")) {
- let sourceContainer = button.parentNode.querySelector(".source").classList.toggle("visible");
+ let parent = button.parentNode;
+ if (!parent.querySelector(".source").textContent) {
+ parent.querySelector("a").click();
+ } else {
+ parent.classList.toggle("visible");
+ }
return;
}
if (!button.matches(".buttons > button")) return;
diff --git a/html/display_panel/content/panel-styles.css b/html/display_panel/content/panel-styles.css
index 1bacc01..502323f 100644
--- a/html/display_panel/content/panel-styles.css
+++ b/html/display_panel/content/panel-styles.css
@@ -110,8 +110,12 @@ button:disabled {
}
button.toggle-source {
- display: none;
+ color: #004;
+ margin-right: .5em;
+ width: 4em;
+ overflow: hide;
}
+
pre.source {
display: none;
background: white;
@@ -121,7 +125,11 @@ pre.source {
max-height: 8em;
white-space: pre-wrap;
}
-pre.source.visible { display: block }
+
+button.hide { display: none }
+.visible > button.show { display: none !important}
+.visible > pre.source { display: block }
+.visible > button.hide { display: initial }
span.accepted, span.blocked {
color:#008e00;