@knowcode/doc-builder 1.5.15 → 1.5.16

package/CHANGELOG.md

@@ -5,6 +5,19 @@ 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.16] - 2025-07-22
+
+### Changed
+- Simplified Mermaid diagram display by removing unnecessary UI elements
+- Removed "Copy to Mermaid" button from diagram toolbar
+- Removed "Copy SVG" button from diagram toolbar
+- Removed "Diagram" heading from Mermaid diagram wrapper
+- Removed "Mermaid Diagram" text label from toolbar
+
+### Improved
+- Cleaner, less cluttered presentation of Mermaid diagrams
+- Full Screen button remains available for better diagram viewing
+
 ## [1.5.15] - 2025-07-22
 
 ### Fixed

package/README.md

@@ -177,7 +177,7 @@ module.exports = {
 
 <table>
 <tr>
-<td width="33%">
+<td width="50%">
 
 ### 🏗️ Core Commands
 | Command | Purpose |
@@ -187,8 +187,14 @@ module.exports = {
 | `deploy` | Deploy to Vercel |
 | `init` | Initialize project |
 
+### ⚙️ Config Commands
+| Command | Purpose |
+|---------|---------|
+| `set-production-url` | Set custom URL |
+| `reset-vercel` | Clear settings |
+
 </td>
-<td width="33%">
+<td width="50%">
 
 ### 🔍 SEO Commands
 | Command | Purpose |
@@ -197,14 +203,8 @@ module.exports = {
 | `setup-seo` | Configure SEO |
 | `google-verify` | Add verification |
 
-</td>
-<td width="33%">
-
-### ⚙️ Config Commands
-| Command | Purpose |
-|---------|---------|
-| `set-production-url` | Set custom URL |
-| `reset-vercel` | Clear settings |
+### 📚 Documentation
+All commands support `--help` for detailed options and examples.
 
 </td>
 </tr>
@@ -432,22 +432,22 @@ npx @knowcode/doc-builder deploy --production-url my-docs.vercel.app
 
 <table>
 <tr>
-<td width="33%">
+<td width="50%">
+
+### Development Integration
+
+**NPM Link (Local Dev)**
 
-### NPM Link (Dev)
 ```bash
-# In doc-builder dir
+# In doc-builder directory
 npm link
 
 # In your project
 npm link @knowcode/doc-builder
 ```
-*For local development*
 
-</td>
-<td width="33%">
+**File Reference (Monorepos)**
 
-### File Reference
 ```json
 {
   "devDependencies": {
@@ -456,22 +456,32 @@ npm link @knowcode/doc-builder
   }
 }
 ```
-*For monorepos*
 
 </td>
-<td width="33%">
+<td width="50%">
+
+### Production Integration
+
+**NPM Registry (Recommended)**
+
+```json
+{
+  "devDependencies": {
+    "@knowcode/doc-builder": "^1.5.14"
+  }
+}
+```
+
+**Git Repository (Private)**
 
-### Git Repository
 ```json
 {
   "devDependencies": {
     "@knowcode/doc-builder": 
-      "git+https://github.com/
-       knowcode/doc-builder.git"
+      "git+https://github.com/knowcode/doc-builder.git"
   }
 }
 ```
-*For private repos*
 
 </td>
 </tr>
@@ -491,4 +501,4 @@ MIT License - See [LICENSE](LICENSE) file for details
 
 Made with ❤️ by the @knowcode team
 
-</div>
+</div>

package/assets/js/main.js

@@ -79,9 +79,6 @@ function initializeMermaidFullScreen() {
     const toolbar = document.createElement('div');
     toolbar.className = 'mermaid-toolbar';
     
-    const title = document.createElement('div');
-    title.textContent = 'Mermaid Diagram';
-    
     const actions = document.createElement('div');
     actions.className = 'mermaid-actions';
     
@@ -91,23 +88,8 @@ function initializeMermaidFullScreen() {
     fullScreenBtn.innerHTML = '<i class="fas fa-expand"></i> Full Screen';
     fullScreenBtn.addEventListener('click', () => openMermaidFullScreen(mermaidDiv, index));
     
-    // Copy SVG button
-    const copyBtn = document.createElement('button');
-    copyBtn.className = 'mermaid-btn';
-    copyBtn.innerHTML = '<i class="fas fa-copy"></i> Copy SVG';
-    copyBtn.addEventListener('click', () => copyMermaidSVG(mermaidDiv));
-    
-    // Copy Mermaid source button
-    const copyMermaidBtn = document.createElement('button');
-    copyMermaidBtn.className = 'mermaid-btn';
-    copyMermaidBtn.innerHTML = '<i class="fas fa-code"></i> Copy Mermaid';
-    copyMermaidBtn.addEventListener('click', () => copyMermaidSource(mermaidDiv));
-    
     actions.appendChild(fullScreenBtn);
-    actions.appendChild(copyBtn);
-    actions.appendChild(copyMermaidBtn);
     
-    toolbar.appendChild(title);
     toolbar.appendChild(actions);
     
     // Create wrapper for the diagram

package/html/README.html

@@ -3,11 +3,11 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="description" content="&gt; Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling.">
+    <meta name="description" content="&lt;div align=&quot;center&quot;&gt;">
     <title>@knowcode/doc-builder | Doc Builder</title>
     
     <meta name="author" content="Lindsay Smith">
-    <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, your, knowcode">
+    <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, width, table">
     <meta name="robots" content="index, follow">
     <link rel="canonical" href="https://doc-builder-delta.vercel.app/README.html">
     
@@ -15,7 +15,7 @@
     <meta property="og:type" content="article">
     <meta property="og:url" content="https://doc-builder-delta.vercel.app/README.html">
     <meta property="og:title" content="@knowcode/doc-builder | Doc Builder">
-    <meta property="og:description" content="&gt; Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling.">
+    <meta property="og:description" content="&lt;div align=&quot;center&quot;&gt;">
     <meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
     <meta property="og:site_name" content="Doc Builder">
     <meta property="og:locale" content="en_US">
@@ -25,7 +25,7 @@
     <meta name="twitter:site" content="@planbbackups">
     <meta name="twitter:creator" content="@planbbackups">
     <meta name="twitter:title" content="@knowcode/doc-builder | Doc Builder">
-    <meta name="twitter:description" content="&gt; Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling.">
+    <meta name="twitter:description" content="&lt;div align=&quot;center&quot;&gt;">
     <meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
     
     <!-- Custom Meta Tags -->
@@ -52,7 +52,7 @@
   "@context": "https://schema.org",
   "@type": "TechArticle",
   "headline": "@knowcode/doc-builder",
-  "description": "> Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling.",
+  "description": "<div align=\"center\">",
   "author": {
     "@type": "Person",
     "name": "Lindsay Smith"
@@ -62,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T11:15:59.515Z",
-  "dateModified": "2025-07-22T11:15:59.515Z",
+  "datePublished": "2025-07-22T11:52:26.119Z",
+  "dateModified": "2025-07-22T11:52:26.119Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/README.html"
@@ -96,7 +96,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.14">Last updated: Jul 22, 2025, 11:15 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.15">Last updated: Jul 22, 2025, 11:52 AM UTC</span>
                 </div>
                 
                 
@@ -170,139 +170,253 @@
         <main class="content">
             <div class="content-inner">
                 <h1>@knowcode/doc-builder</h1>
+<div align="center">
+
 <blockquote>
 <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><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
-
-# Or use with npx
-npx @knowcode/doc-builder@latest deploy
+<h3><i class="ph ph-rocket-launch" aria-label="launch"></i> Quick Start</h3>
+<pre><code class="language-bash">npx @knowcode/doc-builder@latest deploy
 </code></pre>
+<p><a href="https://doc-builder-delta.vercel.app"><strong>Live Demo</strong></a> | <a href="https://www.npmjs.com/package/@knowcode/doc-builder"><strong>NPM Package</strong></a> | <a href="https://github.com/knowcode/doc-builder"><strong>GitHub</strong></a></p>
+</div>
+
+<hr>
 <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>
+<table>
+<tr>
+<td width="50%">
+
+<h3><i class="ph ph-palette" aria-label="design"></i> Design &amp; UX</h3>
 <ul>
-<li><strong>Notion-inspired UI</strong> - Clean, modern interface that users love</li>
+<li><strong>Notion-inspired UI</strong> - Clean, modern interface</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>
+<li><strong>Responsive layout</strong> - Perfect on any device</li>
+<li><strong>Syntax highlighting</strong> - Beautiful code blocks</li>
 </ul>
-<h3><i class="ph ph-magnifying-glass" aria-label="search"></i> Powerful Search &amp; Navigation</h3>
+<h3><i class="ph ph-magnifying-glass" aria-label="search"></i> Navigation</h3>
 <ul>
 <li><strong>Full-text search</strong> - Find anything instantly</li>
-<li><strong>Smart navigation</strong> - Hierarchical folder structure</li>
+<li><strong>Smart navigation</strong> - Hierarchical structure</li>
 <li><strong>Breadcrumbs</strong> - Always know where you are</li>
 <li><strong>Keyboard shortcuts</strong> - Navigate like a pro</li>
 </ul>
-<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><i class="ph ph-rocket-launch" aria-label="launch"></i> Easy Deployment</h3>
+</td>
+<td width="50%">
+
+<h3><i class="ph ph-chart-bar" aria-label="chart"></i> Content Support</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>
+<li><strong>Mermaid diagrams</strong> - Visual documentation</li>
+<li><strong>GitHub markdown</strong> - Full GFM support</li>
+<li><strong>Interactive tooltips</strong> - Document previews</li>
+<li><strong>Version tracking</strong> - Build metadata</li>
 </ul>
-<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><i class="ph ph-target" aria-label="goal"></i> Perfect For</h2>
+<h3><i class="ph ph-rocket-launch" aria-label="launch"></i> Deployment</h3>
 <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>
+<li><strong>One-command deploy</strong> - Push to Vercel</li>
+<li><strong>Static generation</strong> - Fast &amp; secure</li>
+<li><strong>Custom domains</strong> - Your brand</li>
+<li><strong>Preview deploys</strong> - Test changes</li>
 </ul>
+</td>
+</tr>
+</table>
+
+<h2><i class="ph ph-target" aria-label="goal"></i> Use Cases</h2>
+<table>
+<tr>
+<td width="25%">
+
+<h3>Open Source</h3>
+<p>Beautiful docs for your community</p>
+</td>
+<td width="25%">
+
+<h3>Technical Teams</h3>
+<p>Internal docs developers love</p>
+</td>
+<td width="25%">
+
+<h3>API Docs</h3>
+<p>Clear, searchable references</p>
+</td>
+<td width="25%">
+
+<h3>Knowledge Base</h3>
+<p>Organize team knowledge</p>
+</td>
+</tr>
+</table>
+
 <h2><i class="ph ph-gear-six" aria-label="tools"></i> Simple Workflow</h2>
-<h3>1. Initialize Your Project</h3>
+<table>
+<tr>
+<td width="25%">
+
+<h3>1️⃣ Initialize</h3>
 <pre><code class="language-bash">npx @knowcode/doc-builder init
 </code></pre>
-<h3>2. Write Your Documentation</h3>
-<p>Create markdown files in your <code>docs</code> folder:</p>
-<pre><code class="language-markdown"># Getting Started
+<p><em>Create project structure</em></p>
+</td>
+<td width="25%">
 
-Welcome to our documentation!
-
-## Installation
-
-\`\`\`bash
-npm install amazing-package
-\`\`\`
+<h3>2️⃣ Write Docs</h3>
+<pre><code class="language-markdown"># Getting Started
+Welcome to our docs!
 
 ## Features
-
 - <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
-npx doc-builder build
+<p><em>Use markdown files</em></p>
+</td>
+<td width="25%">
 
-# Preview locally
-npx doc-builder serve
+<h3>3️⃣ Preview</h3>
+<pre><code class="language-bash">npx doc-builder dev
 </code></pre>
-<h3>4. Deploy to Vercel</h3>
+<p><em>Live development server</em></p>
+</td>
+<td width="25%">
+
+<h3>4️⃣ Deploy</h3>
 <pre><code class="language-bash">npx doc-builder deploy
 </code></pre>
-<h2><i class="ph ph-palette" aria-label="design"></i> Customization</h2>
-<p>Configure your site with <code>doc-builder.config.js</code>:</p>
+<p><em>Push to production</em></p>
+</td>
+</tr>
+</table>
+
+<h2><i class="ph ph-gear" aria-label="settings"></i> Configuration</h2>
+<table>
+<tr>
+<td width="50%">
+
+<h3>Basic Config</h3>
 <pre><code class="language-javascript">module.exports = {
   siteName: &#39;Your Amazing Docs&#39;,
-  siteDescription: &#39;Documentation that developers love&#39;,
-  features: {
-    mermaid: true,
-    darkMode: true,
-    authentication: false
-  }
+  siteDescription: &#39;Docs developers love&#39;,
+  docsDir: &#39;docs&#39;,
+  outputDir: &#39;html&#39;
 };
 </code></pre>
-<h2><i class="ph ph-chart-bar" aria-label="chart"></i> Mermaid Diagram Support</h2>
-<p>Create beautiful diagrams in your markdown:</p>
+</td>
+<td width="50%">
+
+<h3>Advanced Features</h3>
+<pre><code class="language-javascript">features: {
+  mermaid: true,      // Diagrams
+  darkMode: true,     // Theme toggle
+  authentication: true, // Password
+  changelog: true     // Auto-generate
+}
+</code></pre>
+</td>
+</tr>
+</table>
+
+<h2><i class="ph ph-chart-bar" aria-label="chart"></i> Rich Content Examples</h2>
+<table>
+<tr>
+<td width="50%">
+
+<h3>Mermaid Diagrams</h3>
 <div class="mermaid-wrapper">
       <div class="mermaid-title">Diagram</div>
       <div class="mermaid">graph LR
-    A[Write Docs] --> B[Build Site]
+    A[Write] --> B[Build]
     B --> C[Deploy]
-    C --> D[Share Knowledge]
+    C --> D[Share]
     
     style A fill:#e1f5fe
     style D fill:#c8e6c9</div>
     </div>
-<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
-}
+</td>
+<td width="50%">
+
+<h3>Code with Syntax Highlighting</h3>
+<pre><code class="language-javascript">// Beautiful code blocks
+const docBuilder = require(&#39;@knowcode/doc-builder&#39;);
+
+docBuilder.build({
+  siteName: &#39;My Docs&#39;,
+  features: { darkMode: true }
+});
 </code></pre>
-<h2><i class="ph ph-star-four" aria-label="sparkle"></i> Why doc-builder?</h2>
+</td>
+</tr>
+</table>
+
+<h2><i class="ph ph-star-four" aria-label="sparkle"></i> Why Choose doc-builder?</h2>
+<table>
+<tr>
+<td width="33%">
+
+<h3><i class="ph ph-rocket-launch" aria-label="launch"></i> Performance</h3>
 <ul>
-<li><strong>Zero configuration</strong> - Works out of the box</li>
-<li><strong>Lightning fast</strong> - Static site generation for instant loading</li>
-<li><strong>SEO friendly</strong> - Optimized for search engines</li>
+<li><strong>Lightning fast</strong> - Static generation</li>
+<li><strong>SEO optimized</strong> - Search friendly</li>
 <li><strong>Accessible</strong> - WCAG compliant</li>
-<li><strong>Version control</strong> - Track changes with Git</li>
+</ul>
+</td>
+<td width="33%">
+
+<h3><i class="ph ph-gear-six" aria-label="tools"></i> Developer Experience</h3>
+<ul>
+<li><strong>Zero config</strong> - Works instantly</li>
+<li><strong>Version control</strong> - Git-friendly</li>
 <li><strong>Open source</strong> - MIT licensed</li>
 </ul>
-<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><i class="ph ph-note-pencil" aria-label="edit"></i> License</h2>
-<p>MIT © KnowCode</p>
+</td>
+<td width="33%">
+
+<h3><i class="ph ph-money" aria-label="money"></i> Cost Effective</h3>
+<ul>
+<li><strong>Free hosting</strong> - Vercel free tier</li>
+<li><strong>No vendor lock-in</strong> - Your content</li>
+<li><strong>Export anywhere</strong> - Static HTML</li>
+</ul>
+</td>
+</tr>
+</table>
+
+<h2><i class="ph ph-handshake" aria-label="partnership"></i> Get Involved</h2>
+<table>
+<tr>
+<td width="50%">
+
+<h3>Contributing</h3>
+<p>We welcome contributions! Check our <a href="https://github.com/knowcode/doc-builder">contribution guide</a> to get started.</p>
+<p><strong>Ways to help:</strong></p>
+<ul>
+<li><i class="ph ph-bug" aria-label="bug"></i> Report bugs</li>
+<li><i class="ph ph-lightbulb" aria-label="idea"></i> Suggest features</li>
+<li><i class="ph ph-note-pencil" aria-label="edit"></i> Improve docs</li>
+<li><i class="ph ph-wrench" aria-label="settings"></i> Submit PRs</li>
+</ul>
+</td>
+<td width="50%">
+
+<h3>Community</h3>
+<p>Join our growing community of documentation enthusiasts!</p>
+<p><strong>Connect with us:</strong></p>
+<ul>
+<li><i class="ph ph-package" aria-label="package"></i> <a href="https://www.npmjs.com/package/@knowcode/doc-builder">NPM Package</a></li>
+<li>🐙 <a href="https://github.com/knowcode/doc-builder">GitHub Repo</a></li>
+<li>🌐 <a href="https://knowcode.com">Website</a></li>
+<li><i class="ph ph-chat-circle" aria-label="chat"></i> <a href="https://github.com/knowcode/doc-builder/discussions">Discussions</a></li>
+</ul>
+</td>
+</tr>
+</table>
+
 <hr>
 <div align="center">
-  <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> •
-    <a href="https://knowcode.com">Website</a>
-  </p>
+
+<h3><i class="ph ph-note-pencil" aria-label="edit"></i> License: MIT © KnowCode</h3>
+<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"><strong>Get Started</strong></a> | <a href="https://doc-builder-delta.vercel.app"><strong>View Demo</strong></a> | <a href="https://github.com/knowcode/doc-builder"><strong>Star on GitHub</strong></a></p>
 </div>
 
             </div>

package/html/css/notion-style.css

@@ -1905,47 +1905,55 @@ tr:hover {
 /* Phosphor Icons Alignment */
 .ph {
   display: inline-block;
-  vertical-align: text-bottom;
-  line-height: 1;
+  vertical-align: text-top;
+  line-height: 0.8;
   position: relative;
-  top: 0.125em; /* Move down to align with text baseline */
+  top: 0.2em; /* Push down to align with x-height of text */
 }
 
 /* Ensure icons in headings are properly aligned */
 h1 .ph, h2 .ph, h3 .ph, h4 .ph, h5 .ph, h6 .ph {
-  font-size: 0.9em; /* Slightly smaller in headings */
-  vertical-align: baseline;
-  top: 0.1em;
+  font-size: 0.85em; /* Slightly smaller in headings */
+  line-height: 0.8;
+  top: 0.15em;
 }
 
 /* Icons in lists need special handling */
 li .ph {
   margin-right: 0.3em;
-  top: 0.1em;
+  font-size: 1.05em;
+  line-height: 0.85;
+  top: 0.15em;
 }
 
 /* Icons in tables */
 td .ph, th .ph {
-  vertical-align: text-bottom;
-  top: 0.125em;
+  line-height: 0.8;
+  top: 0.2em;
 }
 
 /* Icons in navigation */
 .nav-item .ph,
 .nav-title .ph {
   vertical-align: middle;
+  line-height: 1;
   top: 0; /* Navigation items are flex, so no adjustment needed */
 }
 
 /* Icon size adjustments for better visual balance */
-.content p .ph,
-.content li .ph {
-  font-size: 1.1em; /* Slightly larger than text for visual balance */
+.content p .ph {
+  font-size: 1.05em; /* Slightly larger than text for visual balance */
 }
 
 /* Special handling for inline code with icons */
 code .ph {
   font-size: 0.9em;
-  vertical-align: baseline;
+  vertical-align: middle;
+  line-height: 1;
   top: 0;
+}
+
+/* Additional fine-tuning for specific contexts */
+.content-inner .ph {
+  transform: translateY(0.05em); /* Very slight additional adjustment */
 }

package/html/documentation-index.html

@@ -62,8 +62,8 @@
     "name": "Knowcode Ltd",
     "url": "https://knowcode.tech"
   },
-  "datePublished": "2025-07-22T11:15:59.526Z",
-  "dateModified": "2025-07-22T11:15:59.526Z",
+  "datePublished": "2025-07-22T11:52:26.129Z",
+  "dateModified": "2025-07-22T11:52:26.129Z",
   "mainEntityOfPage": {
     "@type": "WebPage",
     "@id": "https://doc-builder-delta.vercel.app/documentation-index.html"
@@ -96,7 +96,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.5.14">Last updated: Jul 22, 2025, 11:15 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.5.15">Last updated: Jul 22, 2025, 11:52 AM UTC</span>
                 </div>