feat: Add new content indicators for Documentation tab and update links in modals

static/css/components/modal.css

@@ -751,6 +751,29 @@ input:checked + .toggle-slider:before {
   opacity: 1;
 }
 
+/* Add styles for tab with new content indicator */
+.tab-btn.has-new-content {
+  position: relative;
+}
+
+.tab-btn.has-new-content::after {
+  content: "";
+  position: absolute;
+  top: 4px;
+  right: 4px;
+  width: 8px;
+  height: 8px;
+  background-color: var(--lora-accent);
+  border-radius: 50%;
+  animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+  0% { opacity: 1; transform: scale(1); }
+  50% { opacity: 0.7; transform: scale(1.1); }
+  100% { opacity: 1; transform: scale(1); }
+}
+
 /* Tab content styles */
 .help-content {
   padding: var(--space-1) 0;
@@ -817,6 +840,37 @@ input:checked + .toggle-slider:before {
   text-decoration: underline;
 }
 
+/* New content badge styles */
+.new-content-badge {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.7em;
+  font-weight: 600;
+  background-color: var(--lora-accent);
+  color: var(--lora-text);
+  padding: 2px 6px;
+  border-radius: 10px;
+  margin-left: 8px;
+  vertical-align: middle;
+  animation: fadeIn 0.5s ease-in-out;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.new-content-badge.inline {
+  font-size: 0.65em;
+  padding: 1px 4px;
+  margin-left: 6px;
+  border-radius: 8px;
+}
+
+/* Dark theme adjustments for new content badge */
+[data-theme="dark"] .new-content-badge {
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+}
+
 /* Update video list styles */
 .video-list {
   display: flex;

static/js/managers/HelpManager.js

@@ -6,7 +6,7 @@ import { getStorageItem, setStorageItem } from '../utils/storageHelpers.js';
 export class HelpManager {
     constructor() {
         this.lastViewedTimestamp = getStorageItem('help_last_viewed', 0);
-        this.latestContentTimestamp = 0; // Will be updated from server or config
+        this.latestContentTimestamp = new Date('2025-07-09').getTime(); // Will be updated from server or config
         this.isInitialized = false;
         
         // Default latest content data - could be fetched from server
@@ -81,6 +81,9 @@ export class HelpManager {
         if (window.modalManager) {
             window.modalManager.toggleModal('helpModal');
             
+            // Add visual indicator to Documentation tab if there's new content
+            this.updateDocumentationTabIndicator();
+            
             // Update the last viewed timestamp
             this.markContentAsViewed();
             
@@ -88,6 +91,16 @@ export class HelpManager {
             this.hideHelpBadge();
         }
     }
+
+    /**
+     * Add visual indicator to Documentation tab for new content
+     */
+    updateDocumentationTabIndicator() {
+        const docTab = document.querySelector('.tab-btn[data-tab="documentation"]');
+        if (docTab && this.hasNewContent()) {
+            docTab.classList.add('has-new-content');
+        }
+    }
     
     /**
      * Mark content as viewed by saving current timestamp
@@ -105,7 +118,7 @@ export class HelpManager {
         // For now, we'll just use the hardcoded data from constructor
         
         // Update the timestamp with the latest data
-        this.latestContentTimestamp = this.latestVideoData.timestamp;
+        this.latestContentTimestamp = Math.max(this.latestContentTimestamp, this.latestVideoData.timestamp);
         
         // Check again if we need to show the badge with this new data
         this.updateHelpBadge();

templates/components/modals.html

@@ -575,7 +575,7 @@
                 <div class="docs-section">
                     <h4><i class="fas fa-book-open"></i> Recipes</h4>
                     <ul class="docs-links">
-                        <li><a href="https://github.com/willmiao/ComfyUI-Lora-Manager/wiki/%F0%9F%93%96-Recipes-Feature-Tutorial-%E2%80%93-ComfyUI-LoRA-Manager" target="_blank">Recipes Tutorial</a></li>
+                        <li><a href="https://github.com/willmiao/ComfyUI-Lora-Manager/wiki/Recipes-Feature-Tutorial-%E2%80%93-ComfyUI-LoRA-Manager" target="_blank">Recipes Tutorial</a></li>
                     </ul>
                 </div>
                 
@@ -585,6 +585,21 @@
                         <li><a href="https://github.com/willmiao/ComfyUI-Lora-Manager/wiki/Configuration" target="_blank">Configuration Options (WIP)</a></li>
                     </ul>
                 </div>
+                
+                <div class="docs-section">
+                    <h4>
+                        <i class="fas fa-puzzle-piece"></i> Extensions
+                        <span class="new-content-badge">NEW</span>
+                    </h4>
+                    <ul class="docs-links">
+                        <li>
+                            <a href="https://github.com/willmiao/ComfyUI-Lora-Manager/wiki/LoRA-Manager-Civitai-Extension-(Chrome-Extension)" target="_blank">
+                                LM Civitai Extension
+                                <span class="new-content-badge inline">NEW</span>
+                            </a>
+                        </li>
+                    </ul>
+                </div>
             </div>
         </div>
     </div>