Update html_templates.py

html_templates.py

@@ -216,6 +216,7 @@ def format_single_dog_result(breed: str, description: Dict[str, Any], color: str
                 health_considerations.append(line[1:].strip())
             elif in_section == 'screenings':
                 health_screenings.append(line[1:].strip())
+    display_breeds_name = breed.replace('_', ' ')
 
     return f'''
         <div class="dog-info-card" style="background: {color}10;">
@@ -231,7 +232,7 @@ def format_single_dog_result(breed: str, description: Dict[str, Any], color: str
                     font-weight: 600;
                     font-size: 2.0em;
                     letter-spacing: 0.5px;">
-                    {breed.replace('_', ' ')}
+                    {display_breeds_name}
                 </h2>
             </div>
 
@@ -436,7 +437,7 @@ def format_single_dog_result(breed: str, description: Dict[str, Any], color: str
                        class="akc-button" 
                        style="display: inline-block; padding: 12px 24px; background: linear-gradient(90deg, #4299e1, #48bb78); color: white; text-decoration: none; border-radius: 6px;">
                         <span class="icon">🌐</span>
-                        Learn more about {breed} on AKC website
+                        Learn more about {display_breeds_name} on AKC website
                     </a>
                 </div>
             </div>
@@ -465,6 +466,8 @@ def format_multiple_breeds_result(
     get_dog_description: Callable
 ) -> str:
     """Format multiple breed predictions into HTML with complete information."""
+    display_breeds = [breed.replace('_', ' ') for breed in topk_breeds]
+    
     result = f'''
         <!-- 主標題區塊 -->
         <div style="background: {color}10; border-radius: 12px 12px 0 0; padding: 20px;">
@@ -540,7 +543,7 @@ def format_multiple_breeds_result(
                           <div style="display: flex; align-items: center; gap: 14px;">
                               <span style="font-size: 1.4em;">🐾</span>
                               <h2 style="margin: 0; font-size: 1.8em; color: #1a202c; font-weight: 600;">
-                                  {'Option ' + str(j+1) + ': ' if prob else ''}{breed}
+                                  {'Option ' + str(j+1) + ': ' if prob else ''}{display_breeds}
                               </h2>
                           </div>
                           {f'<span style="background: {color}12; color: {color}; padding: 8px 16px; border-radius: 8px; font-size: 1em; font-weight: 500; box-shadow: 0 1px 2px {color}20;">Confidence: {prob}</span>' if prob else ''}
@@ -928,7 +931,7 @@ def format_multiple_breeds_result(
                               rel="noopener noreferrer"
                               style="display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px; background: linear-gradient(90deg, #4299e1, #48bb78); color: white; text-decoration: none; border-radius: 8px; font-weight: 500; transition: opacity 0.2s; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
                               <span style="font-size: 1.2em;">🌐</span>
-                              Learn more about {breed} on AKC website
+                              Learn more about {display_breeds} on AKC website
                           </a>
                       </div>
                   </div>