@knowcode/doc-builder 1.8.7 → 1.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/.claude/settings.local.json +2 -1
  2. package/CHANGELOG.md +27 -0
  3. package/README.md +2 -0
  4. package/assets/css/notion-style.css +141 -0
  5. package/assets/js/main.js +76 -0
  6. package/html/README.html +41 -149
  7. package/html/css/notion-style.css +13 -253
  8. package/html/documentation-index.html +24 -127
  9. package/html/guides/authentication-default-change.html +15 -130
  10. package/html/guides/authentication-guide.html +27 -141
  11. package/html/guides/claude-workflow-guide.html +30 -137
  12. package/html/guides/documentation-standards.html +19 -133
  13. package/html/guides/image-modal-guide.html +381 -0
  14. package/html/guides/phosphor-icons-guide.html +35 -150
  15. package/html/guides/private-directory-authentication.html +15 -130
  16. package/html/guides/public-site-deployment.html +15 -130
  17. package/html/guides/search-engine-verification-guide.html +15 -130
  18. package/html/guides/seo-guide.html +15 -130
  19. package/html/guides/seo-optimization-guide.html +46 -159
  20. package/html/guides/troubleshooting-guide.html +27 -141
  21. package/html/guides/windows-setup-guide.html +46 -161
  22. package/html/image-modal-test.html +189 -0
  23. package/html/index.html +41 -149
  24. package/html/js/auth.js +39 -118
  25. package/html/js/main.js +25 -183
  26. package/html/private/cache-control-anti-pattern.html +20 -135
  27. package/html/private/launch/README.html +23 -144
  28. package/html/private/launch/auth-cleanup-summary.html +32 -153
  29. package/html/private/launch/bubble-plugin-specification.html +15 -136
  30. package/html/private/launch/go-to-market-strategy.html +17 -138
  31. package/html/private/launch/launch-announcements.html +31 -151
  32. package/html/private/launch/vercel-deployment-auth-setup.html +17 -138
  33. package/html/private/next-steps-walkthrough.html +21 -136
  34. package/html/private/supabase-auth-implementation-completed.html +29 -143
  35. package/html/private/supabase-auth-implementation-plan.html +22 -136
  36. package/html/private/supabase-auth-integration-plan.html +29 -142
  37. package/html/private/supabase-auth-setup-guide.html +24 -139
  38. package/html/private/test-private-doc.html +15 -130
  39. package/html/private/user-management-tooling.html +15 -130
  40. package/html/prompts/markdown-document-standards.html +288 -0
  41. package/html/sitemap.xml +56 -44
  42. package/html/vercel-cli-setup-guide.html +19 -128
  43. package/html/vercel-first-time-setup-guide.html +16 -125
  44. package/lib/core-builder.js +1 -0
  45. package/lib/emoji-mapper.js +25 -0
  46. package/package/assets/css/notion-style.css +432 -135
  47. package/package/assets/js/main.js +259 -25
  48. package/package.json +1 -1
package/html/guides/claude-workflow-guide.html CHANGED
@@ -3,41 +3,14 @@
3
3
  <head>
4
4
  <meta charset="UTF-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <meta name="description" content="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...">
7
- <title>Claude + CLAUDE.md Documentation Workflow Guide</title>
8
-
9
- <meta name="author" content="Lindsay Smith">
10
- <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, claude, error">
11
- <meta name="robots" content="index, follow">
12
- <link rel="canonical" href="https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html">
13
-
14
- <!-- Open Graph / Facebook -->
15
- <meta property="og:type" content="article">
16
- <meta property="og:url" content="https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html">
17
- <meta property="og:title" content="Claude + CLAUDE.md Documentation Workflow Guide">
18
- <meta property="og:description" content="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...">
19
- <meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
20
- <meta property="og:site_name" content="@knowcode/doc-builder">
21
- <meta property="og:locale" content="en_US">
22
-
23
- <!-- Twitter Card -->
24
- <meta name="twitter:card" content="summary_large_image">
25
- <meta name="twitter:site" content="@planbbackups">
26
- <meta name="twitter:creator" content="@planbbackups">
27
- <meta name="twitter:title" content="Claude + CLAUDE.md Documentation Workflow Guide">
28
- <meta name="twitter:description" content="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...">
29
- <meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
30
-
31
- <!-- Custom Meta Tags -->
32
- <meta name="google-site-verification" content="FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ">
33
- <meta name="msvalidate.01" content="B2D8C4C12C530D47AA962B24CAA09630">
6
+ <meta name="description" content="Beautiful documentation with the least effort possible">
7
+ <title>Claude + CLAUDE.md Documentation Workflow Guide - @knowcode/doc-builder</title>
34
8
 
