From 006e6ff0e458e5f2125a312479a477643cc197dc Mon Sep 17 00:00:00 2001
From: Nicholas Bollweg <nick.bollweg@gmail.com>
Date: Wed, 13 Dec 2023 09:14:27 -0600
Subject: [PATCH] more theme fixing

---
 docs/_static/css/theme.css    | 26 ------------
 docs/_templates/shaver.html   |  2 +-
 docs/graph.md                 | 80 ++++++++++++++++++++++++++++++-----
 src/jupyak/tasks/_graph.ipynb | 52 ++++++++++++++++++++++-
 4 files changed, 121 insertions(+), 39 deletions(-)

diff --git a/docs/_static/css/theme.css b/docs/_static/css/theme.css
index 188fe93..3f09af8 100644
--- a/docs/_static/css/theme.css
+++ b/docs/_static/css/theme.css
@@ -100,32 +100,6 @@ table.jsonschema h2 {
   transition: stroke stroke-width 0.5s;
 }
 
-#task-graph-legend {
-  position: fixed;
-  bottom: 100px;
-  right: 0;
-  pointer-events: none;
-  opacity: 0.75;
-  width: 800px;
-}
-
-input[id*='svg-zoom-1']:checked ~ svg {
-  width: 100%;
-  transition: width 0.5s;
-}
-input[id*='svg-zoom-2']:checked ~ svg {
-  width: 200%;
-  transition: width 0.5s;
-}
-input[id*='svg-zoom-4']:checked ~ svg {
-  width: 400%;
-  transition: width 0.5s;
-}
-input[id*='svg-zoom-8']:checked ~ svg {
-  width: 800%;
-  transition: width 0.5s;
-}
-
 /* form sidebar*/
 
 form#propose button {
diff --git a/docs/_templates/shaver.html b/docs/_templates/shaver.html
index 63b2338..fb5f73f 100644
--- a/docs/_templates/shaver.html
+++ b/docs/_templates/shaver.html
@@ -1,6 +1,6 @@
 <!--
   {% if not prjsf_url %}
-  {% set prjsf_url = pathto("_static/prjsf/prjsf.js", 1) %}
+  {% set prjsf_url = "./" ~ pathto("_static/prjsf/prjsf.js", 1) %}
   {% endif %}
 -->
 <script type="module">
diff --git a/docs/graph.md b/docs/graph.md
index d69df5d..eb3ed6d 100644
--- a/docs/graph.md
+++ b/docs/graph.md
@@ -1,13 +1,60 @@
+
+<style>
+h1, footer, .bd-header-article {
+    display: none;
+}
+.blurb {
+    position: fixed;
+    top: 5em;
+    right: 1em;
+    max-width: 20em;
+    background-color: var(--pst-color-on-background);
+    padding: 0.5em;
+}
+
+#task-graph-legend {
+  position: fixed;
+  bottom: 1em;
+  right: 0;
+  pointer-events: none;
+  opacity: 0.75;
+  width: 800px;
+}
+
+input[id*='svg-zoom-1']:checked ~ svg {
+  width: 100%;
+  transition: width 0.5s;
+}
+input[id*='svg-zoom-2']:checked ~ svg {
+  width: 200%;
+  transition: width 0.5s;
+}
+input[id*='svg-zoom-4']:checked ~ svg {
+  width: 400%;
+  transition: width 0.5s;
+}
+input[id*='svg-zoom-8']:checked ~ svg {
+  width: 800%;
+  transition: width 0.5s;
+}
+</style>
+
 # graph
 
+<div class="blurb">
 
-The graph below shows the current state of the executed graph of tasks to go from
+<details>
+<summary>what is this?</summary>
+
+This graph shows the last state of the executed tasks to go from
 <code>git clone</code> to <code>jupyter lite build</code>.
 
 <blockquote>
 Some tasks, such as extracting <code>conda</code> dependencies from <code>pyproject.toml</code>
 files, have been elided to highlight the relationships between repositories.
 </blockquote>
