@knowcode/doc-builder 1.5.11 → 1.5.13

package/CHANGELOG.md

@@ -5,6 +5,43 @@ 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.5.13] - 2025-07-22
+
+### Added
+- **Phosphor Icons Integration** - Automatically convert Unicode emojis to beautiful Phosphor icons in generated HTML
+- Comprehensive emoji-to-icon mapping with 200+ supported emojis
+- Configurable icon weights (thin, light, regular, bold, fill, duotone)
+- Configurable icon size relative to text
+- Accessibility support with proper aria-labels for all icons
+- New `phosphor-icons-guide.md` documentation
+
+### Changed
+- HTML template now includes Phosphor Icons CDN when feature is enabled
+- Post-processing step to replace emojis with icon tags after markdown parsing
+
+### Technical Details
+- Added `lib/emoji-mapper.js` with comprehensive emoji mappings
+- Updated `core-builder.js` to process emojis during HTML generation
+- Added configuration options: `phosphorIcons`, `phosphorWeight`, `phosphorSize`
+- Icons inherit text color and can be styled with CSS
+
+## [1.5.12] - 2025-07-22
+
+### Documentation
+- 📚 **Updated all Vercel documentation** for the simplified setup process
+- ✨ **Rewrote vercel-first-time-setup-guide.md** with streamlined 6-step process
+- 🔧 **Updated vercel-cli-setup-guide.md** to focus on installation and advanced usage
+- 📝 **Simplified README.md deployment section** to 4 clear steps
+- 🐛 **Updated troubleshooting-guide.md** with new deployment solutions
+- 🎯 **Removed references to complex prompts** and confusing options
+- 📖 **Added 'What Changed' section** highlighting improvements
+
+### Documentation Improvements
+- No more confusing "Found project xyz/html" prompts
+- No more root directory confusion
+- Clear, straightforward deployment flow
+- Better error messages and solutions
+
 ## [1.5.11] - 2025-07-22
 
 ### Fixed

package/README.md

@@ -86,22 +86,23 @@ doc-builder deploy
 
 ## First-Time Vercel Deployment
 
-When deploying for the first time, doc-builder will:
+The deployment process is now simpler than ever:
 
-1. Check if Vercel CLI is installed
-2. Guide you through project setup
-3. Create `vercel.json` configuration
-4. Link your project to Vercel
-5. Show important reminders about Vercel settings
+1. Run `npx @knowcode/doc-builder deploy`
+2. Answer a few simple questions (project name, etc.)
+3. Vercel CLI automatically detects and configures everything
+4. Get your live URL in seconds!
 
-### Important Vercel Settings
+### Making Your Docs Public
 
-After deployment, go to your Vercel dashboard:
+After deployment, if you want public access:
 