35
9
  <!-- Fonts -->
36
10
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
37
11
 
38
12
  <!-- Icons -->
39
13
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
40
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
41
14
 
42
15
  <!-- Mermaid -->
43
16
  <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -45,90 +18,8 @@
45
18
  <!-- Styles -->
46
19
  <link rel="stylesheet" href="/css/notion-style.css">
47
20
 
48
-
49
- <!-- Hide content until auth check -->
50
- <style>
51
- body {
52
- visibility: hidden;
53
- opacity: 0;
54
- transition: opacity 0.3s ease;
55
- }
56
- body.authenticated {
57
- visibility: visible;
58
- opacity: 1;
59
- }
60
- /* Show login/logout pages immediately */
61
- body.auth-page {
62
- visibility: visible;
63
- opacity: 1;
64
- }
65
- /* Style auth button consistently */
66
- .auth-btn {
67
- background: none;
68
- border: none;
69
- color: var(--text-secondary);
70
- cursor: pointer;
71
- padding: 0.5rem;
72
- border-radius: 0.5rem;
73
- transition: all 0.2s;
74
- font-size: 1.1rem;
75
- }
76
- .auth-btn:hover {
77
- background: var(--bg-secondary);
78
- color: var(--text-primary);
79
- }
80
- </style>
81
-
82
-
83
21
  <!-- Favicon -->
84
- <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✨</text></svg>">
85
-
86
- <script type="application/ld+json">
87
- {
88
- "@context": "https://schema.org",
89
- "@type": "TechArticle",
90
- "headline": "Claude + CLAUDE.md Documentation Workflow Guide",
91
- "description": "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...",
92
- "author": {
93
- "@type": "Person",
94
- "name": "Lindsay Smith"
95
- },
96
- "publisher": {
97
- "@type": "Organization",
98
- "name": "Knowcode Ltd",
99
- "url": "https://knowcode.tech"
100
- },
101
- "datePublished": "2025-07-26T16:10:10.594Z",
102
- "dateModified": "2025-07-26T16:10:10.594Z",
103
- "mainEntityOfPage": {
104
- "@type": "WebPage",
105
- "@id": "https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html"
106
- },
107
- "breadcrumb": {
108
- "@type": "BreadcrumbList",
109
- "itemListElement": [
110
- {
111
- "@type": "ListItem",
112
- "position": 1,
113
- "name": "@knowcode/doc-builder",
114
- "item": "https://doc-builder-delta.vercel.app"
115
- },
116
- {
117
- "@type": "ListItem",
118
- "position": 2,
119
- "name": "Guides",
120
- "item": "https://doc-builder-delta.vercel.app/guides/"
121
- },
122
- {
123
- "@type": "ListItem",
124
- "position": 3,
125
- "name": "Claude Workflow Guide",
126
- "item": "https://doc-builder-delta.vercel.app/guides/claude-workflow-guide.html"
127
- }
128
- ]
129
- }
130
- }
131
- </script>
22
+ <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📚</text></svg>">
132
23
  </head>
133
24
  <body>
134
25
  <!-- Header -->
@@ -138,14 +29,10 @@
138
29
 
139
30
  <div class="header-actions">
140
31
  <div class="deployment-info">
141
- <span class="deployment-date" title="Built with doc-builder v1.8.6">Last updated: Jul 26, 2025, 04:10 PM UTC</span>
32
+ <span class="deployment-date" title="Built with doc-builder v1.4.21">Last updated: Jul 27, 2025, 08:32 AM UTC</span>
142
33
  </div>
143
34
 
144
35
 
145
- <a href="../../login.html" class="auth-btn" title="Login/Logout">
146
- <i class="fas fa-sign-in-alt"></i>
147
- </a>
148
-
149
36
 
150
37
  <button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
151
38
  <i class="fas fa-moon"></i>
@@ -193,6 +80,7 @@
193
80
  <div class="nav-content" >
194
81
  <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</a>
195
82
  <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>
83
+ <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="fas fa-file-alt"></i> Image Modal Test</a>
196
84
  <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>
197
85
  <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="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
198
86
  <div class="nav-section" data-level="1">
@@ -204,6 +92,7 @@
204
92
  <a href="/guides/authentication-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase - a secure, scalable authentication platform."><i class="fas fa-file-alt"></i> Authentication Guide</a>
205
93
  <a href="/guides/claude-workflow-guide.html" class="nav-item active" data-tooltip="This guide demonstrates an efficient workflow for using Claude Code with a refined CLAUDE.md file to create high-quality documentation and deploy it..."><i class="fas fa-file-alt"></i> Claude Workflow Guide</a>
206
94
  <a href="/guides/documentation-standards.html" class="nav-item" data-tooltip="This document defines the documentation standards and conventions for the @knowcode/doc-builder project."><i class="fas fa-file-alt"></i> Documentation Standards</a>
95
+ <a href="/guides/image-modal-guide.html" class="nav-item" data-tooltip="When users click on any image in your generated documentation, it opens in a professional modal overlay with: Full-screen viewing experience Smooth..."><i class="fas fa-file-alt"></i> Image Modal Guide</a>
207
96
  <a href="/guides/phosphor-icons-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder automatically converts Unicode emojis in your markdown files to beautiful Phosphor icons in the generated HTML."><i class="fas fa-file-alt"></i> Phosphor Icons Guide</a>
208
97
  <a href="/guides/private-directory-authentication.html" class="nav-item" data-tooltip="The @knowcode/doc-builder provides flexible authentication options to protect your documentation."><i class="fas fa-file-alt"></i> Private Directory Authentication</a>
209
98
  <a href="/guides/public-site-deployment.html" class="nav-item" data-tooltip="The @knowcode/doc-builder now supports deploying public documentation sites without authentication."><i class="fas fa-file-alt"></i> Public Site Deployment</a>
@@ -212,7 +101,7 @@
212
101
  <a href="/guides/seo-optimization-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes comprehensive SEO (Search Engine Optimization) features that automatically optimize your documentation for search..."><i class="fas fa-file-alt"></i> Seo Optimization Guide</a>
213
102
  <a href="/guides/troubleshooting-guide.html" class="nav-item" data-tooltip="This guide helps you resolve common issues when using @knowcode/doc-builder."><i class="fas fa-file-alt"></i> Troubleshooting Guide</a>
214
103
  <a href="/guides/windows-setup-guide.html" class="nav-item" data-tooltip="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel."><i class="fas fa-file-alt"></i> Windows Setup Guide</a></div></div>
215
- <div class="nav-section private-nav" data-level="1">
104
+ <div class="nav-section" data-level="1">
216
105
  <a class="nav-title collapsible" href="#" data-target="nav-private-1" >
217
106
  <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Private
218
107
  </a>
@@ -225,7 +114,7 @@
225
114
  <a href="/private/supabase-auth-setup-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase."><i class="fas fa-file-alt"></i> Supabase Auth Setup Guide</a>
226
115
  <a href="/private/test-private-doc.html" class="nav-item" data-tooltip="Test Private Document."><i class="fas fa-file-alt"></i> Test Private Doc</a>
227
116
  <a href="/private/user-management-tooling.html" class="nav-item" data-tooltip="The user management system is a set of tools designed to manage user access to Supabase-authenticated documentation sites built with."><i class="fas fa-file-alt"></i> User Management Tooling</a></div></div>
228
- <div class="nav-section private-nav" data-level="2">
117
+ <div class="nav-section" data-level="2">
229
118
  <a class="nav-title collapsible" href="/private/launch/README.html" data-target="nav-private-launch-2" >
230
119
  <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Launch
231
120
  </a>
@@ -236,6 +125,12 @@
236
125
  <a href="/private/launch/go-to-market-strategy.html" class="nav-item" data-tooltip="Go-to-Market Strategy &amp; Product Launch Plan."><i class="fas fa-file-alt"></i> Go To Market Strategy</a>
