fix ask-AI

my-blog/config.toml

@@ -16,7 +16,7 @@ auto_translate = false
 comment_moderation = false
 ask_ai = true
 provider = "ollama"
-model = "gemma3:2b"
+model = "gemma3:4b"
 host = "https://ollama.syui.ai"
 system_prompt = "you are a helpful ai assistant trained on this blog's content. you can answer questions about the articles, provide insights, and help users understand the topics discussed."
 ai_did = "did:plc:4hqjfn7m6n5hno3doamuhgef"

my-blog/static/_headers

@@ -17,7 +17,7 @@
 
 /css/*
   Content-Type: text/css
-  Cache-Control: public, max-age=60
+  Cache-Control: no-cache
 
 /*.js
   Content-Type: application/javascript

my-blog/static/_redirects

@@ -1,6 +1,3 @@
-# Ask-AI機能をOllamaにプロキシ
-/api/ask https://ollama.syui.ai/api/generate 200
-
 # OAuth routes
 /oauth/* /oauth/index.html 200
 

my-blog/static/css/style.css

@@ -59,7 +59,7 @@ a.view-markdown:any-link {
 .container {
     min-height: 100vh;
     display: grid;
-    grid-template-rows: auto auto 1fr auto;
+    grid-template-rows: auto 0fr 1fr auto;
     grid-template-areas: 
         "header"
         "ask-ai"
@@ -158,6 +158,15 @@ a.view-markdown:any-link {
     background: #f6f8fa;
     border-bottom: 1px solid #d1d9e0;
     padding: 24px;
+    overflow: hidden;
+}
+
+.ask-ai-panel[style*="block"] {
+    display: block !important;
+}
+
+.container:has(.ask-ai-panel[style*="block"]) {
+    grid-template-rows: auto auto 1fr auto;
 }
 
 .ask-ai-content {
@@ -193,13 +202,15 @@ a.view-markdown:any-link {
     grid-area: main;
     max-width: 1000px;
     margin: 0 auto;
-    padding: 24px;
+    /* padding: 24px; */
+    padding-top: 80px;
     width: 100%;
 }
 
 @media (max-width: 1000px) {
     .main-content {
-        padding: 20px;
+        /* padding: 20px; */
+        padding: 0px;
         max-width: 100%;
     }
 }
@@ -324,6 +335,10 @@ a.view-markdown:any-link {
     margin: 0 auto;
 }
 
+article.article-content {
+    padding: 10px;
+}
+
 .article-meta {
     display: flex;
     gap: 16px;
@@ -818,13 +833,13 @@ a.view-markdown:any-link {
         justify-self: end;
     }
     
-    /* Ask AI button mobile style */
+    /* Ask AI button mobile style - icon only */
     .ask-ai-btn {
         padding: 8px;
         min-width: 40px;
         justify-content: center;
-        font-size: 0;
         gap: 0;
+        font-size: 0; /* Hide all text content */
     }
     
     .ask-ai-btn .ai-icon {

my-blog/static/js/ask-ai.js

@@ -186,12 +186,7 @@ function updateAskAIButton() {
     const button = document.getElementById('askAiButton');
     if (!button) return;
     
-    const iconSpan = button.querySelector('.ai-icon');
-    
-    if (aiProfileData && aiProfileData.avatar && iconSpan) {
-        iconSpan.innerHTML = `<img src="${aiProfileData.avatar}" alt="${aiProfileData.displayName || 'AI'}" class="ai-avatar-small">`;
-    }
-    
+    // Only update text, never modify the icon
     if (aiProfileData && aiProfileData.displayName) {
         const textNode = button.childNodes[2] || button.lastChild;
         if (textNode && textNode.nodeType === Node.TEXT_NODE) {

my-blog/templates/base.html

@@ -66,7 +66,7 @@
                 
                 <div id="chatForm" class="ask-ai-form" style="display: none;">
                     <input type="text" id="aiQuestion" placeholder="What would you like to know?" />
-                    <button onclick="AskAI.ask()" id="askButton">Ask</button>
+                    <button onclick="askQuestion()" id="askButton">Ask</button>
                 </div>
                 
                 <div id="chatHistory" class="chat-history" style="display: none;"></div>