Interact Button in Documentation (#1697)

* first draft of button * Create button with Jaladh's code Co-authored-by: Jaladh Singhal <[email protected]> * Fixing indentation problem * Fix hovering color Co-authored-by: Jaladh Singhal <[email protected]> * fixing github link * deleting last line and changing title case Co-authored-by: Jaladh Singhal <[email protected]>
tardis-sn · Jul 23, 2021 · 8caeca3 · 8caeca3
1 parent f27fe3d
commit 8caeca3
Showing 1 changed file with 36 additions and 4 deletions.
diff --git a/docs/conf.py b/docs/conf.py
@@ -119,10 +119,42 @@
     "--InlineBackend.rc={'figure.dpi': 96}",
 ]
 
-nbsphinx_prolog = """
-This notebook is available at 
-https://github.com/tardis-sn/tardis/tree/master/docs/{{ env.doc2path(env.docname, base=None) }}
-
+nbsphinx_prolog = r"""
+{% set docname = 'docs/' + env.doc2path(env.docname, base=None) %}
+.. raw:: html
+    
+    <style>
+        .launch-btn {
+            background-color: #2980B9;
+            border: none;
+            border-radius: 4px;
+            color: #fcfcfc;
+            font-family: inherit;
+            text-decoration: none;
+            padding: 3px 8px;
+            letter-spacing: 0.03em;
+            display: inline-block;
+            line-height: 1.5em;
+        }
+
+        .launch-btn:hover {
+            background-color: #1b6391;
+            color: #fcfcfc;
+        }
+
+        .launch-btn:visited {
+            color: #fcfcfc;
+        }
+
+        .note-p {
+            margin-bottom: 0.4em;
+            line-height: 2em;
+        }
+    </style>
+    
+    <div class="admonition note">
+    <p class="note-p">You can interact with this notebook online: <a href="https://mybinder.org/v2/gh/tardis-sn/tardis/HEAD?filepath={{ docname|e }}" class="launch-btn" target="_blank" rel="noopener noreferrer">Launch interactive version</a></p>
+    </div>
 """
 
 if os.getenv("DISABLE_NBSPHINX") == "1":