237
126
  <a href="/private/launch/launch-announcements.html" class="nav-item" data-tooltip="This document contains ready-to-use announcement templates for launching @knowcode/doc-builder across various platforms and channels."><i class="fas fa-file-alt"></i> Launch Announcements</a>
238
127
  <a href="/private/launch/vercel-deployment-auth-setup.html" class="nav-item" data-tooltip="Vercel Deployment Authentication Setup Guide."><i class="fas fa-file-alt"></i> Vercel Deployment Auth Setup</a></div></div>
128
+ <div class="nav-section" data-level="1">
129
+ <a class="nav-title collapsible" href="#" data-target="nav-prompts-1" >
130
+ <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Prompts
131
+ </a>
132
+ <div class="nav-content collapsed" id="nav-prompts-1">
133
+ <a href="/prompts/markdown-document-standards.html" class="nav-item" data-tooltip="Detailed introduction to the topic..."><i class="fas fa-file-alt"></i> Markdown Document Standards</a></div></div>
239
134
  </nav>
240
135
  <div class="resize-handle"></div>
241
136
  </aside>
@@ -248,6 +143,7 @@
248
143
  <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>
249
144
  <h2>Workflow Overview</h2>
250
145
  <div class="mermaid-wrapper">
146
+ <div class="mermaid-title">Diagram</div>
251
147
  <div class="mermaid">graph TD
252
148
  A[Start Project] --> B[Setup CLAUDE.md]
253
149
  B --> C[Configure doc-builder]
@@ -314,6 +210,7 @@ This file provides comprehensive guidance for Claude Code when working in this p
314
210
  - Add clear labels and descriptions
315
211
  - Example:
316
212
  <div class="mermaid-wrapper">
213
+ <div class="mermaid-title">Diagram</div>
317
214
  <div class="mermaid">graph TD
318
215
  A[User Request] --> B{Authentication}
319
216
  B -->|Valid| C[Process Request]
@@ -485,7 +382,7 @@ const response = await api.getData({ userId: 123 });
485
382
  <li><strong>Create working examples</strong> that can be copy-pasted</li>
486
383
  <li><strong>Add troubleshooting sections</strong> for common problems</li>
487
384
  <li><strong>Include mermaid diagrams</strong> for workflows and architectures</li>
488
- <li><strong>Mark speculated information</strong> clearly with <i class="ph ph-question" aria-label="question"></i></li>
385
+ <li><strong>Mark speculated information</strong> clearly with ❓</li>
489
386
  <li><strong>Follow the naming conventions</strong> exactly</li>
490
387
  <li><strong>Create comprehensive content</strong> - aim for completeness over brevity</li>
491
388
  <li><strong>Add cross-references</strong> to related documentation</li>
@@ -584,12 +481,12 @@ For Claude to generate accurate and consistent content, include key organization
584
481
  </code></pre>
585
482
  <p>When these facts are included in your CLAUDE.md, Claude will:</p>
586
483
  <ul>
587
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Use correct contact information in examples</li>
588
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Reference the right URLs in documentation</li>
589
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Apply consistent author attribution</li>
590
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Generate accurate meta tags for SEO</li>
591
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Use proper organizational context</li>
592
- <li><i class="ph ph-check-circle" aria-label="checked"></i> Follow established technical standards</li>
484
+ <li>✅ Use correct contact information in examples</li>
485
+ <li>✅ Reference the right URLs in documentation</li>
486
+ <li>✅ Apply consistent author attribution</li>
487
+ <li>✅ Generate accurate meta tags for SEO</li>
488
+ <li>✅ Use proper organizational context</li>
489
+ <li>✅ Follow established technical standards</li>
593
490
  </ul>
594
491
  <h3>1.3 Global CLAUDE.md Best Practices</h3>
595
492
  <p>Your global <code>~/.claude/CLAUDE.md</code> should include universal standards that apply to all projects. Here&#39;s an expanded example:</p>
@@ -646,6 +543,7 @@ For Claude to generate accurate and consistent content, include key organization
646
543
  - Group related changes in single commits
647
544
  </code></pre>
648
545
  <div class="mermaid-wrapper">
546
+ <div class="mermaid-title">Diagram</div>
649
547
  <div class="mermaid">graph LR
