Merge remote-tracking branch 'origin/docs'

Author: vitalik

docs/docs/chat.md

@@ -1,3 +1,27 @@
-# Demo
+# Ask AI
 
-<strong>test</strong>
+Please feel free to share any questions or describe any problems you're encountering. Simply enter your text in the chat, and I'll be happy to assist you.
+
+<style>
+.serenity_chat__powered { display: none !important; }
+.md-sidebar--secondary { display: none !important; }
+.serenity_widget__container {
+    max-width: 1200px !important;
+}
+
+.serenity_app {
+    --serenity-answer-code-bg: #fafafa;
+    --serenity-widget-bg: #ffffff;
+}
+</style>
+
+<div id="serenity"></div>
+
+<script>
+var SERENITY_WIDGET = {
+    api_url: "https://public.serenitygpt.com/api/v2/",
+    api_token: "FqbM1QFShh5mGOD7",
+    popup: false,
+};
+</script>
+<script src="https://js.serenitygpt.com/widget.js"></script>

docs/docs/extra.css

@@ -1,3 +1,59 @@
 .doc-module code {
   white-space: nowrap;
 }
+
+/* Ask AI Button Styles */
+.ask-ai-button-container {
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+  margin-right: 1rem;
+}
+
+.ask-ai-button {
+  background-color: white !important;
+  color: #4caf50 !important;  /* Material green-500 */
+  padding: 0.4rem 0.5rem !important;
+  border-radius: 0.25rem;
+  font-weight: 500;
+  text-decoration: none;
+  font-size: 0.9rem;
+  border: 2px solid #4caf50;
+  transition: all 0.2s ease-in-out;
+  white-space: nowrap;
+  margin-left: 8px;
+}
+
+.ask-ai-button:hover {
+  background-color: #4caf50 !important;
+  color: white !important;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+}
+
+/* Dark mode support */
+[data-md-color-scheme="slate"] .ask-ai-button {
+  background-color: white !important;
+  color: #4caf50 !important;
+}
+
+[data-md-color-scheme="slate"] .ask-ai-button:hover {
+  background-color: #4caf50 !important;
+  color: white !important;
+}
+
+/* Responsive adjustments */
+@media screen and (max-width: 76.1875em) {
+  .ask-ai-button-container {
+    margin-right: 0.5rem;
+  }
+  .ask-ai-button {
+    padding: 0.4rem 0.8rem !important;
+    font-size: 0.85rem;
+  }
+}
+
+@media screen and (max-width: 60em) {
+  .ask-ai-button-container {
+    display: none;  /* Hide on mobile to save space */
+  }
+}

docs/docs/guides/api-docs.md

@@ -104,9 +104,9 @@ In a Django template, for example:
 To create your own view for OpenAPI - create a class inherited from DocsBase and overwrite `render_page` method:
 
 ```python
-form ninja.openapi.docs import DocsBase
+from ninja.openapi.docs import DocsBase
 
-class MyDocsViewer(DocsBase)
+class MyDocsViewer(DocsBase):
     def render_page(self, request, api):
         ... # return http response
 

docs/docs/javascripts/ask-ai-button.js

@@ -0,0 +1,32 @@
+// Add "Ask AI" button to the Material for MkDocs navbar
+document.addEventListener('DOMContentLoaded', function() {
+    // Find the header navigation actions (right side of navbar)
+    const headerActions = document.querySelector('.md-header__topic + .md-header__option');
+    const headerTitle = document.querySelector('.md-header__title');
+
+    if (headerTitle) {
+        // Create the Ask AI button
+        const askAiButton = document.createElement('a');
+        askAiButton.href = '/chat';  // Update this URL to your desired destination
+        askAiButton.className = 'md-button ask-ai-button';
+        askAiButton.textContent = 'Ask AI';
+        askAiButton.title = 'Ask AI about Django Ninja';
+
+        // Create a container for the button
+        const buttonContainer = document.createElement('div');
+        buttonContainer.className = 'ask-ai-button-container';
+        buttonContainer.appendChild(askAiButton);
+
+        // Insert the button after the header title
+        const header = document.querySelector('.md-header__inner');
+        if (header) {
+            // Find the right spot - after title, before search/repo buttons
+            const source = document.querySelector('.md-header__source');
+            if (source) {
+                header.insertBefore(buttonContainer, source);
+            } else {
+                header.appendChild(buttonContainer);
+            }
+        }
+    }
+});

docs/mkdocs.yml

@@ -10,6 +10,8 @@ extra:
     property: G-0E3XZ663ZR
 extra_css:
   - extra.css
+extra_javascript:
+  - javascripts/ask-ai-button.js
 theme:
   name: material
   palette: