summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorLouie S <louie@example.com>2023-04-03 20:40:22 -0700
committerLouie S <louie@example.com>2023-04-03 20:40:22 -0700
commit11a36b7782a950e14a8ddcc59a2d80fe6408f51c (patch)
tree4ca7e5af7cc1e84d9c4fa8964501a720424beadc
parentd8c68fe9cc59f667478bb763cf690d8f771afa59 (diff)
Changes to HTML layout
-rw-r--r--frontend/index.html14
-rw-r--r--frontend/script.js9
-rw-r--r--frontend/style.css16
3 files changed, 21 insertions, 18 deletions
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;
}