Update app.py

app.py

@@ -17,7 +17,6 @@ if torch.cuda.is_available():
 
 STYLE = """
 .custom-container {
-	width: 100%;
 	display: grid;
 	align-items: center;
     margin: 0!important;
@@ -29,6 +28,10 @@ STYLE = """
 .prose li {
     margin-bottom: 0!important;
 }
+.prose table {
+    margin-bottom: 0!important;
+}
+
 .prose td, th {
     padding-left: 2px;
     padding-right: 2px;
@@ -46,6 +49,12 @@ STYLE = """
 	text-align: center;
     display:inline-block;
 }
+
+#root {
+    display: inline-grid!important;
+    width:auto!important;
+}
+
 .tree ul {
     padding-left: 20px;
     position: relative;
@@ -80,7 +89,7 @@ STYLE = """
 }
 .tree li::after {
     top: 50%;
-    height: 70%;
+    height: 55%;
     bottom: auto;
     border-top: 1px solid var(--body-text-color);
 }
@@ -118,12 +127,14 @@ STYLE = """
 .tree li a {
 	border: 1px solid var(--body-text-color);
 	padding: 5px;
-	display: inline-grid;
 	border-radius: 5px;
 	text-decoration-line: none;
 	border-radius: 5px;
 	transition: .5s;
-    width: 200px;
+    width: 260px;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
 }
 .tree li a span {
 	padding: 5px;
@@ -141,20 +152,21 @@ STYLE = """
 }
 .chosen {
     background-color: #ea580c;
+    width:auto!important;
 }
 """
 
 
-def generate_nodes(token, node):
+def generate_nodes(token, node, step=0):
     """Recursively generate HTML for the tree nodes."""
 
-    html_content = f" <li> <a href='#' class={('chosen' if node.table is None else '')}> <span> <b>{token}</b> </span> "
+    html_content = f" <li> <a href='#' class='{('chosen' if node.table is None else '')}' id='{('root' if step==0 else '')}'> <span> <b>{token}</b> </span> "
     html_content += node.table if node.table is not None else ""
     html_content += "</a>"
     if len(node.children.keys()) > 0:
         html_content += "<ul> "
         for token, subnode in node.children.items():
-            html_content += generate_nodes(token, subnode)
+            html_content += generate_nodes(token, subnode, step=step + 1)
         html_content += "</ul>"
     html_content += "</li>"
     return html_content