feat: Add AI BIDS assistant widget to the specification pages

mkdocs.yml

@@ -56,6 +56,7 @@ exclude_docs: |
   pregh-changes.md
 theme:
   name: material
+  custom_dir: src/overrides
   favicon: images/favicon.png
   logo: images/logo.png
   features:
@@ -111,6 +112,7 @@ extra_javascript:
 extra_css:
   - css/tsv.css
   - css/dynamic-width.css
+  - css/assistant.css
 markdown_extensions:
   - toc:
       anchorlink: true

src/css/assistant.css

@@ -0,0 +1,55 @@
+/* Assistant widget styles */
+.assistant-toggle {
+  position: fixed;
+  bottom: 20px;
+  right: 20px;
+  z-index: 1000;
+  padding: 12px 24px;
+  background-color: #2196F3;
+  color: white;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  transition: background-color 0.3s ease;
+}
+
+.assistant-toggle:hover {
+  background-color: #1976D2;
+}
+
+.assistant-container {
+  position: fixed;
+  bottom: 70px;
+  right: 20px;
+  width: 400px;
+  height: 600px;
+  z-index: 999;
+  display: none;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
+  border-radius: 8px;
+  overflow: hidden;
+  background-color: white;
+}
+
+.assistant-container.show {
+  display: block;
+}
+
+.assistant-iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+}
+
+/* Responsive adjustments */
+@media (max-width: 768px) {
+  .assistant-container {
+    width: calc(100vw - 40px);
+    height: calc(100vh - 120px);
+    bottom: 70px;
+    right: 20px;
+  }
+}

src/overrides/main.html

@@ -0,0 +1,30 @@
+{% extends "base.html" %}
+
+{% block content %}
+  {{ super() }}
+
+  <!-- Assistant widget -->
+  <div class="assistant-container">
+    <iframe class="assistant-iframe"></iframe>
+  </div>
+  <button class="assistant-toggle">Open Assistant</button>
+
+  <script>
+    document.addEventListener('DOMContentLoaded', function() {
+      const toggle = document.querySelector('.assistant-toggle');
+      const container = document.querySelector('.assistant-container');
+      const iframe = document.querySelector('.assistant-iframe');
+      let iframeLoaded = false;
+
+      toggle.addEventListener('click', function() {
+        const isShowing = container.classList.toggle('show');
+
+        // Load iframe content only when first opened
+        if (isShowing && !iframeLoaded) {
+          iframe.src = 'https://bids-assistant.neurosift.app/';
+          iframeLoaded = true;
+        }
+      });
+    });
+  </script>
+{% endblock %}