650
548
  A[Global CLAUDE.md] --> B[Document Standards]
651
549
  A --> C[Git Workflow]
@@ -677,6 +575,7 @@ For Claude to generate accurate and consistent content, include key organization
677
575
  <h3>1.4 Benefits of Environment Facts in Documentation</h3>
678
576
  <p>Including these environmental facts in your CLAUDE.md provides several key benefits:</p>
679
577
  <div class="mermaid-wrapper">
578
+ <div class="mermaid-title">Diagram</div>
680
579
  <div class="mermaid">graph TD
681
580
  A[Environment Facts in CLAUDE.md] --> B[Accurate Content]
682
581
  A --> C[Consistent Branding]
@@ -741,6 +640,7 @@ npx doc-builder init
741
640
  <h2>Step 3: Documentation Creation Workflow with Claude</h2>
742
641
  <h3>3.1 Effective Prompting Strategy</h3>
743
642
  <div class="mermaid-wrapper">
643
+ <div class="mermaid-title">Diagram</div>
744
644
  <div class="mermaid">sequenceDiagram
745
645
  participant User
746
646
  participant Claude
@@ -791,6 +691,7 @@ npx doc-builder init
791
691
  <h2>Step 4: Building Documentation Site</h2>
792
692
  <h3>4.1 Development Workflow</h3>
793
693
  <div class="mermaid-wrapper">
694
+ <div class="mermaid-title">Diagram</div>
794
695
  <div class="mermaid">graph LR
795
696
  A[Write Docs] --> B[Preview Locally]
796
697
  B --> C{Looks Good?}
@@ -836,6 +737,7 @@ npm run deploy:docs
836
737
  </code></pre>
837
738
  <h3>5.3 Deployment Workflow</h3>
838
739
  <div class="mermaid-wrapper">
740
+ <div class="mermaid-title">Diagram</div>
839
741
  <div class="mermaid">stateDiagram-v2
840
742
  [*] --> LocalDevelopment
841
743
  LocalDevelopment --> BuildDocs: npm run build:docs
@@ -850,6 +752,7 @@ npm run deploy:docs
850
752
  <h2>Step 6: Continuous Documentation Updates</h2>
851
753
  <h3>6.1 Update Workflow</h3>
852
754
  <div class="mermaid-wrapper">
755
+ <div class="mermaid-title">Diagram</div>
853
756
  <div class="mermaid">graph TD
854
757
  A[Code Changes] --> B{Docs Needed?}
855
758
  B -->|Yes| C[Update Documentation]
@@ -1038,17 +941,7 @@ The key to success is iterative refinement of your CLAUDE.md file to capture you
1038
941
  </div>
1039
942
 
1040
943
  <!-- Scripts -->
1041
- <script>
1042
- // Pass configuration to frontend
1043
- window.docBuilderConfig = {
1044
- features: {
1045
- showPdfDownload: true,
1046
- menuDefaultOpen: false
1047
- }
1048
- };
1049
- </script>
1050
944
  <script src="/js/main.js"></script>
1051
- <script src="https://unpkg.com/@supabase/supabase-js@2"></script>
1052
- <script src="/js/auth.js"></script>
945
+
1053
946
  </body>
1054
947
  </html>
package/html/guides/documentation-standards.html CHANGED
@@ -3,41 +3,14 @@
3
3
  <head>
4
4
  <meta charset="UTF-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <meta name="description" content="This document defines the documentation standards and conventions for the @knowcode/doc-builder project. All documentation created for or by this project...">
