Cleaned up Slave Interact controls

src/interaction/siNavigation.js

@@ -17,25 +17,24 @@ App.UI.SlaveInteract.navigation = function(slave) {
 	}
 
 	const placeInLine = App.UI.SlaveInteract.placeInLine(slave);
+	const controls = App.UI.DOM.appendNewElement("div", p);
+	const previous = App.UI.DOM.makeElement("span", App.UI.DOM.passageLink(" Prev ", "Slave Interact",
+		() => { V.AS = placeInLine[0]; }), ["adjacent-slave"]);
+	const next = App.UI.DOM.makeElement("span", App.UI.DOM.passageLink(" Next ", "Slave Interact",
+		() => { V.AS = placeInLine[1]; }), ["adjacent-slave"]);
 
-	App.UI.DOM.appendNewElement("span", p, App.UI.Hotkeys.hotkeys("prev-slave"), "hotkey");
-	const prevSpan = App.UI.DOM.makeElement("span", App.UI.DOM.passageLink("Prev", "Slave Interact",
-		() => { V.AS = placeInLine[0]; }), "adjacent-slave");
-	prevSpan.id = "prev-slave";
-	p.append(" ", prevSpan);
+	previous.id = "prev-slave";
+	next.id = "next-slave";
 
-	const centerSpan = document.createElement("span");
-	centerSpan.classList.add("interact-name");
+	controls.append(
+		App.UI.DOM.makeElement("span", App.UI.Hotkeys.hotkeys("prev-slave"), ['hotkey']),
+		previous,
+		App.UI.DOM.makeElement("span", App.UI.favoriteToggle(slave)),
+		next,
+		App.UI.DOM.makeElement("span", App.UI.Hotkeys.hotkeys("next-slave"), ['hotkey']),
+	);
 
-	App.UI.DOM.appendNewElement("span", centerSpan, slave.slaveName, "slave-name");
-	centerSpan.append(" ", App.UI.favoriteToggle(slave));
-	p.append(centerSpan);
-
-	const nextSpan = App.UI.DOM.makeElement("span", App.UI.DOM.passageLink("Next", "Slave Interact",
-		() => { V.AS = placeInLine[1]; }), "adjacent-slave");
-	nextSpan.id = "next-slave";
-	p.append(nextSpan, " ");
-	App.UI.DOM.appendNewElement("span", p, App.UI.Hotkeys.hotkeys("next-slave"), "hotkey");
+	App.UI.DOM.appendNewElement("h1", p, SlaveFullName(slave), ['slave-name']);
 
 	return p;
 };

src/interaction/slaveInteract.js

@@ -163,7 +163,7 @@ App.UI.SlaveInteract.mainPage = function(slave) {
 		const el = new DocumentFragment();
 		App.Events.drawEventArt(el, slave);
 		for (const tab of tabs) {
-			App.UI.DOM.appendNewElement("h1", el, tab.title);
+			App.UI.DOM.appendNewElement("h2", el, tab.title);
 			el.append(tab.node);
 		}
 		return el;