+</details>
+
 
 
 <div class="jp-Mermaid" id="task-graph-legend">
@@ -35,6 +82,9 @@ end
 </div>
 </div>
 
+</div>
+
+
 <div class="jp-Mermaid" id="task-graph">
 <label>Zoom: </label>
 <input type="radio" id="task-graph-svg-zoom-1" name="task-graph-svg-zoom" checked><label for="svg-zoom-1"> 1x</label>
@@ -51,6 +101,7 @@ classDef git fill:#f1502f,color:#fff;
 classDef hack fill:#000,color:#fff;
 shave:js:jupyterlab:yarn:build:prod:dev_mode --> jupyterlab:sweep:assets
 shave:js:jupyterlab:yarn:builder:. --> jupyterlab:sweep:labextension
+shave:git:lite:gist:fetch:main --> shave:git:lite:gist:checkout
 shave:git:traitlets:fetch:main --> shave:git:traitlets:checkout
 shave:git:comm:fetch:main --> shave:git:comm:checkout
 shave:git:lumino:fetch:main --> shave:git:lumino:checkout
@@ -71,7 +122,9 @@ shave:git:jupyterlab_lsp:fetch:main --> shave:git:jupyterlab_lsp:checkout
 shave:git:jupyterlab:fetch:main --> shave:git:jupyterlab:checkout
 shave:git:notebook:fetch:main --> shave:git:notebook:checkout
 shave:git:ipywidgets:fetch:main --> shave:git:ipywidgets:checkout
+shave:git:ipywidgets:fetch:pr-3847 --> shave:git:ipywidgets:checkout
 shave:git:jupyterlite:fetch:main --> shave:git:jupyterlite:checkout
+shave:git:jupyterlite:fetch:pr-1263 --> shave:git:jupyterlite:checkout
 shave:git:jupyterlite_pyodide_kernel:fetch:main --> shave:git:jupyterlite_pyodide_kernel:checkout
 shave:git:lumino:checkout --> shave:js:lumino:yarn:install
 shave:js:yarnrc --> shave:js:lumino:yarn:install
@@ -293,6 +346,7 @@ jupyterlab:sweep:labextension --> shave:py:jupyterlite_pyodide_kernel:labext:pyo
 shave:js:jupyterlite_pyodide_kernel:yarn:build:py:wheels:pyodide-kernel --> shave:py:jupyterlite_pyodide_kernel:labext:pyodide-kernel-extension
 shave:js:jupyterlite_pyodide_kernel:yarn:build:lib:pyodide-kernel-extension --> shave:py:jupyterlite_pyodide_kernel:labext:pyodide-kernel-extension
 shave:py:jupyterlab:pip:jupyterlab --> shave:py:jupyterlite_pyodide_kernel:labext:pyodide-kernel-extension
+shave:git:lite:gist:checkout --> shave:lite:config
 shave:py:traitlets:wheel:traitlets --> shave:lite:config
 shave:py:comm:wheel:comm --> shave:lite:config
 shave:py:jupyter_core:wheel:jupyter_core --> shave:lite:config
@@ -323,7 +377,7 @@ subgraph jupyterlab
   jupyterlab:sweep:assets(("`✅ **assets**`")):::hack
   jupyterlab:sweep:labextension(("`✅ **labextension**`")):::hack
   shave:git:jupyterlab:fetch:main[("`✅ **fetch main**`")]:::git
-  shave:git:jupyterlab:checkout[("`💭 **checkout**`")]:::git
+  shave:git:jupyterlab:checkout[("`✅ **checkout**`")]:::git
   shave:js:jupyterlab:yarn:install{{"`✅ **yarn install**`"}}:::js
   shave:js:jupyterlab:yarn:buildutils:.{{"`✅ **yarn buildutils .**`"}}:::js
   shave:js:jupyterlab:yarn:builder:.{{"`✅ **yarn builder .**`"}}:::js