7
- <title>Document Standards for @knowcode/doc-builder</title>
8
-
9
- <meta name="author" content="Lindsay Smith">
10
- <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, document, use">
11
- <meta name="robots" content="index, follow">
12
- <link rel="canonical" href="https://doc-builder-delta.vercel.app/guides/documentation-standards.html">
13
-
14
- <!-- Open Graph / Facebook -->
15
- <meta property="og:type" content="article">
16
- <meta property="og:url" content="https://doc-builder-delta.vercel.app/guides/documentation-standards.html">
17
- <meta property="og:title" content="Document Standards for @knowcode/doc-builder">
18
- <meta property="og:description" content="This document defines the documentation standards and conventions for the @knowcode/doc-builder project. All documentation created for or by this project...">
19
- <meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
20
- <meta property="og:site_name" content="@knowcode/doc-builder">
21
- <meta property="og:locale" content="en_US">
22
-
23
- <!-- Twitter Card -->
24
- <meta name="twitter:card" content="summary_large_image">
25
- <meta name="twitter:site" content="@planbbackups">
26
- <meta name="twitter:creator" content="@planbbackups">
27
- <meta name="twitter:title" content="Document Standards for @knowcode/doc-builder">
28
- <meta name="twitter:description" content="This document defines the documentation standards and conventions for the @knowcode/doc-builder project. All documentation created for or by this project...">
29
- <meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
30
-
31
- <!-- Custom Meta Tags -->
32
- <meta name="google-site-verification" content="FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ">
33
- <meta name="msvalidate.01" content="B2D8C4C12C530D47AA962B24CAA09630">
6
+ <meta name="description" content="Beautiful documentation with the least effort possible">
7
+ <title>Document Standards for @knowcode/doc-builder - @knowcode/doc-builder</title>
34
8
 
35
9
  <!-- Fonts -->
36
10
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
37
11
 
38
12
  <!-- Icons -->
39
13
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
40
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
41
14
 
42
15
  <!-- Mermaid -->
43
16
  <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
@@ -45,90 +18,8 @@
45
18
  <!-- Styles -->
46
19
  <link rel="stylesheet" href="/css/notion-style.css">
47
20
 
48
-
49
- <!-- Hide content until auth check -->
50
- <style>
51
- body {
52
- visibility: hidden;
53
- opacity: 0;
54
- transition: opacity 0.3s ease;
55
- }
56
- body.authenticated {
57
- visibility: visible;
58
- opacity: 1;
59
- }
60
- /* Show login/logout pages immediately */
61
- body.auth-page {
62
- visibility: visible;
63
- opacity: 1;
64
- }
65
- /* Style auth button consistently */
66
- .auth-btn {
67
- background: none;
68
- border: none;
69
- color: var(--text-secondary);
70
- cursor: pointer;
71
- padding: 0.5rem;
72
- border-radius: 0.5rem;
73
- transition: all 0.2s;
74
- font-size: 1.1rem;
75
- }
76
- .auth-btn:hover {
77
- background: var(--bg-secondary);
78
- color: var(--text-primary);
79
- }
80
- </style>
81
-
82
-
83
21
  <!-- Favicon -->
84
- <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✨</text></svg>">
85
-
86
- <script type="application/ld+json">
87
- {
88
- "@context": "https://schema.org",
89
- "@type": "TechArticle",
90
- "headline": "Document Standards for @knowcode/doc-builder",
91
- "description": "This document defines the documentation standards and conventions for the @knowcode/doc-builder project. All documentation created for or by this project...",
92
- "author": {
93
- "@type": "Person",
94
- "name": "Lindsay Smith"
95
- },
96
- "publisher": {
97
- "@type": "Organization",
98
- "name": "Knowcode Ltd",
99
- "url": "https://knowcode.tech"
100
- },
101
- "datePublished": "2025-07-26T16:10:10.601Z",
102
- "dateModified": "2025-07-26T16:10:10.601Z",
103
- "mainEntityOfPage": {
104
- "@type": "WebPage",
105
- "@id": "https://doc-builder-delta.vercel.app/guides/documentation-standards.html"
106
- },
107
- "breadcrumb": {
108
- "@type": "BreadcrumbList",
109
- "itemListElement": [
110
- {
111
- "@type": "ListItem",
112
- "position": 1,
113
- "name": "@knowcode/doc-builder",
114
- "item": "https://doc-builder-delta.vercel.app"
115
- },
116
- {
117
- "@type": "ListItem",
118
- "position": 2,
119
- "name": "Guides",
120
- "item": "https://doc-builder-delta.vercel.app/guides/"
121
- },
122
- {
123
- "@type": "ListItem",
124
- "position": 3,
125
- "name": "Documentation Standards",
126
- "item": "https://doc-builder-delta.vercel.app/guides/documentation-standards.html"
127
- }
128
- ]
129
- }
130
- }
131
- </script>
22
+ <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📚</text></svg>">
132
23
  </head>
133
24
  <body>
134
25
  <!-- Header -->
