staticdash 0.4.1__py3-none-any.whl → 0.4.2__py3-none-any.whl

staticdash/assets/css/style.css

@@ -1,45 +1,49 @@
 body {
+  display: flex;
+  flex-direction: row;
+  min-height: 100vh;
   margin: 0;
   font-family: sans-serif;
-  background-color: #ffffff;
+  background-color: #f9f9f9;
   color: #333;
-  display: flex;
-  min-height: 100vh;
 }
 
-/* Sidebar */
 #sidebar {
+  position: fixed;
+  left: 0;
+  top: 0;
   width: 240px;
-  background-color: #ffffff;
-  border-right: 1px solid #ccc;
-  padding: 20px;
+  height: 100vh;
+  background-color: #2c3e50;
+  padding: 20px 20px 60px 20px;
   box-sizing: border-box;
   overflow-y: auto;
-  position: sticky;
-  top: 0;
-  height: 100vh;
-  display: flex;
-  flex-direction: column;
+  scrollbar-width: thin;
+  scrollbar-color: #888 #2c3e50;
+}
+
+#sidebar::-webkit-scrollbar {
+  width: 6px;
+}
+
+#sidebar::-webkit-scrollbar-track {
+  background: #2c3e50;
+}
+
+#sidebar::-webkit-scrollbar-thumb {
+  background-color: #888;
+  border-radius: 3px;
 }
 
-/* Sidebar header */
 #sidebar h1 {
-  color: #2c3e50;
+  color: #ecf0f1;
   font-size: 20px;
   margin-bottom: 20px;
 }
 
-/* Nav links container */
-#sidebar .nav-links {
-  flex-grow: 1;
-  display: flex;
-  flex-direction: column;
-}
-
-/* Nav links */
 .nav-link {
   display: block;
-  color: #2c3e50;
+  color: #bdc3c7;
   text-decoration: none;
   margin: 10px 0;
   font-weight: bold;
@@ -49,7 +53,8 @@ body {
 }
 
 .nav-link:hover {
-  background-color: #ecf0f1;
+  color: #ffffff;
+  background-color: #34495e;
 }
 
 .nav-link.active {
@@ -57,14 +62,16 @@ body {
   background-color: #1abc9c;
 }
 
-/* Sidebar footer */
 #sidebar-footer {
+  position: fixed;
+  bottom: 20px;
+  left: 20px;
+  width: 200px;
   font-size: 12px;
   color: #7f8c8d;
   text-align: center;
   line-height: 1.4;
-  padding-top: 20px;
-  border-top: 1px solid #ccc;
+  background-color: #2c3e50;
 }
 
 #sidebar-footer a {
@@ -76,35 +83,67 @@ body {
   text-decoration: underline;
 }
 
-/* Wrapper */
-#wrapper {
-  flex: 1;
-  background-color: #ffffff;
-  overflow-x: hidden;
+#content {
+  flex: 1 1 auto;
   display: flex;
   flex-direction: column;
-}
-
-#wrapper-inner {
-  max-width: 2200px;
-  margin: 0 auto;
   padding: 20px;
   box-sizing: border-box;
+  min-height: 100vh;
+  margin-left: 240px;
+  overflow-x: auto;
+  min-width: 0; /* Allow shrinking below 900px */
 }
 
