@knowcode/doc-builder 1.9.18 → 1.9.19

package/CHANGELOG.md

@@ -5,6 +5,25 @@ All notable changes to @knowcode/doc-builder will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.9.18] - 2025-08-02
+
+### Added
+- **Enhanced Mermaid Styling** - Diagrams now feature rounded corners (8px radius) for a more polished appearance
+- **Notion-Inspired Themes** - Custom color palettes for both light and dark modes that integrate seamlessly with the overall design
+- **Configurable Enhancement** - New `mermaidEnhanced` configuration option to enable/disable enhanced styling (default: true)
+- **Improved Typography** - Better spacing, margins, and font consistency in Mermaid diagrams
+- **Theme Transition Support** - Smooth transitions when switching between light and dark modes
+
+### Fixed
+- **JavaScript Initialization** - Resolved banner element null reference error that was preventing Mermaid diagrams from rendering
+- **CSS Specificity** - Enhanced CSS selectors to ensure rounded corner styling is properly applied
+- **Debugging Support** - Added comprehensive logging for troubleshooting Mermaid configuration issues
+
+### Technical
+- Enhanced `configureMermaidTheme()` function with custom theme variables
+- Added conditional CSS styling using `[data-mermaid-enhanced="true"]` selector
+- Improved error handling for missing DOM elements during initialization
+
 ## [1.9.2] - 2025-07-28
 
 ### Added

package/README.md

@@ -74,7 +74,7 @@ This aligns perfectly with our mission: beautiful documentation should be access
 ### 🎯 Advanced Features  
 - 🔍 **SEO Optimized** - Meta tags & structured data
 - 🔐 **Optional Auth** - Supabase authentication (opt-in)
-- 📊 **Mermaid Diagrams** - Built-in diagram support
+- 📊 **Mermaid Diagrams** - Enhanced styling with rounded corners & Notion-inspired themes
 - 🖼️ **Image Modals** - Click any image for full-screen view
 - 🌙 **Dark Mode** - Automatic theme switching
 - ☁️ **Vercel Deploy** - One-command deployment
@@ -217,6 +217,7 @@ module.exports = {
     authentication: 'supabase',  // or false for no auth
     changelog: true,
     mermaid: true,
+    mermaidEnhanced: true,      // Enhanced styling with rounded corners
     darkMode: true,
     attachments: true           // Copy PDFs, Excel files, etc. (default: true)
   },

package/assets/js/main.js

@@ -53,7 +53,6 @@ document.addEventListener('DOMContentLoaded', function() {
   });
 
   // Initialize Mermaid Full Screen Functionality
-  console.log('[Mermaid] DOMContentLoaded fired, calling initializeMermaidFullScreen...');
   initializeMermaidFullScreen();
 });
 
@@ -131,38 +130,18 @@ function configureMermaidTheme() {
   
   // Manually render all mermaid diagrams after configuration
   setTimeout(() => {
-    console.log('[Mermaid] Running mermaid.run() with config:', mermaidConfig);
-    console.log('[Mermaid] Enhanced styling enabled:', enhancedStyling);
-    console.log('[Mermaid] Data attribute set to:', document.documentElement.getAttribute('data-mermaid-enhanced'));
     mermaid.run();
-    
-    // After rendering, log some debug info
-    setTimeout(() => {
-      const diagrams = document.querySelectorAll('.mermaid svg');
-      console.log('[Mermaid] Found', diagrams.length, 'rendered diagrams');
-      
-      const firstRect = document.querySelector('.mermaid svg rect');
-      if (firstRect) {
-        console.log('[Mermaid] First rect element:', firstRect);
-        console.log('[Mermaid] Rect rx value:', firstRect.getAttribute('rx'));
-        console.log('[Mermaid] Computed styles:', window.getComputedStyle(firstRect));
-      }
-    }, 500);
   }, 100);
 }
 
 // Mermaid Full Screen Viewer
 function initializeMermaidFullScreen() {
-  console.log('[Mermaid] initializeMermaidFullScreen() called');
-  
   // Wait for Mermaid to initialize
   if (typeof mermaid === 'undefined') {
-    console.log('[Mermaid] Mermaid not available yet, retrying in 100ms...');
     setTimeout(initializeMermaidFullScreen, 100);
     return;
   }
 
-  console.log('[Mermaid] Mermaid library available, configuring theme...');
   // Configure Mermaid with enhanced styling
   configureMermaidTheme();
 
@@ -1055,6 +1034,49 @@ function initCollapsibleNavigation() {
     }
   }, 200);
   