@@ -138,14 +29,10 @@
138
29
 
139
30
  <div class="header-actions">
140
31
  <div class="deployment-info">
141
- <span class="deployment-date" title="Built with doc-builder v1.8.6">Last updated: Jul 26, 2025, 04:10 PM UTC</span>
32
+ <span class="deployment-date" title="Built with doc-builder v1.4.21">Last updated: Jul 27, 2025, 08:32 AM UTC</span>
142
33
  </div>
143
34
 
144
35
 
145
- <a href="../../login.html" class="auth-btn" title="Login/Logout">
146
- <i class="fas fa-sign-in-alt"></i>
147
- </a>
148
-
149
36
 
150
37
  <button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
151
38
  <i class="fas fa-moon"></i>
@@ -193,6 +80,7 @@
193
80
  <div class="nav-content" >
194
81
  <a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="fas fa-file-alt"></i> Overview</a>
195
82
  <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>
83
+ <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="fas fa-file-alt"></i> Image Modal Test</a>
196
84
  <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>
197
85
  <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="fas fa-file-alt"></i> Vercel First Time Setup Guide</a></div></div>
198
86
  <div class="nav-section" data-level="1">
@@ -204,6 +92,7 @@
204
92
  <a href="/guides/authentication-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase - a secure, scalable authentication platform."><i class="fas fa-file-alt"></i> Authentication Guide</a>
205
93
  <a href="/guides/claude-workflow-guide.html" class="nav-item" data-tooltip="This guide demonstrates an efficient workflow for using Claude Code with a refined CLAUDE.md file to create high-quality documentation and deploy it..."><i class="fas fa-file-alt"></i> Claude Workflow Guide</a>
206
94
  <a href="/guides/documentation-standards.html" class="nav-item active" data-tooltip="This document defines the documentation standards and conventions for the @knowcode/doc-builder project."><i class="fas fa-file-alt"></i> Documentation Standards</a>
95
+ <a href="/guides/image-modal-guide.html" class="nav-item" data-tooltip="When users click on any image in your generated documentation, it opens in a professional modal overlay with: Full-screen viewing experience Smooth..."><i class="fas fa-file-alt"></i> Image Modal Guide</a>
207
96
  <a href="/guides/phosphor-icons-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder automatically converts Unicode emojis in your markdown files to beautiful Phosphor icons in the generated HTML."><i class="fas fa-file-alt"></i> Phosphor Icons Guide</a>
208
97
  <a href="/guides/private-directory-authentication.html" class="nav-item" data-tooltip="The @knowcode/doc-builder provides flexible authentication options to protect your documentation."><i class="fas fa-file-alt"></i> Private Directory Authentication</a>
209
98
  <a href="/guides/public-site-deployment.html" class="nav-item" data-tooltip="The @knowcode/doc-builder now supports deploying public documentation sites without authentication."><i class="fas fa-file-alt"></i> Public Site Deployment</a>
@@ -212,7 +101,7 @@
212
101
  <a href="/guides/seo-optimization-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes comprehensive SEO (Search Engine Optimization) features that automatically optimize your documentation for search..."><i class="fas fa-file-alt"></i> Seo Optimization Guide</a>
213
102
  <a href="/guides/troubleshooting-guide.html" class="nav-item" data-tooltip="This guide helps you resolve common issues when using @knowcode/doc-builder."><i class="fas fa-file-alt"></i> Troubleshooting Guide</a>
214
103
  <a href="/guides/windows-setup-guide.html" class="nav-item" data-tooltip="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel."><i class="fas fa-file-alt"></i> Windows Setup Guide</a></div></div>
215
- <div class="nav-section private-nav" data-level="1">
104
+ <div class="nav-section" data-level="1">
216
105
  <a class="nav-title collapsible" href="#" data-target="nav-private-1" >
217
106
  <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Private
218
107
  </a>
@@ -225,7 +114,7 @@
225
114
  <a href="/private/supabase-auth-setup-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase."><i class="fas fa-file-alt"></i> Supabase Auth Setup Guide</a>
226
115
  <a href="/private/test-private-doc.html" class="nav-item" data-tooltip="Test Private Document."><i class="fas fa-file-alt"></i> Test Private Doc</a>