-#content {
+.content-inner {
+  max-width: 900px;
   width: 100%;
-  box-sizing: border-box;
+  min-width: 0;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+@media (max-width: 1200px) {
+  #content {
+    max-width: 98vw;
+  }
+}
+
+@media (max-width: 940px) {
+  #content {
+    /* Keep margin-left: 240px; so content never jumps under sidebar */
+    min-width: 0;
+    padding: 10px;
+  }
+  .content-inner {
+    max-width: 100vw;
+    min-width: 0;
+    width: 100%;
+    overflow-x: auto;
+  }
+}
+
+@media (max-width: 800px) {
+  #content {
+    overflow-x: auto;
+  }
+  .content-inner {
+    width: 900px;
+    min-width: 900px;
+    max-width: 900px;
+  }
 }
 
 .page-section {
   display: none;
-  max-width: 100%;
-  overflow-x: auto;
+  width: 100%;
 }
 
 .page-section.active {
   display: block;
+  width: 100%;
 }
 
 .plot-container {
@@ -123,7 +162,7 @@ table {
   border-collapse: collapse;
   margin-top: 1em;
   background-color: white;
-  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   overflow-x: auto;
 }
 
@@ -132,7 +171,8 @@ thead {
   color: white;
 }
 
-th, td {
+th,
+td {
   padding: 10px;
   border: 1px solid #ddd;
   text-align: left;
@@ -146,14 +186,12 @@ tbody tr:hover {
   background-color: #e8f0fe;
 }
 
-/* Images */
 .dash-image {
   max-width: 100%;
   height: auto;
   margin: 1em 0;
 }
 
-/* Download Button */
 .download-button {
   display: inline-block;
   padding: 0.5em 1em;
@@ -169,7 +207,7 @@ tbody tr:hover {
   background-color: #547a9f;
 }
 
-/* Sortable Table Headers */
+/* Sortable Tables */
 table.sortable th {
   cursor: pointer;
   position: relative;
@@ -186,21 +224,20 @@ table.sortable th::after {
 }
 
 table.sortable th.sorted-asc::after {
-  content: "▲";
+  content: "\25B2";
 }
 
 table.sortable th.sorted-desc::after {
-  content: "▼";
+  content: "\25BC";
 }
 
 /* MiniPage Layout */
 .minipage-row {
   display: flex;
+  width: 100%;
   gap: 20px;
   margin-bottom: 20px;
-  max-width: 100%;
   box-sizing: border-box;
-  overflow-x: auto;
 }
 
 .minipage-cell {
@@ -222,7 +259,8 @@ table.sortable th.sorted-desc::after {
 }
 
 .minipage-cell .syntax-block {
-  margin: .5em 0;
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
 }
 
 .minipage-cell table {
@@ -246,8 +284,8 @@ table.sortable th.sorted-desc::after {
   padding: 1em;
   background: none;
   color: inherit;
-  font-family: 'Fira Mono','Consolas',monospace;
-  font-size: .95em;
+  font-family: 'Fira Mono', 'Consolas', monospace;
+  font-size: 0.95em;
 }
 
 .code-toolbar {
@@ -257,24 +295,30 @@ table.sortable th.sorted-desc::after {
   z-index: 2;
 }
 
-.copy-btn, .view-raw-btn {
+.copy-btn,
+.view-raw-btn {
   color: #fff;
   background: #444;
   border-radius: 4px;
   padding: 2px 8px;
-  font-size: .85em;
+  font-size: 0.85em;
   text-decoration: none;
   margin-left: 4px;
   cursor: pointer;
   transition: background 0.2s;
 }
 
-.copy-btn:hover, .view-raw-btn:hover {
+.copy-btn:hover,
+.view-raw-btn:hover {
   background: #1abc9c;
 }
 
-/* Table Wrapper */
 .table-wrapper {
   overflow-x: auto;
   width: 100%;
 }
+
+table, .syntax-block, pre {
+  max-width: 100%;
+  overflow-x: auto;
+}

staticdash/dashboard.py

@@ -2,6 +2,7 @@ import os
 import shutil
 import uuid
 import pandas as pd
+import plotly.graph_objects as go
 from dominate import document
 from dominate.tags import div, h1, h2, h3, h4, p, a, script, link
 from dominate.util import raw as raw_util
@@ -160,6 +161,7 @@ class Dashboard:
         os.makedirs(downloads_dir, exist_ok=True)
         shutil.copytree(assets_src, assets_dst, dirs_exist_ok=True)
 
+        # Per-page HTML
         for page in self.pages:
             doc = document(title=page.title)
             with doc.head:
@@ -171,23 +173,13 @@ class Dashboard:
                 doc.head.add(script(src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-python.min.js"))
                 doc.head.add(script(src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-javascript.min.js"))
             with doc:
-                with div(id="sidebar"):
-                    h1(self.title)
-                    with div(cls="nav-links"):
-                        for p in self.pages:
-                            a(p.title, cls="nav-link", href="#", **{"data-target": f"page-{p.slug}"})
-                    with div(id="sidebar-footer"):
-                        a("Produced by staticdash", href="https://pypi.org/project/staticdash/", target="_blank")
-                with div(id="wrapper"):
-                    with div(id="wrapper-inner"):
-                        with div(id="content"):
-                            for idx, p in enumerate(self.pages):
-                                with div(id=f"page-{p.slug}", cls="page-section", style="display:none;") as section:
-                                    for el in p.render(idx, downloads_dir=downloads_dir, relative_prefix=""):
-                                        section += el
+                with div(cls="page-section", id=f"page-{page.slug}") as section:
+                    for el in page.render(0, downloads_dir=downloads_dir, relative_prefix="../"):
+                        section += el
             with open(os.path.join(pages_dir, f"{page.slug}.html"), "w") as f:
                 f.write(str(doc))
 
+        # Main index.html
         index_doc = document(title=self.title)
         with index_doc.head:
             index_doc.head.add(link(rel="stylesheet", href="assets/css/style.css"))
@@ -201,19 +193,17 @@ class Dashboard:
         with index_doc:
             with div(id="sidebar"):
                 h1(self.title)
-                with div(cls="nav-links"):
-                    for page in self.pages:
-                        a(page.title, cls="nav-link", href="#", **{"data-target": f"page-{page.slug}"})
+                for page in self.pages:
+                    a(page.title, cls="nav-link", href="#", **{"data-target": f"page-{page.slug}"})
                 with div(id="sidebar-footer"):
                     a("Produced by staticdash", href="https://pypi.org/project/staticdash/", target="_blank")
 
-            with div(id="wrapper"):
-                with div(id="wrapper-inner"):
-                    with div(id="content"):
-                        for idx, page in enumerate(self.pages):
-                            with div(id=f"page-{page.slug}", cls="page-section", style="display:none;") as section:
-                                for el in page.render(idx, downloads_dir=downloads_dir, relative_prefix=""):
-                                    section += el
+            with div(id="content"):
+                with div(cls="content-inner"):
+                    for idx, page in enumerate(self.pages):
+                        with div(id=f"page-{page.slug}", cls="page-section", style="display:none;") as section:
+                            for el in page.render(idx, downloads_dir=downloads_dir, relative_prefix=""):
+                                section += el
 
         with open(os.path.join(output_dir, "index.html"), "w") as f:
-            f.write(str(index_doc))
+            f.write(str(index_doc))

{staticdash-0.4.1.dist-info → staticdash-0.4.2.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: staticdash
-Version: 0.4.1
+Version: 0.4.2
 Summary: A lightweight static HTML dashboard generator with Plotly and pandas support.
 Author-email: Brian Day <brian.day1@gmail.com>
 License: CC0-1.0

staticdash-0.4.2.dist-info/RECORD

@@ -0,0 +1,8 @@
+staticdash/__init__.py,sha256=KqViaDkiQnhBI8-j3hr14umLDmPgddvdB_G1nJeC5Xs,38
+staticdash/dashboard.py,sha256=wfFJ6XPSs711jUSWPkHzRxsAU02g7zzyA9rkIiWfbwA,9844
+staticdash/assets/css/style.css,sha256=mT-WK5zr3AoKENSrqYqL65pposLhbHKeuri8Xr6IjRo,4928
+staticdash/assets/js/script.js,sha256=pXqvTyw1LRNYl5u1kQbRtQkwe0dnd1yDs1Jstj7S-GU,4148
+staticdash-0.4.2.dist-info/METADATA,sha256=F0_mWymbExiHFnQJb69x8fJsqYp2r1vvtV07rkzJKdg,1776
+staticdash-0.4.2.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
+staticdash-0.4.2.dist-info/top_level.txt,sha256=3MzZU6SptkUkjcHV1cvPji0H4aRzPphLHnpStgGEcxM,11
+staticdash-0.4.2.dist-info/RECORD,,

staticdash-0.4.1.dist-info/RECORD

@@ -1,8 +0,0 @@
-staticdash/__init__.py,sha256=KqViaDkiQnhBI8-j3hr14umLDmPgddvdB_G1nJeC5Xs,38
-staticdash/dashboard.py,sha256=5CWNHWFRgE0-DRQCnsxtmTigMN_Q2MuTGVGj03eUMXk,10572
-staticdash/assets/css/style.css,sha256=wdTyRpTTYZtNOdb3NygdKYN6UEAKDwOoRx3-zyfphPQ,4232
-staticdash/assets/js/script.js,sha256=pXqvTyw1LRNYl5u1kQbRtQkwe0dnd1yDs1Jstj7S-GU,4148
-staticdash-0.4.1.dist-info/METADATA,sha256=Kw6f3V-VAbEFOlrx7Ea0IdCFA6V2fwv9MZgpIXF5uHU,1776
-staticdash-0.4.1.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
-staticdash-0.4.1.dist-info/top_level.txt,sha256=3MzZU6SptkUkjcHV1cvPji0H4aRzPphLHnpStgGEcxM,11
-staticdash-0.4.1.dist-info/RECORD,,