@knowcode/doc-builder 1.9.15 → 1.9.17
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.
- package/.claude/settings.local.json +2 -1
- package/assets/css/notion-style.css +76 -0
- package/assets/js/main.js +97 -0
- package/doc-builder.config.js +2 -1
- package/doc-builder.config.js.backup.1754119567787 +123 -0
- package/doc-builder.config.js.backup.1754120048862 +124 -0
- package/html/README.html +6 -4
- package/html/about-doc-builder.html +6 -4
- package/html/css/notion-style.css +76 -0
- package/html/documentation-index.html +6 -4
- package/html/guides/authentication-default-change.html +6 -4
- package/html/guides/authentication-guide.html +6 -4
- package/html/guides/claude-workflow-guide.html +6 -4
- package/html/guides/configuration-guide.html +6 -4
- package/html/guides/documentation-standards.html +6 -4
- package/html/guides/html-embedding-guide.html +6 -4
- package/html/guides/image-modal-guide.html +6 -4
- package/html/guides/phosphor-icons-guide.html +6 -4
- package/html/guides/private-directory-authentication-troubleshooting.html +6 -4
- package/html/guides/private-directory-authentication.html +6 -4
- package/html/guides/public-site-deployment.html +6 -4
- package/html/guides/search-engine-verification-guide.html +6 -4
- package/html/guides/seo-guide.html +6 -4
- package/html/guides/seo-optimization-guide.html +6 -4
- package/html/guides/supabase-authentication-complete-guide.html +6 -4
- package/html/guides/troubleshooting-guide.html +6 -4
- package/html/guides/windows-setup-guide.html +6 -4
- package/html/image-modal-test.html +6 -4
- package/html/index.html +6 -4
- package/html/js/main.js +97 -0
- package/html/private/cache-control-anti-pattern.html +6 -4
- package/html/private/launch/README.html +6 -4
- package/html/private/launch/auth-cleanup-summary.html +6 -4
- package/html/private/launch/bubble-plugin-specification.html +6 -4
- package/html/private/launch/go-to-market-strategy.html +6 -4
- package/html/private/launch/launch-announcements.html +6 -4
- package/html/private/launch/vercel-deployment-auth-setup.html +6 -4
- package/html/private/next-steps-walkthrough.html +6 -4
- package/html/private/supabase-auth-implementation-completed.html +6 -4
- package/html/private/supabase-auth-implementation-plan.html +6 -4
- package/html/private/supabase-auth-integration-plan.html +6 -4
- package/html/private/supabase-auth-setup-guide.html +6 -4
- package/html/private/test-private-doc.html +6 -4
- package/html/private/user-management-tooling.html +6 -4
- package/html/prompts/beautiful-documentation-design.html +6 -4
- package/html/prompts/markdown-document-standards.html +6 -4
- package/html/prompts/project-rename-strategy-sasha-publish.html +6 -4
- package/html/sitemap.xml +62 -56
- package/html/test-mermaid-enhanced.html +341 -0
- package/html/vercel-cli-setup-guide.html +6 -4
- package/html/vercel-first-time-setup-guide.html +6 -4
- package/lib/config.js +5 -0
- package/lib/core-builder.js +2 -1
- package/package.json +1 -1
|
@@ -0,0 +1,341 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<meta name="description" content="This document tests the enhanced Mermaid diagram styling with rounded corners and improved appearance.">
|
|
7
|
+
<title>Mermaid Enhanced Styling Test | @knowcode/doc-builder</title>
|
|
8
|
+
|
|
9
|
+
<meta name="generator" content="@knowcode/doc-builder by Knowcode Ltd">
|
|
10
|
+
<meta name="author" content="Lindsay Smith">
|
|
11
|
+
<meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, example, mermaid">
|
|
12
|
+
<meta name="robots" content="index, follow">
|
|
13
|
+
<link rel="canonical" href="https://doc-builder-delta.vercel.app/test-mermaid-enhanced.html">
|
|
14
|
+
|
|
15
|
+
<!-- Open Graph / Facebook -->
|
|
16
|
+
<meta property="og:type" content="article">
|
|
17
|
+
<meta property="og:url" content="https://doc-builder-delta.vercel.app/test-mermaid-enhanced.html">
|
|
18
|
+
<meta property="og:title" content="Mermaid Enhanced Styling Test | @knowcode/doc-builder">
|
|
19
|
+
<meta property="og:description" content="This document tests the enhanced Mermaid diagram styling with rounded corners and improved appearance.">
|
|
20
|
+
<meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
|
|
21
|
+
<meta property="og:site_name" content="@knowcode/doc-builder">
|
|
22
|
+
<meta property="og:locale" content="en_US">
|
|
23
|
+
|
|
24
|
+
<!-- Twitter Card -->
|
|
25
|
+
<meta name="twitter:card" content="summary_large_image">
|
|
26
|
+
<meta name="twitter:site" content="@planbbackups">
|
|
27
|
+
<meta name="twitter:creator" content="@planbbackups">
|
|
28
|
+
<meta name="twitter:title" content="Mermaid Enhanced Styling Test | @knowcode/doc-builder">
|
|
29
|
+
<meta name="twitter:description" content="This document tests the enhanced Mermaid diagram styling with rounded corners and improved appearance.">
|
|
30
|
+
<meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
|
|
31
|
+
|
|
32
|
+
<!-- Custom Meta Tags -->
|
|
33
|
+
<meta name="google-site-verification" content="FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ">
|
|
34
|
+
<meta name="msvalidate.01" content="B2D8C4C12C530D47AA962B24CAA09630">
|
|
35
|
+
|
|
36
|
+
<!-- Fonts -->
|
|
37
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
|
|
38
|
+
|
|
39
|
+
<!-- Icons -->
|
|
40
|
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
41
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
|
|
42
|
+
|
|
43
|
+
<!-- Mermaid -->
|
|
44
|
+
<script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
|
|
45
|
+
|
|
46
|
+
<!-- Styles -->
|
|
47
|
+
<link rel="stylesheet" href="/css/notion-style.css">
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
<!-- Hide content until auth check -->
|
|
51
|
+
<style>
|
|
52
|
+
body {
|
|
53
|
+
visibility: hidden;
|
|
54
|
+
opacity: 0;
|
|
55
|
+
transition: opacity 0.3s ease;
|
|
56
|
+
}
|
|
57
|
+
body.authenticated {
|
|
58
|
+
visibility: visible;
|
|
59
|
+
opacity: 1;
|
|
60
|
+
}
|
|
61
|
+
/* Show login/logout pages immediately */
|
|
62
|
+
body.auth-page {
|
|
63
|
+
visibility: visible;
|
|
64
|
+
opacity: 1;
|
|
65
|
+
}
|
|
66
|
+
/* Style auth button consistently */
|
|
67
|
+
.auth-btn {
|
|
68
|
+
background: none;
|
|
69
|
+
border: none;
|
|
70
|
+
color: var(--text-secondary);
|
|
71
|
+
cursor: pointer;
|
|
72
|
+
padding: 0.5rem;
|
|
73
|
+
border-radius: 0.5rem;
|
|
74
|
+
transition: all 0.2s;
|
|
75
|
+
font-size: 1.1rem;
|
|
76
|
+
}
|
|
77
|
+
.auth-btn:hover {
|
|
78
|
+
background: var(--bg-secondary);
|
|
79
|
+
color: var(--text-primary);
|
|
80
|
+
}
|
|
81
|
+
</style>
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
<!-- Favicon -->
|
|
85
|
+
<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>">
|
|
86
|
+
|
|
87
|
+
<script type="application/ld+json">
|
|
88
|
+
{
|
|
89
|
+
"@context": "https://schema.org",
|
|
90
|
+
"@type": "TechArticle",
|
|
91
|
+
"headline": "Mermaid Enhanced Styling Test",
|
|
92
|
+
"description": "This document tests the enhanced Mermaid diagram styling with rounded corners and improved appearance.",
|
|
93
|
+
"author": {
|
|
94
|
+
"@type": "Person",
|
|
95
|
+
"name": "Lindsay Smith"
|
|
96
|
+
},
|
|
97
|
+
"publisher": {
|
|
98
|
+
"@type": "Organization",
|
|
99
|
+
"name": "Knowcode Ltd",
|
|
100
|
+
"url": "https://knowcode.tech"
|
|
101
|
+
},
|
|
102
|
+
"datePublished": "2025-08-02T07:34:26.302Z",
|
|
103
|
+
"dateModified": "2025-08-02T07:34:26.302Z",
|
|
104
|
+
"mainEntityOfPage": {
|
|
105
|
+
"@type": "WebPage",
|
|
106
|
+
"@id": "https://doc-builder-delta.vercel.app/test-mermaid-enhanced.html"
|
|
107
|
+
},
|
|
108
|
+
"breadcrumb": {
|
|
109
|
+
"@type": "BreadcrumbList",
|
|
110
|
+
"itemListElement": [
|
|
111
|
+
{
|
|
112
|
+
"@type": "ListItem",
|
|
113
|
+
"position": 1,
|
|
114
|
+
"name": "@knowcode/doc-builder",
|
|
115
|
+
"item": "https://doc-builder-delta.vercel.app"
|
|
116
|
+
},
|
|
117
|
+
{
|
|
118
|
+
"@type": "ListItem",
|
|
119
|
+
"position": 2,
|
|
120
|
+
"name": "Test Mermaid Enhanced",
|
|
121
|
+
"item": "https://doc-builder-delta.vercel.app/test-mermaid-enhanced.html"
|
|
122
|
+
}
|
|
123
|
+
]
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
</script>
|
|
127
|
+
</head>
|
|
128
|
+
<body>
|
|
129
|
+
<!-- Header -->
|
|
130
|
+
<header class="header">
|
|
131
|
+
<div class="header-content">
|
|
132
|
+
<a href="/index.html" class="logo">@knowcode/doc-builder</a>
|
|
133
|
+
|
|
134
|
+
<div class="header-actions">
|
|
135
|
+
<div class="deployment-info">
|
|
136
|
+
<span class="deployment-date" title="Built with doc-builder v1.9.16">Last updated: Aug 2, 2025, 07:34 AM UTC</span>
|
|
137
|
+
</div>
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
<a href="../login.html" class="auth-btn" title="Login/Logout">
|
|
141
|
+
<i class="fas fa-sign-in-alt"></i>
|
|
142
|
+
</a>
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
|
|
146
|
+
<i class="fas fa-moon"></i>
|
|
147
|
+
</button>
|
|
148
|
+
|
|
149
|
+
<button id="menu-toggle" class="menu-toggle" aria-label="Toggle menu">
|
|
150
|
+
<i class="fas fa-bars"></i>
|
|
151
|
+
</button>
|
|
152
|
+
</div>
|
|
153
|
+
</div>
|
|
154
|
+
</header>
|
|
155
|
+
|
|
156
|
+
|
|
157
|
+
|
|
158
|
+
<!-- Breadcrumbs -->
|
|
159
|
+
<nav class="breadcrumbs" id="breadcrumbs">
|
|
160
|
+
<!-- Breadcrumbs will be generated by JavaScript -->
|
|
161
|
+
</nav>
|
|
162
|
+
|
|
163
|
+
<!-- Main Content -->
|
|
164
|
+
<div class="main-wrapper">
|
|
165
|
+
<!-- Sidebar -->
|
|
166
|
+
<aside class="sidebar">
|
|
167
|
+
<div class="sidebar-header">
|
|
168
|
+
<div class="filter-box">
|
|
169
|
+
<input type="text" placeholder="Search menu..." class="filter-input" id="nav-filter">
|
|
170
|
+
<i class="fas fa-search filter-icon"></i>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
<nav class="navigation">
|
|
174
|
+
|
|
175
|
+
<div class="nav-section" data-level="0">
|
|
176
|
+
<a class="nav-title" href="/README.html" >
|
|
177
|
+
<i class="ph ph-house"></i> Documentation
|
|
178
|
+
</a>
|
|
179
|
+
<div class="nav-content" >
|
|
180
|
+
<a href="/README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
|
|
181
|
+
<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>
|
|
182
|
+
<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>
|
|
183
|
+
<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>
|
|
184
|
+
<a href="/test-mermaid-enhanced.html" class="nav-item active" data-tooltip="Mermaid Enhanced Styling Test."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Test Mermaid Enhanced</a>
|
|
185
|
+
<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>
|
|
186
|
+
<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>
|
|
187
|
+
<div class="nav-section" data-level="1">
|
|
188
|
+
<a class="nav-title collapsible" href="#" data-target="nav-guides-1" >
|
|
189
|
+
<i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-book"></i> Guides
|
|
190
|
+
</a>
|
|
191
|
+
<div class="nav-content collapsed" id="nav-guides-1">
|
|
192
|
+
<a href="/guides/authentication-default-change.html" class="nav-item" data-tooltip="Starting from version 1.7.4, @knowcode/doc-builder now defaults to no authentication for all documentation sites."><i class="ph ph-file-text"></i> Authentication Default Change</a>
|
|
193
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Authentication Guide</a>
|
|
194
|
+
<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="ph ph-pencil-simple" style="color: #d97706;"></i> Claude Workflow Guide</a>
|
|
195
|
+
<a href="/guides/configuration-guide.html" class="nav-item" data-tooltip="This guide explains how @knowcode/doc-builder handles configuration files and settings."><i class="ph ph-check-circle" style="color: #059669;"></i> Configuration Guide</a>
|
|
196
|
+
<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="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Standards</a>
|
|
197
|
+
<a href="/guides/html-embedding-guide.html" class="nav-item" data-tooltip="Starting from version 1.9.2, doc-builder treats HTML files ( and ) as attachments that are automatically copied to your output directory during the..."><i class="ph ph-check-circle" style="color: #059669;"></i> Html Embedding Guide</a>
|
|
198
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Image Modal Guide</a>
|
|
199
|
+
<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="ph ph-pencil-simple" style="color: #d97706;"></i> Phosphor Icons Guide</a>
|
|
200
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Private Directory Authentication</a>
|
|
201
|
+
<a href="/guides/private-directory-authentication-troubleshooting.html" class="nav-item" data-tooltip="Private Directory Authentication Troubleshooting."><i class="ph ph-check-circle" style="color: #059669;"></i> Private Directory Authentication Troubleshooting</a>
|
|
202
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Public Site Deployment</a>
|
|
203
|
+
<a href="/guides/search-engine-verification-guide.html" class="nav-item" data-tooltip="Search engine verification provides access to powerful webmaster tools:."><i class="ph ph-check-circle" style="color: #059669;"></i> Search Engine Verification Guide</a>
|
|
204
|
+
<a href="/guides/seo-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes comprehensive SEO (Search Engine Optimization) features to help your documentation rank better in search results and..."><i class="ph ph-check-circle" style="color: #059669;"></i> Seo Guide</a>
|
|
205
|
+
<a href="/guides/seo-optimization-guide.html" class="nav-item" data-tooltip="Comprehensive guide to optimizing documentation for search engines. Learn SEO best practices, use built-in features, and improve your rankings."><i class="ph ph-check-circle" style="color: #059669;"></i> Seo Optimization Guide</a>
|
|
206
|
+
<a href="/guides/supabase-authentication-complete-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes built-in Supabase authentication that provides enterprise-grade security with zero configuration."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Authentication Complete Guide</a>
|
|
207
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Troubleshooting Guide</a>
|
|
208
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Windows Setup Guide</a></div></div>
|
|
209
|
+
<div class="nav-section private-nav" data-level="1">
|
|
210
|
+
<a class="nav-title collapsible" href="#" data-target="nav-private-1" >
|
|
211
|
+
<i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-lock"></i> Private
|
|
212
|
+
</a>
|
|
213
|
+
<div class="nav-content collapsed" id="nav-private-1">
|
|
214
|
+
<a href="/private/cache-control-anti-pattern.html" class="nav-item" data-tooltip="Cache Control Anti-Pattern: Why Aggressive Cache-Busting is Bad for Documentation Sites."><i class="ph ph-check-circle" style="color: #059669;"></i> Cache Control Anti Pattern</a>
|
|
215
|
+
<a href="/private/next-steps-walkthrough.html" class="nav-item" data-tooltip="Now that we've implemented Supabase authentication, let's walk through testing the implementation and preparing for deployment."><i class="ph ph-check-circle" style="color: #059669;"></i> Next Steps Walkthrough</a>
|
|
216
|
+
<a href="/private/supabase-auth-implementation-completed.html" class="nav-item" data-tooltip="This document records the successful implementation of Supabase authentication in @knowcode/doc-builder v1.7.5+."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Auth Implementation Completed</a>
|
|
217
|
+
<a href="/private/supabase-auth-implementation-plan.html" class="nav-item" data-tooltip="Supabase Auth Implementation Plan for @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Auth Implementation Plan</a>
|
|
218
|
+
<a href="/private/supabase-auth-integration-plan.html" class="nav-item" data-tooltip="Supabase Authentication Integration Plan for @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Auth Integration Plan</a>
|
|
219
|
+
<a href="/private/supabase-auth-setup-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Auth Setup Guide</a>
|
|
220
|
+
<a href="/private/test-private-doc.html" class="nav-item" data-tooltip="Test Private Document."><i class="ph ph-file-text"></i> Test Private Doc</a>
|
|
221
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> User Management Tooling</a></div></div>
|
|
222
|
+
<div class="nav-section private-nav" data-level="2">
|
|
223
|
+
<a class="nav-title collapsible" href="/private/launch/README.html" data-target="nav-private-launch-2" >
|
|
224
|
+
<i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-rocket-launch"></i> Launch
|
|
225
|
+
</a>
|
|
226
|
+
<div class="nav-content collapsed" id="nav-private-launch-2">
|
|
227
|
+
<a href="/private/launch/README.html" class="nav-item" data-tooltip="This directory contains all documentation related to the commercial launch of @knowcode/doc-builder, including go-to-market strategy, platform..."><i class="ph ph-check-circle" style="color: #059669;"></i> Launch Overview</a>
|
|
228
|
+
<a href="/private/launch/auth-cleanup-summary.html" class="nav-item" data-tooltip="All references to the old client-side authentication system have been removed from @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> Auth Cleanup Summary</a>
|
|
229
|
+
<a href="/private/launch/bubble-plugin-specification.html" class="nav-item" data-tooltip="This document outlines the technical specification for creating a Bubble.io plugin that integrates @knowcode/doc-builder, enabling Bubble developers..."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Bubble Plugin Specification</a>
|
|
230
|
+
<a href="/private/launch/go-to-market-strategy.html" class="nav-item" data-tooltip="Go-to-Market Strategy & Product Launch Plan."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Go To Market Strategy</a>
|
|
231
|
+
<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="ph ph-check-circle" style="color: #059669;"></i> Launch Announcements</a>
|
|
232
|
+
<a href="/private/launch/vercel-deployment-auth-setup.html" class="nav-item" data-tooltip="Vercel Deployment Authentication Setup Guide."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Deployment Auth Setup</a></div></div>
|
|
233
|
+
<div class="nav-section" data-level="1">
|
|
234
|
+
<a class="nav-title collapsible" href="#" data-target="nav-prompts-1" >
|
|
235
|
+
<i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-chat-circle-dots"></i> Prompts
|
|
236
|
+
</a>
|
|
237
|
+
<div class="nav-content collapsed" id="nav-prompts-1">
|
|
238
|
+
<a href="/prompts/beautiful-documentation-design.html" class="nav-item" data-tooltip="🎨 Beautiful Documentation Design Guide."><i class="ph ph-check-circle" style="color: #059669;"></i> Beautiful Documentation Design</a>
|
|
239
|
+
<a href="/prompts/markdown-document-standards.html" class="nav-item" data-tooltip="Detailed introduction to the topic..."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Markdown Document Standards</a>
|
|
240
|
+
<a href="/prompts/project-rename-strategy-sasha-publish.html" class="nav-item" data-tooltip="This document outlines the comprehensive strategy for renaming the @knowcode/doc-builder project to "sasha-publish", including all package references,..."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Project Rename Strategy Sasha Publish</a></div></div>
|
|
241
|
+
</nav>
|
|
242
|
+
<div class="resize-handle"></div>
|
|
243
|
+
</aside>
|
|
244
|
+
|
|
245
|
+
<!-- Content Area -->
|
|
246
|
+
<main class="content">
|
|
247
|
+
<div class="content-inner">
|
|
248
|
+
<h1>Mermaid Enhanced Styling Test</h1>
|
|
249
|
+
<p>This document tests the enhanced Mermaid diagram styling with rounded corners and improved appearance.</p>
|
|
250
|
+
<h2>Flowchart Example</h2>
|
|
251
|
+
<div class="mermaid-wrapper">
|
|
252
|
+
<div class="mermaid">flowchart TD
|
|
253
|
+
A([Start Process]) --> B{Decision Point}
|
|
254
|
+
B -->|Yes| C[Process Step]
|
|
255
|
+
B -->|No| D[Alternative Step]
|
|
256
|
+
C --> E([End Success])
|
|
257
|
+
D --> F([End Alternative])
|
|
258
|
+
|
|
259
|
+
classDef processClass fill:#F7F6F3,stroke:#37352F,stroke-width:2px
|
|
260
|
+
classDef decisionClass fill:#D3E5FF,stroke:#0073E6,stroke-width:2px
|
|
261
|
+
classDef endClass fill:#D1FAE5,stroke:#0F7B6C,stroke-width:2px
|
|
262
|
+
|
|
263
|
+
class A,C,D processClass
|
|
264
|
+
class B decisionClass
|
|
265
|
+
class E,F endClass</div>
|
|
266
|
+
</div>
|
|
267
|
+
<h2>Sequence Diagram Example</h2>
|
|
268
|
+
<div class="mermaid-wrapper">
|
|
269
|
+
<div class="mermaid">sequenceDiagram
|
|
270
|
+
participant User
|
|
271
|
+
participant App
|
|
272
|
+
participant API
|
|
273
|
+
participant DB
|
|
274
|
+
|
|
275
|
+
User->>App: Login Request
|
|
276
|
+
App->>API: Validate Credentials
|
|
277
|
+
API->>DB: Check User
|
|
278
|
+
DB-->>API: User Data
|
|
279
|
+
API-->>App: Auth Token
|
|
280
|
+
App-->>User: Login Success
|
|
281
|
+
|
|
282
|
+
Note over User,DB: Enhanced styling with<br/>rounded corners</div>
|
|
283
|
+
</div>
|
|
284
|
+
<h2>State Diagram Example</h2>
|
|
285
|
+
<div class="mermaid-wrapper">
|
|
286
|
+
<div class="mermaid">stateDiagram-v2
|
|
287
|
+
[*] --> Idle
|
|
288
|
+
Idle --> Processing : Start
|
|
289
|
+
Processing --> Success : Complete
|
|
290
|
+
Processing --> Error : Fail
|
|
291
|
+
Success --> [*]
|
|
292
|
+
Error --> Retry : Retry
|
|
293
|
+
Retry --> Processing
|
|
294
|
+
Error --> [*] : Give Up</div>
|
|
295
|
+
</div>
|
|
296
|
+
<h2>Gantt Chart Example</h2>
|
|
297
|
+
<div class="mermaid-wrapper">
|
|
298
|
+
<div class="mermaid">gantt
|
|
299
|
+
title Enhanced Project Timeline
|
|
300
|
+
dateFormat YYYY-MM-DD
|
|
301
|
+
section Design
|
|
302
|
+
UI Design :active, design, 2024-01-01, 10d
|
|
303
|
+
UX Research :after design, 5d
|
|
304
|
+
section Development
|
|
305
|
+
Frontend :dev1, 2024-01-15, 20d
|
|
306
|
+
Backend :dev2, 2024-01-10, 25d
|
|
307
|
+
Testing :after dev1 dev2, 10d</div>
|
|
308
|
+
</div>
|
|
309
|
+
<h2>Features Demonstrated</h2>
|
|
310
|
+
<p><i style="font-size: 1.2em" class="ph ph-sparkle" aria-label="special"></i> <strong>Enhanced Styling Features:</strong></p>
|
|
311
|
+
<ul>
|
|
312
|
+
<li><i style="font-size: 1.2em" class="ph ph-circle" aria-label="blue circle"></i> Rounded corners on all shapes (8px radius)</li>
|
|
313
|
+
<li><i style="font-size: 1.2em" class="ph ph-palette" aria-label="design"></i> Notion-inspired color palette</li>
|
|
314
|
+
<li>💫 Subtle drop shadows for depth</li>
|
|
315
|
+
<li><i style="font-size: 1.2em" class="ph ph-target" aria-label="goal"></i> Hover effects with elevation</li>
|
|
316
|
+
<li><i style="font-size: 1.2em" class="ph ph-note-pencil" aria-label="edit"></i> Consistent typography</li>
|
|
317
|
+
<li>🌗 Dark mode support</li>
|
|
318
|
+
<li><i style="font-size: 1.2em" class="ph ph-lightning" aria-label="fast"></i> Smooth transitions</li>
|
|
319
|
+
</ul>
|
|
320
|
+
<p>These improvements make Mermaid diagrams more visually appealing and consistent with the overall Notion-inspired design system.</p>
|
|
321
|
+
|
|
322
|
+
</div>
|
|
323
|
+
</main>
|
|
324
|
+
</div>
|
|
325
|
+
|
|
326
|
+
<!-- Scripts -->
|
|
327
|
+
<script>
|
|
328
|
+
// Pass configuration to frontend
|
|
329
|
+
window.docBuilderConfig = {
|
|
330
|
+
features: {
|
|
331
|
+
showPdfDownload: true,
|
|
332
|
+
menuDefaultOpen: false,
|
|
333
|
+
mermaidEnhanced: true
|
|
334
|
+
}
|
|
335
|
+
};
|
|
336
|
+
</script>
|
|
337
|
+
<script src="/js/main.js"></script>
|
|
338
|
+
<script src="https://unpkg.com/@supabase/supabase-js@2"></script>
|
|
339
|
+
<script src="/js/auth.js"></script>
|
|
340
|
+
</body>
|
|
341
|
+
</html>
|
|
@@ -99,8 +99,8 @@
|
|
|
99
99
|
"name": "Knowcode Ltd",
|
|
100
100
|
"url": "https://knowcode.tech"
|
|
101
101
|
},
|
|
102
|
-
"datePublished": "2025-08-
|
|
103
|
-
"dateModified": "2025-08-
|
|
102
|
+
"datePublished": "2025-08-02T07:34:26.304Z",
|
|
103
|
+
"dateModified": "2025-08-02T07:34:26.304Z",
|
|
104
104
|
"mainEntityOfPage": {
|
|
105
105
|
"@type": "WebPage",
|
|
106
106
|
"@id": "https://doc-builder-delta.vercel.app/vercel-cli-setup-guide.html"
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
|
|
134
134
|
<div class="header-actions">
|
|
135
135
|
<div class="deployment-info">
|
|
136
|
-
<span class="deployment-date" title="Built with doc-builder v1.9.
|
|
136
|
+
<span class="deployment-date" title="Built with doc-builder v1.9.16">Last updated: Aug 2, 2025, 07:34 AM UTC</span>
|
|
137
137
|
</div>
|
|
138
138
|
|
|
139
139
|
|
|
@@ -181,6 +181,7 @@
|
|
|
181
181
|
<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>
|
|
182
182
|
<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>
|
|
183
183
|
<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>
|
|
184
|
+
<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>
|
|
184
185
|
<a href="/vercel-cli-setup-guide.html" class="nav-item active" 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>
|
|
185
186
|
<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>
|
|
186
187
|
<div class="nav-section" data-level="1">
|
|
@@ -471,7 +472,8 @@ vercel --scope team-name
|
|
|
471
472
|
window.docBuilderConfig = {
|
|
472
473
|
features: {
|
|
473
474
|
showPdfDownload: true,
|
|
474
|
-
menuDefaultOpen: false
|
|
475
|
+
menuDefaultOpen: false,
|
|
476
|
+
mermaidEnhanced: true
|
|
475
477
|
}
|
|
476
478
|
};
|
|
477
479
|
</script>
|
|
@@ -99,8 +99,8 @@
|
|
|
99
99
|
"name": "Knowcode Ltd",
|
|
100
100
|
"url": "https://knowcode.tech"
|
|
101
101
|
},
|
|
102
|
-
"datePublished": "2025-08-
|
|
103
|
-
"dateModified": "2025-08-
|
|
102
|
+
"datePublished": "2025-08-02T07:34:26.306Z",
|
|
103
|
+
"dateModified": "2025-08-02T07:34:26.306Z",
|
|
104
104
|
"mainEntityOfPage": {
|
|
105
105
|
"@type": "WebPage",
|
|
106
106
|
"@id": "https://doc-builder-delta.vercel.app/vercel-first-time-setup-guide.html"
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
|
|
134
134
|
<div class="header-actions">
|
|
135
135
|
<div class="deployment-info">
|
|
136
|
-
<span class="deployment-date" title="Built with doc-builder v1.9.
|
|
136
|
+
<span class="deployment-date" title="Built with doc-builder v1.9.16">Last updated: Aug 2, 2025, 07:34 AM UTC</span>
|
|
137
137
|
</div>
|
|
138
138
|
|
|
139
139
|
|
|
@@ -181,6 +181,7 @@
|
|
|
181
181
|
<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>
|
|
182
182
|
<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>
|
|
183
183
|
<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>
|
|
184
|
+
<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>
|
|
184
185
|
<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>
|
|
185
186
|
<a href="/vercel-first-time-setup-guide.html" class="nav-item active" 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>
|
|
186
187
|
<div class="nav-section" data-level="1">
|
|
@@ -430,7 +431,8 @@
|
|
|
430
431
|
window.docBuilderConfig = {
|
|
431
432
|
features: {
|
|
432
433
|
showPdfDownload: true,
|
|
433
|
-
menuDefaultOpen: false
|
|
434
|
+
menuDefaultOpen: false,
|
|
435
|
+
mermaidEnhanced: true
|
|
434
436
|
}
|
|
435
437
|
};
|
|
436
438
|
</script>
|
package/lib/config.js
CHANGED
|
@@ -27,6 +27,7 @@ const defaultConfig = {
|
|
|
27
27
|
authentication: false, // false (no auth) or 'supabase' (secure auth)
|
|
28
28
|
changelog: true,
|
|
29
29
|
mermaid: true,
|
|
30
|
+
mermaidEnhanced: true, // Enhanced Mermaid styling with rounded corners and better themes
|
|
30
31
|
tooltips: true,
|
|
31
32
|
search: false,
|
|
32
33
|
darkMode: true,
|
|
@@ -128,6 +129,7 @@ const notionInspiredPreset = {
|
|
|
128
129
|
authentication: false, // Default to no auth - can be enabled with 'supabase'
|
|
129
130
|
changelog: true,
|
|
130
131
|
mermaid: true,
|
|
132
|
+
mermaidEnhanced: true, // Enhanced Mermaid styling with rounded corners and better themes
|
|
131
133
|
tooltips: true,
|
|
132
134
|
search: false,
|
|
133
135
|
darkMode: true,
|
|
@@ -319,6 +321,9 @@ function migrateConfig(userConfig, targetVersion) {
|
|
|
319
321
|
if (userConfig.features?.banner === undefined) {
|
|
320
322
|
newFeatures.push('Configurable preview banner');
|
|
321
323
|
}
|
|
324
|
+
if (userConfig.features?.mermaidEnhanced === undefined) {
|
|
325
|
+
newFeatures.push('Enhanced Mermaid diagram styling');
|
|
326
|
+
}
|
|
322
327
|
|
|
323
328
|
if (newFeatures.length > 0) {
|
|
324
329
|
console.log(chalk.green(`✨ Added new features: ${newFeatures.join(', ')}`));
|
package/lib/core-builder.js
CHANGED
|
@@ -598,7 +598,8 @@ ${seoTags}
|
|
|
598
598
|
window.docBuilderConfig = {
|
|
599
599
|
features: {
|
|
600
600
|
showPdfDownload: ${config.features?.showPdfDownload !== false},
|
|
601
|
-
menuDefaultOpen: ${config.features?.menuDefaultOpen !== false}
|
|
601
|
+
menuDefaultOpen: ${config.features?.menuDefaultOpen !== false},
|
|
602
|
+
mermaidEnhanced: ${config.features?.mermaidEnhanced !== false}
|
|
602
603
|
}
|
|
603
604
|
};
|
|
604
605
|
</script>
|