227
116
  <a href="/private/user-management-tooling.html" class="nav-item" data-tooltip="The user management system is a set of tools designed to manage user access to Supabase-authenticated documentation sites built with."><i class="fas fa-file-alt"></i> User Management Tooling</a></div></div>
228
- <div class="nav-section private-nav" data-level="2">
117
+ <div class="nav-section" data-level="2">
229
118
  <a class="nav-title collapsible" href="/private/launch/README.html" data-target="nav-private-launch-2" >
230
119
  <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Launch
231
120
  </a>
@@ -236,6 +125,12 @@
236
125
  <a href="/private/launch/go-to-market-strategy.html" class="nav-item" data-tooltip="Go-to-Market Strategy &amp; Product Launch Plan."><i class="fas fa-file-alt"></i> Go To Market Strategy</a>
237
126
  <a href="/private/launch/launch-announcements.html" class="nav-item" data-tooltip="This document contains ready-to-use announcement templates for launching @knowcode/doc-builder across various platforms and channels."><i class="fas fa-file-alt"></i> Launch Announcements</a>
238
127
  <a href="/private/launch/vercel-deployment-auth-setup.html" class="nav-item" data-tooltip="Vercel Deployment Authentication Setup Guide."><i class="fas fa-file-alt"></i> Vercel Deployment Auth Setup</a></div></div>
128
+ <div class="nav-section" data-level="1">
129
+ <a class="nav-title collapsible" href="#" data-target="nav-prompts-1" >
130
+ <i class="fas fa-chevron-right collapse-icon"></i><i class="fas fa-folder"></i> Prompts
131
+ </a>
132
+ <div class="nav-content collapsed" id="nav-prompts-1">
133
+ <a href="/prompts/markdown-document-standards.html" class="nav-item" data-tooltip="Detailed introduction to the topic..."><i class="fas fa-file-alt"></i> Markdown Document Standards</a></div></div>
239
134
  </nav>
240
135
  <div class="resize-handle"></div>
241
136
  </aside>
@@ -291,6 +186,7 @@ Brief description of the document&#39;s contents and purpose.
291
186
  <h3>1. Mermaid Diagrams</h3>
292
187
  <p>Include diagrams wherever they help explain complex concepts:</p>
293
188
  <pre><code class="language-markdown"><div class="mermaid-wrapper">
189
+ <div class="mermaid-title">Diagram</div>
294
190
  <div class="mermaid">graph TD
295
191
  A[User Input] --> B{Valid?}
296
192
  B -->|Yes| C[Process]
@@ -311,9 +207,9 @@ Brief description of the document&#39;s contents and purpose.
311
207
  <h3>2. Information Verification</h3>
312
208
  <p>Mark all information with verification status:</p>
313
209
  <ul>
314
- <li><i class="ph ph-check-circle" aria-label="checked"></i> <strong>Verified</strong>: Information confirmed through testing or official sources</li>
315
- <li><i class="ph ph-question" aria-label="question"></i> <strong>Speculated</strong>: Assumptions or unconfirmed information</li>
316
- <li><i class="ph ph-warning-circle" aria-label="warning"></i> <strong>Warning</strong>: Important caveats or potential issues</li>
210
+ <li>✅ <strong>Verified</strong>: Information confirmed through testing or official sources</li>
211
+ <li>❓ <strong>Speculated</strong>: Assumptions or unconfirmed information</li>
212
+ <li>⚠️ <strong>Warning</strong>: Important caveats or potential issues</li>
317
213
  <li>🚧 <strong>In Progress</strong>: Features or documentation under development</li>
318
214
  </ul>
319
215
  <p>Example:</p>
@@ -658,17 +554,7 @@ open html/index.html
658
554
  </div>
659
555
 
660
556
  <!-- Scripts -->
661
- <script>
662
- // Pass configuration to frontend
663
- window.docBuilderConfig = {
664
- features: {
665
- showPdfDownload: true,
666
- menuDefaultOpen: false
667
- }
668
- };
669
- </script>
670
557
  <script src="/js/main.js"></script>
671
- <script src="https://unpkg.com/@supabase/supabase-js@2"></script>
672
- <script src="/js/auth.js"></script>
558
+
673
559
  </body>
674
560
  </html>