@@ -332,6 +386,12 @@ subgraph jupyterlab
   shave:js:jupyterlab:dist{{"`✅ **dist**`"}}:::js
   shave:py:jupyterlab:pip:jupyterlab["`✅ **pip jupyterlab**`"]:::py
 end
+subgraph lite
+  shave:git:lite:gist:fetch:main[("`💭 **gist fetch main**`")]:::git
+  shave:git:lite:gist:checkout[("`💭 **gist checkout**`")]:::git
+  shave:lite:config(["`❌ **config**`"]):::jupyter
+  shave:lite:build(["`✅ **build**`"]):::jupyter
+end
 subgraph traitlets
   shave:git:traitlets:fetch:main[("`✅ **fetch main**`")]:::git
   shave:git:traitlets:checkout[("`✅ **checkout**`")]:::git
@@ -346,7 +406,7 @@ subgraph comm
 end
 subgraph lumino
   shave:git:lumino:fetch:main[("`✅ **fetch main**`")]:::git
-  shave:git:lumino:checkout[("`💭 **checkout**`")]:::git
+  shave:git:lumino:checkout[("`✅ **checkout**`")]:::git
   shave:js:lumino:yarn:install{{"`✅ **yarn install**`"}}:::js
   shave:js:lumino:yarn:build:.{{"`✅ **yarn build .**`"}}:::js
   shave:js:lumino:dist{{"`✅ **dist**`"}}:::js
@@ -441,7 +501,8 @@ subgraph notebook
 end
 subgraph ipywidgets
   shave:git:ipywidgets:fetch:main[("`✅ **fetch main**`")]:::git
-  shave:git:ipywidgets:checkout[("`✅ **checkout**`")]:::git
+  shave:git:ipywidgets:fetch:pr-3847[("`💭 **fetch pr-3847**`")]:::git
+  shave:git:ipywidgets:checkout[("`💭 **checkout**`")]:::git
   shave:js:ipywidgets:yarn:install{{"`✅ **yarn install**`"}}:::js
   shave:js:ipywidgets:yarn:build:base{{"`✅ **yarn build base**`"}}:::js
   shave:js:ipywidgets:yarn:build:controls{{"`✅ **yarn build controls**`"}}:::js
@@ -459,8 +520,9 @@ subgraph ipywidgets
 end
 subgraph jupyterlite
   shave:git:jupyterlite:fetch:main[("`✅ **fetch main**`")]:::git
-  shave:git:jupyterlite:checkout[("`✅ **checkout**`")]:::git
-  shave:js:jupyterlite:yarn:install{{"`✅ **yarn install**`"}}:::js
+  shave:git:jupyterlite:fetch:pr-1263[("`💭 **fetch pr-1263**`")]:::git
+  shave:git:jupyterlite:checkout[("`💭 **checkout**`")]:::git
+  shave:js:jupyterlite:yarn:install{{"`💭 **yarn install**`"}}:::js
   shave:js:jupyterlite:yarn:build:.{{"`✅ **yarn build .**`"}}:::js
   shave:js:jupyterlite:dist{{"`✅ **dist**`"}}:::js
   shave:py:jupyterlite:pip:jupyterlite["`✅ **pip jupyterlite**`"]:::py
@@ -482,9 +544,5 @@ end
 subgraph yarnrc
   shave:js:yarnrc{{"`✅ **yarnrc**`"}}:::js
 end
-subgraph lite
-  shave:lite:config(["`💭 **config**`"]):::jupyter
-  shave:lite:build(["`💭 **build**`"]):::jupyter
-end
 </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/jupyak/tasks/_graph.ipynb b/src/jupyak/tasks/_graph.ipynb