-1. Navigate to **Project Settings > General**
-2. Under **Security**, find **Deployment Protection**
-3. Set to **Disabled** for public access
-4. Or configure authentication for private docs
+1. Go to [Vercel Dashboard](https://vercel.com/dashboard)
+2. Click your project → Settings → Deployment Protection
+3. Set **Vercel Authentication** to **Disabled**
+4. Save changes
+
+See the [First-Time Setup Guide](docs/vercel-first-time-setup-guide.md) for a complete walkthrough.
 
 ## Configuration (optional - can be managed with CLI)
 

package/doc-builder.config.js

@@ -8,7 +8,8 @@ module.exports = {
     "authentication": false,
     "changelog": true,
     "mermaid": true,
-    "darkMode": true
+    "darkMode": true,
+    "phosphorIcons": true
   },
   "seo": {
     "enabled": true,

package/html/README.html

@@ -36,6 +36,7 @@
     
     <!-- Icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
     
     <!-- Mermaid -->
     <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -61,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T08:32:13.098Z",
-  "dateModified": "2025-07-22T08:32:13.098Z",
+  "datePublished": "2025-07-22T11:03:54.314Z",
+  "dateModified": "2025-07-22T11:03:54.314Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/README.html"
@@ -95,7 +96,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.9">Last updated: Jul 22, 2025, 08:32 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.12">Last updated: Jul 22, 2025, 11:03 AM UTC</span>
                 </div>
                 
                 
@@ -146,8 +147,8 @@
         <div class="nav-content" >
         <a href="/README.html" class="nav-item active" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</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="fas fa-file-alt"></i> Documentation Index</a>
-        <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing and configuring the Vercel CLI across different operating systems and environments."><i class="fas fa-file-alt"></i> Vercel Cli Setup Guide</a>
-        <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide provides a detailed explanation of every prompt you&#039;ll encounter during the first-time Vercel setup process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
+        <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="fas fa-file-alt"></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 streamlined Vercel deployment process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
         <a class="nav-title collapsible expanded" href="#" data-target="nav-guides-1" >
           <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Guides
@@ -172,7 +173,7 @@
 <p>Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling</p>
 </blockquote>
 <p><a href="https://www.npmjs.com/package/@knowcode/doc-builder"><img src="https://img.shields.io/npm/v/@knowcode/doc-builder" alt="npm version"></a><br><a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/License-MIT-blue.svg" alt="License: MIT"></a></p>
-<h2>🚀 Quick Start</h2>
+<h2><i class="ph ph-rocket-launch" aria-label="launch"></i> Quick Start</h2>
 <p>Create stunning documentation sites in minutes:</p>
 <pre><code class="language-bash"># Install globally
 npm install -g @knowcode/doc-builder
@@ -180,45 +181,45 @@ npm install -g @knowcode/doc-builder
 # Or use with npx
 npx @knowcode/doc-builder@latest deploy
 </code></pre>
-<h2>✨ Features</h2>
-<h3>🎨 Beautiful Design</h3>
+<h2><i class="ph ph-sparkle" aria-label="special"></i> Features</h2>
+<h3><i class="ph ph-palette" aria-label="design"></i> Beautiful Design</h3>
 <ul>
 <li><strong>Notion-inspired UI</strong> - Clean, modern interface that users love</li>
 <li><strong>Dark mode support</strong> - Automatic theme switching</li>
 <li><strong>Responsive layout</strong> - Perfect on desktop and mobile</li>
 <li><strong>Syntax highlighting</strong> - Beautiful code blocks with language support</li>
 </ul>
-<h3>🔍 Powerful Search &amp; Navigation</h3>
+<h3><i class="ph ph-magnifying-glass" aria-label="search"></i> Powerful Search &amp; Navigation</h3>
 <ul>
 <li><strong>Full-text search</strong> - Find anything instantly</li>
 <li><strong>Smart navigation</strong> - Hierarchical folder structure</li>
 <li><strong>Breadcrumbs</strong> - Always know where you are</li>
 <li><strong>Keyboard shortcuts</strong> - Navigate like a pro</li>
 </ul>
-<h3>📊 Rich Content Support</h3>
+<h3><i class="ph ph-chart-bar" aria-label="chart"></i> Rich Content Support</h3>
 <ul>
 <li><strong>Mermaid diagrams</strong> - Flowcharts, sequence diagrams, and more</li>
 <li><strong>GitHub-flavored markdown</strong> - Tables, task lists, and strikethrough</li>
 <li><strong>Interactive tooltips</strong> - Document summaries on hover</li>
 <li><strong>Version tracking</strong> - Know which version built your docs</li>
 </ul>
-<h3>🚀 Easy Deployment</h3>
+<h3><i class="ph ph-rocket-launch" aria-label="launch"></i> Easy Deployment</h3>
 <ul>
 <li><strong>One-command deploy</strong> - Push to Vercel instantly</li>
 <li><strong>Static site generation</strong> - Fast, secure, and scalable</li>
 <li><strong>Custom domains</strong> - Your docs, your brand</li>
 <li><strong>Preview deployments</strong> - Test before going live</li>
 </ul>
-<h2>📖 Documentation</h2>
+<h2><i class="ph ph-book-open" aria-label="reading"></i> Documentation</h2>
 <p>Visit our <a href="https://www.npmjs.com/package/@knowcode/doc-builder">official documentation</a> for detailed guides and API reference.</p>
-<h2>🎯 Perfect For</h2>
+<h2><i class="ph ph-target" aria-label="goal"></i> Perfect For</h2>
 <ul>
 <li><strong>Open source projects</strong> - Beautiful docs for your community</li>
 <li><strong>Technical teams</strong> - Internal documentation that developers actually use</li>
 <li><strong>API documentation</strong> - Clear, searchable API references</li>
 <li><strong>Knowledge bases</strong> - Organize and share team knowledge</li>
 </ul>
-<h2>🛠️ Simple Workflow</h2>
+<h2><i class="ph ph-gear-six" aria-label="tools"></i> Simple Workflow</h2>
 <h3>1. Initialize Your Project</h3>
 <pre><code class="language-bash">npx @knowcode/doc-builder init
 </code></pre>
@@ -236,9 +237,9 @@ npm install amazing-package
 
 ## Features
 
-- ✅ Feature one
-- ✅ Feature two
-- ✅ Feature three
+- <i class="ph ph-check-circle" aria-label="checked"></i> Feature one
+- <i class="ph ph-check-circle" aria-label="checked"></i> Feature two
+- <i class="ph ph-check-circle" aria-label="checked"></i> Feature three
 </code></pre>
 <h3>3. Build &amp; Preview</h3>
 <pre><code class="language-bash"># Build your site
@@ -250,7 +251,7 @@ npx doc-builder serve
 <h3>4. Deploy to Vercel</h3>
 <pre><code class="language-bash">npx doc-builder deploy
 </code></pre>
-<h2>🎨 Customization</h2>
+<h2><i class="ph ph-palette" aria-label="design"></i> Customization</h2>
 <p>Configure your site with <code>doc-builder.config.js</code>:</p>
 <pre><code class="language-javascript">module.exports = {
   siteName: &#39;Your Amazing Docs&#39;,
@@ -262,7 +263,7 @@ npx doc-builder serve
   }
 };
 </code></pre>
-<h2>📊 Mermaid Diagram Support</h2>
+<h2><i class="ph ph-chart-bar" aria-label="chart"></i> Mermaid Diagram Support</h2>
 <p>Create beautiful diagrams in your markdown:</p>
 <div class="mermaid-wrapper">
       <div class="mermaid-title">Diagram</div>
@@ -274,13 +275,13 @@ npx doc-builder serve
     style A fill:#e1f5fe
     style D fill:#c8e6c9</div>
     </div>
-<h2>🔒 Optional Authentication</h2>
+<h2><i class="ph ph-lock" aria-label="locked"></i> Optional Authentication</h2>
 <p>Protect sensitive documentation with built-in authentication:</p>
 <pre><code class="language-javascript">features: {
   authentication: true
 }
 </code></pre>
-<h2>🌟 Why doc-builder?</h2>
+<h2><i class="ph ph-star-four" aria-label="sparkle"></i> Why doc-builder?</h2>
 <ul>
 <li><strong>Zero configuration</strong> - Works out of the box</li>
 <li><strong>Lightning fast</strong> - Static site generation for instant loading</li>
@@ -289,13 +290,13 @@ npx doc-builder serve
 <li><strong>Version control</strong> - Track changes with Git</li>
 <li><strong>Open source</strong> - MIT licensed</li>
 </ul>
-<h2>🤝 Contributing</h2>
+<h2><i class="ph ph-handshake" aria-label="partnership"></i> Contributing</h2>
 <p>We welcome contributions! Check out our <a href="https://github.com/knowcode/doc-builder">contribution guide</a> to get started.</p>
-<h2>📝 License</h2>
+<h2><i class="ph ph-note-pencil" aria-label="edit"></i> License</h2>
 <p>MIT © KnowCode</p>
 <hr>
 <div align="center">
-  <p>Built with ❤️ by developers, for developers</p>
+  <p>Built with <i class="ph ph-heart" aria-label="love"></i> by developers, for developers</p>
   <p>
     <a href="https://www.npmjs.com/package/@knowcode/doc-builder">npm</a> •
     <a href="https://github.com/knowcode/doc-builder">GitHub</a> •

package/html/documentation-index.html

@@ -36,6 +36,7 @@
     
     <!-- Icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
     
     <!-- Mermaid -->
     <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -61,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T08:32:13.109Z",
-  "dateModified": "2025-07-22T08:32:13.109Z",
+  "datePublished": "2025-07-22T11:03:54.323Z",
+  "dateModified": "2025-07-22T11:03:54.323Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/documentation-index.html"
@@ -95,7 +96,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.9">Last updated: Jul 22, 2025, 08:32 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.12">Last updated: Jul 22, 2025, 11:03 AM UTC</span>
                 </div>
                 
                 
@@ -146,8 +147,8 @@
         <div class="nav-content" >
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</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="fas fa-file-alt"></i> Documentation Index</a>
-        <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing and configuring the Vercel CLI across different operating systems and environments."><i class="fas fa-file-alt"></i> Vercel Cli Setup Guide</a>
-        <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide provides a detailed explanation of every prompt you&#039;ll encounter during the first-time Vercel setup process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
+        <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="fas fa-file-alt"></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 streamlined Vercel deployment process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
         <a class="nav-title collapsible" href="#" data-target="nav-guides-1" >
           <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Guides
@@ -168,7 +169,7 @@
         <main class="content">
             <div class="content-inner">
                 <h1>Documentation Index</h1>
-<p><strong>Generated</strong>: 2025-07-21 18:00 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: ✅</p>
+<p><strong>Generated</strong>: 2025-07-21 18:00 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: <i class="ph ph-check-circle" aria-label="checked"></i></p>
 <h2>Overview</h2>
 <p>This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose.</p>
 <h2>Directory Structure</h2>
@@ -183,7 +184,7 @@
     └── troubleshooting-guide.md # Common issues and solutions
 </code></pre>
 <h2>Documentation Categories</h2>
-<h3>📚 Core Documentation</h3>
+<h3><i class="ph ph-books" aria-label="documentation"></i> Core Documentation</h3>
 <table>
 <thead>
 <tr>
@@ -208,7 +209,7 @@
 <td>Claude Code integration guide</td>
 </tr>
 </tbody></table>
-<h3>📖 Guides</h3>
+<h3><i class="ph ph-book-open" aria-label="reading"></i> Guides</h3>
 <table>
 <thead>
 <tr>
@@ -278,7 +279,7 @@
 
 **Generated**: YYYY-MM-DD HH:MM UTC  
 **Status**: Draft/Complete  
-**Verified**: ✅/❓
+**Verified**: <i class="ph ph-check-circle" aria-label="checked"></i>/<i class="ph ph-question" aria-label="question"></i>
 
 ## Overview
 

package/html/guides/authentication-guide.html

@@ -36,6 +36,7 @@
     
     <!-- Icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
     
     <!-- Mermaid -->
     <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -61,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T08:32:13.111Z",
-  "dateModified": "2025-07-22T08:32:13.111Z",
+  "datePublished": "2025-07-22T11:03:54.326Z",
+  "dateModified": "2025-07-22T11:03:54.326Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/authentication-guide.html"
@@ -101,7 +102,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.9">Last updated: Jul 22, 2025, 08:32 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.12">Last updated: Jul 22, 2025, 11:03 AM UTC</span>
                 </div>
                 
                 
@@ -152,8 +153,8 @@
         <div class="nav-content" >
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</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="fas fa-file-alt"></i> Documentation Index</a>
-        <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing and configuring the Vercel CLI across different operating systems and environments."><i class="fas fa-file-alt"></i> Vercel Cli Setup Guide</a>
-        <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide provides a detailed explanation of every prompt you&#039;ll encounter during the first-time Vercel setup process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
+        <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="fas fa-file-alt"></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 streamlined Vercel deployment process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
         <a class="nav-title collapsible expanded" href="#" data-target="nav-guides-1" >
           <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Guides
@@ -174,25 +175,25 @@
         <main class="content">
             <div class="content-inner">
                 <h1>Authentication Guide for @knowcode/doc-builder</h1>
-<p><strong>Generated</strong>: 2025-07-21 18:30 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: ✅</p>
+<p><strong>Generated</strong>: 2025-07-21 18:30 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: <i class="ph ph-check-circle" aria-label="checked"></i></p>
 <h2>Overview</h2>
 <p>This guide explains how to configure and use the built-in authentication feature in @knowcode/doc-builder to protect your documentation with basic username/password access control.</p>
 <h2>What is Authentication?</h2>
 <p>The authentication feature in doc-builder provides a simple way to protect your documentation from unauthorized access. When enabled, users must log in with a username and password before viewing any documentation pages.</p>
 <h3>Features</h3>
 <ul>
-<li>✅ <strong>Client-side authentication</strong> - Works with static site hosting</li>
-<li>✅ <strong>Cookie-based sessions</strong> - Users stay logged in across pages</li>
-<li>✅ <strong>Redirect handling</strong> - Returns users to requested page after login</li>
-<li>✅ <strong>Logout functionality</strong> - Clear session and return to login</li>
-<li>✅ <strong>Customizable credentials</strong> - Set your own username/password</li>
+<li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Client-side authentication</strong> - Works with static site hosting</li>
+<li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Cookie-based sessions</strong> - Users stay logged in across pages</li>
+<li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Redirect handling</strong> - Returns users to requested page after login</li>
+<li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Logout functionality</strong> - Clear session and return to login</li>
+<li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Customizable credentials</strong> - Set your own username/password</li>
 </ul>
 <h3>Limitations</h3>
 <ul>
-<li>⚠️ <strong>Basic security</strong> - Suitable for casual protection only</li>
-<li>⚠️ <strong>Client-side validation</strong> - Not suitable for highly sensitive data</li>
-<li>⚠️ <strong>Single user</strong> - No multi-user or role-based access</li>
-<li>⚠️ <strong>Credentials in JavaScript</strong> - Visible in browser developer tools</li>
+<li><i class="ph ph-warning-circle" aria-label="warning"></i> <strong>Basic security</strong> - Suitable for casual protection only</li>
+<li><i class="ph ph-warning-circle" aria-label="warning"></i> <strong>Client-side validation</strong> - Not suitable for highly sensitive data</li>
+<li><i class="ph ph-warning-circle" aria-label="warning"></i> <strong>Single user</strong> - No multi-user or role-based access</li>
+<li><i class="ph ph-warning-circle" aria-label="warning"></i> <strong>Credentials in JavaScript</strong> - Visible in browser developer tools</li>
 </ul>
 <h2>How Authentication Works</h2>
 <div class="mermaid-wrapper">
@@ -298,7 +299,7 @@
 <li><strong>Logout</strong>: Click logout link in header (when available)</li>
 </ol>
 <h2>Security Considerations</h2>
-<h3>⚠️ Important Warnings</h3>
+<h3><i class="ph ph-warning-circle" aria-label="warning"></i> Important Warnings</h3>
 <ol>
 <li><strong>Client-Side Only</strong>: Authentication happens in the browser, making it unsuitable for truly sensitive data</li>
 <li><strong>Visible Credentials</strong>: Username/password are embedded in JavaScript and visible to anyone who views page source</li>
@@ -306,7 +307,7 @@
 <li><strong>Static Files</strong>: All documentation files are still publicly accessible if URLs are known</li>
 </ol>
 <h3>When to Use</h3>
-<p>✅ <strong>Good for:</strong></p>
+<p><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Good for:</strong></p>
 <ul>
 <li>Internal team documentation</li>
 <li>Preview deployments</li>
@@ -314,7 +315,7 @@
 <li>Preventing search engine indexing</li>
 <li>Client presentations</li>
 </ul>
-<p>❌ <strong>Not suitable for:</strong></p>
+<p><i class="ph ph-x-circle" aria-label="error"></i> <strong>Not suitable for:</strong></p>
 <ul>
 <li>Highly confidential information</li>
 <li>Personal data (GDPR/privacy)</li>

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

@@ -36,6 +36,7 @@
     
     <!-- Icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
     
     <!-- Mermaid -->
     <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -61,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T08:32:13.114Z",
-  "dateModified": "2025-07-22T08:32:13.114Z",
+  "datePublished": "2025-07-22T11:03:54.329Z",
+  "dateModified": "2025-07-22T11:03:54.329Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html"
@@ -101,7 +102,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.9">Last updated: Jul 22, 2025, 08:32 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.12">Last updated: Jul 22, 2025, 11:03 AM UTC</span>
                 </div>
                 
                 
@@ -152,8 +153,8 @@
         <div class="nav-content" >
         <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</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="fas fa-file-alt"></i> Documentation Index</a>
-        <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing and configuring the Vercel CLI across different operating systems and environments."><i class="fas fa-file-alt"></i> Vercel Cli Setup Guide</a>
-        <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide provides a detailed explanation of every prompt you&#039;ll encounter during the first-time Vercel setup process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
+        <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="fas fa-file-alt"></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 streamlined Vercel deployment process when using."><i class="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
       <div class="nav-section" data-level="1">
         <a class="nav-title collapsible expanded" href="#" data-target="nav-guides-1" >
           <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Guides
@@ -174,7 +175,7 @@
         <main class="content">
             <div class="content-inner">
                 <h1>Claude + CLAUDE.md Documentation Workflow Guide</h1>
-<p><strong>Generated</strong>: 2025-07-21 10:00 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: ✅</p>
+<p><strong>Generated</strong>: 2025-07-21 10:00 UTC<br><strong>Status</strong>: Complete<br><strong>Verified</strong>: <i class="ph ph-check-circle" aria-label="checked"></i></p>
 <h2>Overview</h2>
 <p>This guide demonstrates an efficient workflow for using Claude Code with a refined CLAUDE.md file to create high-quality documentation and deploy it to Vercel using the @knowcode/doc-builder tool.</p>
 <h2>Workflow Overview</h2>
@@ -213,7 +214,7 @@
 
 ### Content Requirements
 - Include mermaid diagrams for complex workflows
-- Mark verified (✅) vs speculated (❓) information
+- Mark verified (<i class="ph ph-check-circle" aria-label="checked"></i>) vs speculated (<i class="ph ph-question" aria-label="question"></i>) information
 - Add timestamps to all documents
 - Include practical examples
 
@@ -225,7 +226,7 @@
 
 ### Metadata Format
 </code></pre>
-<p><strong>Generated</strong>: YYYY-MM-DD HH:MM UTC<br><strong>Status</strong>: Draft/Complete<br><strong>Verified</strong>: ✅/❓</p>
+<p><strong>Generated</strong>: YYYY-MM-DD HH:MM UTC<br><strong>Status</strong>: Draft/Complete<br><strong>Verified</strong>: <i class="ph ph-check-circle" aria-label="checked"></i>/<i class="ph ph-question" aria-label="question"></i></p>
 <pre><code>
 </code></pre>
 <h3>1.2 Global CLAUDE.md Best Practices</h3>
@@ -474,25 +475,25 @@ npm run deploy:docs
 ## Best Practices Summary
 
 ### Documentation Creation
-1. ✅ Use CLAUDE.md to maintain consistency
-2. ✅ Include visual diagrams for complex concepts
-3. ✅ Provide practical examples
-4. ✅ Mark verification status
-5. ✅ Keep documentation close to code
+1. <i class="ph ph-check-circle" aria-label="checked"></i> Use CLAUDE.md to maintain consistency
+2. <i class="ph ph-check-circle" aria-label="checked"></i> Include visual diagrams for complex concepts
+3. <i class="ph ph-check-circle" aria-label="checked"></i> Provide practical examples
+4. <i class="ph ph-check-circle" aria-label="checked"></i> Mark verification status
+5. <i class="ph ph-check-circle" aria-label="checked"></i> Keep documentation close to code
 
 ### Claude Interaction
-1. ✅ Provide clear, specific requests
-2. ✅ Reference existing patterns
-3. ✅ Request iterative improvements
-4. ✅ Verify technical accuracy
-5. ✅ Ask for troubleshooting sections
+1. <i class="ph ph-check-circle" aria-label="checked"></i> Provide clear, specific requests
+2. <i class="ph ph-check-circle" aria-label="checked"></i> Reference existing patterns
+3. <i class="ph ph-check-circle" aria-label="checked"></i> Request iterative improvements
+4. <i class="ph ph-check-circle" aria-label="checked"></i> Verify technical accuracy
+5. <i class="ph ph-check-circle" aria-label="checked"></i> Ask for troubleshooting sections
 
 ### Deployment
-1. ✅ Test locally before deploying
-2. ✅ Use preview deployments first
-3. ✅ Configure custom domains
-4. ✅ Enable HTTPS
-5. ✅ Monitor deployment health
+1. <i class="ph ph-check-circle" aria-label="checked"></i> Test locally before deploying
+2. <i class="ph ph-check-circle" aria-label="checked"></i> Use preview deployments first
+3. <i class="ph ph-check-circle" aria-label="checked"></i> Configure custom domains
+4. <i class="ph ph-check-circle" aria-label="checked"></i> Enable HTTPS
+5. <i class="ph ph-check-circle" aria-label="checked"></i> Monitor deployment health
 
 ## Common Issues and Solutions