From d31116b54c5f4e294ee5c4350a05f2c4c219cddb Mon Sep 17 00:00:00 2001
From: ed <s@ocv.me>
Date: Sat, 6 Nov 2021 02:07:13 +0100
Subject: [PATCH] spaghetti unraveling

---
 copyparty/web/browser.css |  8 ++++++--
 copyparty/web/browser.js  | 10 +++++-----
 copyparty/web/splash.css  |  1 +
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css
index 22e598e1..508a005d 100644
--- a/copyparty/web/browser.css
+++ b/copyparty/web/browser.css
@@ -23,7 +23,7 @@ html, body {
 	margin: 0;
 	padding: 0;
 }
-pre, code, tt, #doc, #doc code {
+pre, code, tt, #doc, #doc>code {
 	font-family: 'scp', monospace, monospace;
 }
 #path,
@@ -681,6 +681,9 @@ input.eq_gain {
 	border-bottom: 1px solid #444;
 	overflow: hidden;
 }
+#treepar.off {
+	display: none;
+}
 #tree, #treeh {
 	border-radius: 0 .3em 0 0;
 }
@@ -1023,13 +1026,14 @@ html.light #rui {
 #doc.prism {
 	padding-left: 3em;
 }
-#doc code {
+#doc>code {
 	background: none;
 	box-shadow: none;
 	z-index: 1;
 }
 #doc.mdo {
 	white-space: normal;
+	font-family: sans-serif;
 }
 #doc.prism * {
 	line-height: 1.5em;
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 434e795d..bde35fd3 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -196,7 +196,7 @@ ebi('tree').innerHTML = (
 	'	<a href="#" class="btn" id="visdir" tt="scroll to selected folder">🎯</a>\n' +
 	'	<a href="#" class="tgl btn" id="filetree" tt="toggle folder-tree / textfiles$NHotkey: V">📃</a>\n' +
 	'	<a href="#" class="tgl btn" id="dyntree" tt="autogrow as tree expands">a</a>\n' +
-	'	<a href="#" class="tgl btn" id="parpane" tt="show parent folders in a docked pane at the top">▀</a>\n' +
+	'	<a href="#" class="tgl btn" id="parpane" tt="show parent folders in a docked pane at the top">📌</a>\n' +
 	'	<a href="#" class="tgl btn" id="wraptree" tt="word wrap">↵</a>\n' +
 	'	<a href="#" class="tgl btn" id="hovertree" tt="reveal overflowing lines on hover$N( breaks scrolling unless mouse $N&nbsp; cursor is in the left gutter )">👀</a>\n' +
 	'</div>\n' +
@@ -2901,7 +2901,7 @@ function tree_up() {
 
 document.onkeydown = function (e) {
 	var ae = document.activeElement, aet = '';
-	if (ae && ae != document.body)
+	if (ae && ae != document.body && ae.tagName != 'PRE')
 		aet = ae.nodeName.toLowerCase();
 
 	if (e.altKey || e.isComposing)
@@ -3412,8 +3412,8 @@ var treectl = (function () {
 			compy();
 		}
 
-		if (!r.parpane || !r.pdir.length || y > r.pdir.slice(-1)[0][0] || y < r.pdir[0][0]) {
-			parp.style.display = 'none';
+		if (!r.parpane || !r.pdir.length || y >= r.pdir.slice(-1)[0][0] || y <= r.pdir[0][0]) {
+			clmod(parp, 'off', 1);
 			r.pdirh = null;
 		}
 		else {
@@ -3431,7 +3431,7 @@ var treectl = (function () {
 			if (h1 != r.pdirh) {
 				r.pdirh = h1;
 				parp.innerHTML = h1;
-				parp.style.display = '';
+				clmod(parp, 'off');
 				var els = QSA('#treepar a');
 				for (var a = 0, aa = els.length; a < aa; a++)
 					els[a].onclick = bad_proxy;
diff --git a/copyparty/web/splash.css b/copyparty/web/splash.css
index 2bde5add..4c6fd5ea 100644
--- a/copyparty/web/splash.css
+++ b/copyparty/web/splash.css
@@ -52,6 +52,7 @@ table {
 .vols th {
 	padding: .3em .6em;
 	text-align: left;
+	white-space: nowrap;
 }
 .num {
 	border-right: 1px solid #bbb;