index b15e7f5..0b1761f 100644
--- a/src/jupyak/tasks/_graph.ipynb
+++ b/src/jupyak/tasks/_graph.ipynb
@@ -59,13 +59,58 @@
     "}\n",
     "GRAPH_OPTIONS = {\"flowchart\": {\"defaultRenderer\": \"elk\"}}\n",
     "BLURB = \"\"\"\n",
-    "The graph below shows the current state of the executed graph of tasks to go from\n",
+    "<details>\n",
+    "<summary>what is this?</summary>\n",
+    "\n",
+    "This graph shows the last state of the executed tasks to go from\n",
     "<code>git clone</code> to <code>jupyter lite build</code>.\n",
     "\n",
     "<blockquote>\n",
     "Some tasks, such as extracting <code>conda</code> dependencies from <code>pyproject.toml</code>\n",
     "files, have been elided to highlight the relationships between repositories.\n",
     "</blockquote>\n",
+    "</details>\n",
+    "\"\"\"\n",
+    "STYLE = \"\"\"\n",
+    "<style>\n",
+    "h1, footer, .bd-header-article {\n",
+    "    display: none;\n",
+    "}\n",
+    ".blurb {\n",
+    "    position: fixed;\n",
+    "    top: 5em;\n",
+    "    right: 1em;\n",
+    "    max-width: 20em;\n",
+    "    background-color: var(--pst-color-on-background);\n",
+    "    padding: 0.5em;\n",
+    "}\n",
+    "\n",
+    "#task-graph-legend {\n",
+    "  position: fixed;\n",
+    "  bottom: 1em;\n",
+    "  right: 0;\n",
+    "  pointer-events: none;\n",
+    "  opacity: 0.75;\n",
+    "  width: 800px;\n",
+    "}\n",
+    "\n",
+    "input[id*='svg-zoom-1']:checked ~ svg {\n",
+    "  width: 100%;\n",
+    "  transition: width 0.5s;\n",
+    "}\n",
+    "input[id*='svg-zoom-2']:checked ~ svg {\n",
+    "  width: 200%;\n",
+    "  transition: width 0.5s;\n",
+    "}\n",
+    "input[id*='svg-zoom-4']:checked ~ svg {\n",
+    "  width: 400%;\n",
+    "  transition: width 0.5s;\n",
+    "}\n",
+    "input[id*='svg-zoom-8']:checked ~ svg {\n",
+    "  width: 800%;\n",
+    "  transition: width 0.5s;\n",
+    "}\n",
+    "</style>\n",
     "\"\"\""
    ]
   },
@@ -234,12 +279,14 @@
     "def div_wrappers(chunks: list[str], dom_id=None, show_zoom=False, legend=False) -> str:\n",
     "    dom_id = dom_id or f\"id-{uuid4()}\"\n",
     "    chunks = [\n",
+    "        \"\",\n",
     "        f\"\"\"<div class=\"jp-Mermaid\" id=\"{dom_id}\">\"\"\",\n",
     "        zoom(f\"{dom_id}-\") if show_zoom else \"\",\n",
     "        \"\"\"<div class=\"mermaid\">\"\"\",\n",
     "        *chunks,\n",
     "        \"</div>\",\n",
     "        \"</div>\",\n",
+    "        \"\",\n",
     "    ]\n",
     "    return \"\\n\".join(chunks)"
    ]
@@ -271,11 +318,14 @@
     "def write_graph(dest: Path, **options):\n",
     "    dest.parent.mkdir(parents=True, exist_ok=True)\n",
     "    chunks = [\n",
+    "        STYLE,\n",
     "        \"# graph\",\n",
     "        \"\",\n",
+    "        \"\"\"<div class=\"blurb\">\"\"\",\n",
     "        BLURB,\n",
     "        \"\",\n",
     "        div_wrappers(build_legend(), dom_id=\"task-graph-legend\"),\n",
+    "        \"\"\"</div>\"\"\",\n",
     "        \"\",\n",
     "        div_wrappers(build_graph(**options), dom_id=\"task-graph\", show_zoom=True),\n",
     "    ]\n",