+  // Handle toggle-all button for root navigation
+  const toggleAllButton = document.getElementById('nav-toggle-all');
+  if (toggleAllButton) {
+    toggleAllButton.addEventListener('click', (e) => {
+      e.preventDefault();
+      
+      const icon = document.getElementById('toggle-all-icon');
+      const isExpanded = toggleAllButton.classList.contains('expanded');
+      
+      // Get all collapsible sections (excluding the root)
+      const allSections = document.querySelectorAll('.nav-section[data-level]:not([data-level="0"]) .nav-title.collapsible');
+      const allContents = document.querySelectorAll('.nav-section[data-level]:not([data-level="0"]) .nav-content.collapsed, .nav-section[data-level]:not([data-level="0"]) .nav-content:not(.collapsed)');
+      
+      if (isExpanded) {
+        // Collapse all sections
+        toggleAllButton.classList.remove('expanded');
+        icon.className = 'ph ph-caret-right';
+        
+        allSections.forEach(section => {
+          section.classList.remove('expanded');
+        });
+        
+        allContents.forEach(content => {
+          if (content.id) { // Only collapse if it has an id (is collapsible)
+            content.classList.add('collapsed');
+          }
+        });
+      } else {
+        // Expand all sections
+        toggleAllButton.classList.add('expanded');
+        icon.className = 'ph ph-caret-down';
+        
+        allSections.forEach(section => {
+          section.classList.add('expanded');
+        });
+        
+        allContents.forEach(content => {
+          content.classList.remove('collapsed');
+        });
+      }
+    });
+  }
+  
   const collapsibleTitles = document.querySelectorAll('.nav-title.collapsible');
   
   collapsibleTitles.forEach(title => {

package/doc-builder.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  "configVersion": "1.9.17",
+  "configVersion": "1.9.18",
   "docsDir": "docs",
   "outputDir": "html",
   "siteName": "@knowcode/doc-builder",

package/doc-builder.config.js.backup.1754218469785

@@ -0,0 +1,124 @@
+module.exports = {
+  "configVersion": "1.9.17",
+  "docsDir": "docs",
+  "outputDir": "html",
+  "siteName": "@knowcode/doc-builder",
+  "siteDescription": "Beautiful documentation with the least effort possible",
+  "favicon": "✨",
+  "features": {
+    "authentication": false,
+    "changelog": true,
+    "mermaid": true,
+    "mermaidEnhanced": true,
+    "tooltips": true,
+    "search": false,
+    "darkMode": true,
+    "phosphorIcons": true,
+    "phosphorWeight": "regular",
+    "phosphorSize": "1.2em",
+    "normalizeTitle": true,
+    "showPdfDownload": true,
+    "menuDefaultOpen": false,
+    "attachments": true,
+    "dynamicNavIcons": true,
+    "subtleColors": true,
+    "privateDirectoryAuth": false,
+    "banner": false
+  },
+  "auth": {
+    "supabaseUrl": "https://xcihhnfcitjrwbynxmka.supabase.co",
+    "supabaseAnonKey": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InhjaWhobmZjaXRqcndieW54bWthIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NTM0Mzc2MzcsImV4cCI6MjA2OTAxMzYzN30.zvWp3JFIR8fBIiwuFF5gqOR_Kxb42baZS5fsBz60XOY"
+  },
+  "changelog": {
+    "daysBack": 14,
+    "enabled": true
+  },
+  "banner": {
+    "enabled": false,
+    "text": "This documentation is a preview version - some content may be incomplete",
+    "icon": "fas fa-exclamation-triangle",
+    "type": "warning",
+    "dismissible": true
+  },
+  "folderOrder": [],
+  "folderDescriptions": {},
+  "folderIcons": {},
+  "deployment": {
+    "platform": "vercel",
+    "outputDirectory": "html"
+  },
+  "seo": {
+    "enabled": true,
+    "siteUrl": "https://doc-builder-delta.vercel.app",
+    "author": "Lindsay Smith",
+    "twitterHandle": "@planbbackups",
+    "language": "en-US",
+    "keywords": [
+      "documentation",
+      "markdown",
+      "static site generator",
+      "vercel",
+      "notion-style"
+    ],
+    "titleTemplate": "{pageTitle} | {siteName}",
+    "autoKeywords": true,
+    "keywordLimit": 7,
+    "descriptionFallback": "smart",
+    "organization": {
+      "name": "Knowcode Ltd",
+      "url": "https://knowcode.tech",
+      "logo": ""
+    },
+    "ogImage": "/og-default.png",
+    "generateSitemap": true,
+    "generateRobotsTxt": true,
+    "customMetaTags": [
+      {
+        "name": "google-site-verification",
+        "content": "FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ"
+      },
+      {
+        "name": "msvalidate.01",
+        "content": "B2D8C4C12C530D47AA962B24CAA09630"
+      }
+    ]
+  },
+  "attachmentTypes": [
+    ".pdf",
+    ".doc",
+    ".docx",
+    ".xls",
+    ".xlsx",
+    ".csv",
+    ".ppt",
+    ".pptx",
+    ".txt",
+    ".rtf",
+    ".html",
+    ".htm",
+    ".zip",
+    ".tar",
+    ".gz",
+    ".7z",
+    ".rar",
+    ".png",
+    ".jpg",
+    ".jpeg",
+    ".gif",
+    ".svg",
+    ".webp",
+    ".ico",
+    ".bmp",
+    ".json",
+    ".xml",
+    ".yaml",
+    ".yml",
+    ".toml",
+    ".mp4",
+    ".mp3",
+    ".wav",
+    ".avi",
+    ".mov"
+  ],
+  "productionUrl": "https://doc-builder-delta.vercel.app"
+};

package/html/README.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:09.988Z",
-  "dateModified": "2025-08-02T07:42:09.988Z",
+  "datePublished": "2025-08-03T10:54:29.934Z",
+  "dateModified": "2025-08-03T10:54:29.934Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/README.html"
@@ -133,7 +133,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -173,15 +173,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title expanded" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item active" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">

package/html/about-doc-builder.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.001Z",
-  "dateModified": "2025-08-02T07:42:10.001Z",
+  "datePublished": "2025-08-03T10:54:29.961Z",
+  "dateModified": "2025-08-03T10:54:29.961Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/about-doc-builder.html"
@@ -133,7 +133,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -173,15 +173,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item active" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
@@ -276,7 +275,7 @@
 </tr>
 <tr>
 <td><i style="font-size: 1.2em" class="ph ph-chart-bar" aria-label="chart"></i> <strong>Mermaid Diagrams</strong></td>
-<td>Built-in support for flowcharts, sequence diagrams, and more</td>
+<td>Enhanced styling with rounded corners &amp; Notion-inspired themes</td>
 </tr>
 <tr>
 <td><i style="font-size: 1.2em" class="ph ph-image" aria-label="picture"></i> <strong>Image Modals</strong></td>

package/html/documentation-index.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.005Z",
-  "dateModified": "2025-08-02T07:42:10.005Z",
+  "datePublished": "2025-08-03T10:54:29.967Z",
+  "dateModified": "2025-08-03T10:54:29.967Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/documentation-index.html"
@@ -133,7 +133,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -173,15 +173,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item active" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">

package/html/guides/authentication-default-change.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.010Z",
-  "dateModified": "2025-08-02T07:42:10.010Z",
+  "datePublished": "2025-08-03T10:54:29.988Z",
+  "dateModified": "2025-08-03T10:54:29.988Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/authentication-default-change.html"
@@ -139,7 +139,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -179,15 +179,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">

package/html/guides/authentication-guide.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.014Z",
-  "dateModified": "2025-08-02T07:42:10.014Z",
+  "datePublished": "2025-08-03T10:54:30.012Z",
+  "dateModified": "2025-08-03T10:54:30.012Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/authentication-guide.html"
@@ -139,7 +139,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -179,15 +179,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">

package/html/guides/claude-workflow-guide.html

@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.019Z",
-  "dateModified": "2025-08-02T07:42:10.019Z",
+  "datePublished": "2025-08-03T10:54:30.040Z",
+  "dateModified": "2025-08-03T10:54:30.040Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html"
@@ -139,7 +139,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -179,15 +179,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">

package/html/guides/configuration-guide.html

@@ -8,7 +8,7 @@
     
     <meta name="generator" content="@knowcode/doc-builder by Knowcode Ltd">
     <meta name="author" content="Lindsay Smith">
-    <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, config, configuration">
+    <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, configuration, config">
     <meta name="robots" content="index, follow">
     <link rel="canonical" href="https://doc-builder-delta.vercel.app/guides/configuration-guide.html">
     
@@ -99,8 +99,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-08-02T07:42:10.023Z",
-  "dateModified": "2025-08-02T07:42:10.023Z",
+  "datePublished": "2025-08-03T10:54:30.070Z",
+  "dateModified": "2025-08-03T10:54:30.070Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/configuration-guide.html"
@@ -139,7 +139,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.9.17">Last updated: Aug 2, 2025, 07:42 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.9.18">Last updated: Aug 3, 2025, 10:54 AM UTC</span>
                 </div>
                 
                 
@@ -179,15 +179,14 @@
             <nav class="navigation">
                 
       <div class="nav-section" data-level="0">
-        <a class="nav-title" href="/README.html"  >
-          <i class="ph ph-house"></i> Documentation
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
         </a>
-        <div class="nav-content" >
+        <div class="nav-content">
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
         <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
         <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
         <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
-        <a href="/test-mermaid-enhanced.html" class="nav-item" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
         <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
         <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
@@ -294,6 +293,7 @@
     &quot;authentication&quot;: false,
     &quot;changelog&quot;: true,
     &quot;mermaid&quot;: true,
+    &quot;mermaidEnhanced&quot;: true,
     &quot;tooltips&quot;: true,
     &quot;search&quot;: false,
     &quot;darkMode&quot;: true,
@@ -377,6 +377,7 @@
 <li><strong><code>subtleColors</code></strong> - Colored status indicators</li>
 <li><strong><code>darkMode</code></strong> - Theme switching support</li>
 <li><strong><code>mermaid</code></strong> - Diagram rendering</li>
+<li><strong><code>mermaidEnhanced</code></strong> - Enhanced diagram styling with rounded corners (v1.9.18+)</li>
 <li><strong><code>authentication</code></strong> - Private content protection</li>
 </ul>
 <h3>Advanced Settings</h3>
@@ -385,6 +386,27 @@
 <li><strong><code>phosphorSize</code></strong> - Icon size relative to text</li>
 <li><strong><code>attachmentTypes</code></strong> - File types to copy during build</li>
 </ul>
+<h2><i style="font-size: 1.2em" class="ph ph-chart-bar" aria-label="chart"></i> Mermaid Diagram Configuration</h2>
+<h3>Enhanced Styling (v1.9.18+)</h3>
+<p>The new <code>mermaidEnhanced</code> feature provides professional diagram styling:</p>
+<pre><code class="language-javascript">features: {
+  mermaid: true,           // Enable Mermaid diagrams
+  mermaidEnhanced: true,   // Enhanced styling with rounded corners
+}
+</code></pre>
+<p><strong>Enhanced Features:</strong></p>
+<ul>
+<li><i style="font-size: 1.2em" class="ph ph-palette" aria-label="design"></i> <strong>Rounded corners</strong> (8px radius) on all diagram shapes</li>
+<li><i style="font-size: 1.2em" class="ph ph-palette" aria-label="design"></i> <strong>Notion-inspired color palette</strong> for better visual integration</li>
+<li><i style="font-size: 1.2em" class="ph ph-moon" aria-label="night"></i> <strong>Automatic theme support</strong> for light and dark modes</li>
+<li><i style="font-size: 1.2em" class="ph ph-sparkle" aria-label="special"></i> <strong>Improved spacing</strong> and typography consistency</li>
+</ul>
+<p><strong>To disable enhanced styling:</strong></p>
+<pre><code class="language-javascript">features: {
+  mermaid: true,
+  mermaidEnhanced: false,  // Use default Mermaid styling
+}
+</code></pre>
 <h2><i style="font-size: 1.2em" class="ph ph-rocket-launch" aria-label="launch"></i> No Manual Editing Required</h2>
 <p>The beauty of this system is that you typically <strong>never need to manually edit</strong> the config file:</p>
 <ol>