From 11a36b7782a950e14a8ddcc59a2d80fe6408f51c Mon Sep 17 00:00:00 2001
From: Louie S <louie@example.com>
Date: Mon, 3 Apr 2023 20:40:22 -0700
Subject: Changes to HTML layout

---
 frontend/index.html | 14 +++++++-------
 frontend/script.js  |  9 ++-------
 frontend/style.css  | 16 ++++++++++++----
 3 files changed, 21 insertions(+), 18 deletions(-)

(limited to 'frontend')

diff --git a/frontend/index.html b/frontend/index.html
index 4828dd9..44e988f 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -10,13 +10,13 @@
 			<h1>Dash Docset Viewer</h1>
 		</div>
 		<span id="main-body">
-			<table id="searchbar">
-				<tr>
-					<td scope="col">
-						<input type="search"></input>
-					</td>
-				</tr>
-			</table>
+			<div id="sidebar">
+				<input type="search" id="searchbar"></input>
+				<table id="docset-table">
+					<tbody>
+					</tbody>
+				</table>
+			</div>
 			<embed id="docset-page" type="text/html" src="./test.html">
 		</span>
 
diff --git a/frontend/script.js b/frontend/script.js
index 90dcb9a..6f4775e 100644
--- a/frontend/script.js
+++ b/frontend/script.js
@@ -1,5 +1,4 @@
 const endpoint = "http://127.0.0.1:8080/endpoints"
-let i = 0;
 
 
 function set_embed_page(url) {
@@ -7,12 +6,8 @@ function set_embed_page(url) {
 }
 
 function populateSearchBar(docset_json) {
-	//console.log(docset_json);
-	++i;
-	console.log(i);
-
-	// Add to search bar
-	document.getElementById("searchbar").getElementsByTagName("tbody")[0].innerHTML += "<tr>" +
+	// Add to docset-table
+	document.getElementById("docset-table").getElementsByTagName("tbody")[0].innerHTML += "<tr>" +
 		"<td scope=\"row\">" +
 		"<button id=\"docset-" + docset_json["CFBundleIdentifier"] + "-parent\" class=\"docset-parent\" onclick=\"set_embed_page('" + docset_json["docset_root"] + "')\">" +
 		docset_json["CFBundleName"] + 
diff --git a/frontend/style.css b/frontend/style.css
index 117e5f6..aa772ab 100644
--- a/frontend/style.css
+++ b/frontend/style.css
@@ -11,11 +11,15 @@ input {
 }
 
 #docset-page {
-	border: solid;
+	border-left: solid;
 	flex-grow: 4;
 	max-height: 100vh;
 }
 
+#docset-table {
+	border-top: solid;
+}
+
 #header {
 	display: none;
 	text-align: center;
@@ -23,10 +27,14 @@ input {
 
 #main-body {
 	display: flex;
-	height: 100vh;
 }
 
 #searchbar {
-	border: solid;
-	display: inline-block;
+	max-width: 20vw;
+}
+
+#sidebar {
+	border-right: solid;
+	display: inline-grid;
+	height: 100vh;
 }
-- 
cgit