@knowcode/doc-builder 1.4.7 → 1.4.9

package/CHANGELOG.md

@@ -5,6 +5,31 @@ 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.4.9] - 2025-07-21
+
+### Added
+- Documentation section explaining Claude Code integration
+- Best practices for using Claude Code to generate and maintain documentation
+- Examples of Claude Code workflows for documentation tasks
+- "Claude Code Ready" feature to the features list
+
+### Documentation
+- Enhanced README with comprehensive Claude Code usage instructions
+- Added documentation conventions and patterns used by Claude Code
+- Included examples of common documentation generation tasks
+
+## [1.4.8] - 2025-07-21
+
+### Fixed
+- Fixed excessive spacing between breadcrumbs and navigation menu
+- Changed breadcrumb default positioning from `calc(var(--header-height) + 3.5rem)` to `var(--header-height)`
+- Removed duplicate `.sidebar` and `.main-wrapper` CSS definitions causing layout conflicts
+
+### Background
+- The breadcrumb bar was incorrectly adding banner height (3.5rem) even when no banner was visible
+- Duplicate CSS definitions for `.main-wrapper` were using conflicting spacing approaches (padding vs margin)
+- This fixes the final spacing issue in the CSS cleanup series from v1.4.5-v1.4.7
+
 ## [1.4.7] - 2025-07-21
 
 ### Fixed

package/README.md

@@ -41,6 +41,7 @@ This aligns perfectly with our mission: beautiful documentation should be access
 - 🔄 **Live Reload** - Development server with hot reloading
 - ☁️ **Vercel Integration** - One-command deployment to Vercel
 - 📦 **Self-Contained** - No configuration or setup required
+- 🤖 **Claude Code Ready** - Optimized for AI-generated documentation workflows
 
 ## Quick Start
 
@@ -221,6 +222,50 @@ my-project/
 └── package.json
 ```
 
+## Working with Claude Code
+
+Many users leverage Claude Code to create and maintain their documentation. Claude Code is particularly effective at:
+
+### Generating Documentation
+Claude Code can analyze your codebase and automatically generate comprehensive documentation:
+- API documentation from code comments and function signatures
+- User guides based on your application structure
+- Installation and setup instructions
+- Troubleshooting guides
+
+### Documentation Conventions
+When using Claude Code to generate documentation, it typically follows these patterns:
+- Creates properly structured markdown files with hierarchical headings
+- Includes code examples with syntax highlighting
+- Generates Mermaid diagrams for visual representations
+- Follows consistent naming conventions (e.g., `component-guide.md`, `api-reference.md`)
+- Adds metadata headers for document tracking
+
+### Example Claude Code Workflow
+1. **Initial Documentation Generation**
+   ```
+   "Create comprehensive API documentation for this project"
+   ```
+   Claude Code will scan your codebase and generate appropriate markdown files in your `docs/` directory.
+
+2. **Updating Documentation**
+   ```
+   "Update the API documentation to reflect the new authentication methods"
+   ```
+   Claude Code will modify existing files while preserving structure and formatting.
+
+3. **Adding Visual Documentation**
+   ```
+   "Add a Mermaid diagram showing the application architecture"
+   ```
+   Claude Code will create diagrams that are automatically rendered by doc-builder.
+
+### Best Practices with Claude Code
+- **Structured Requests**: Be specific about what documentation you need
+- **Iterative Updates**: Claude Code can update existing docs without starting from scratch
+- **Review Generated Content**: Always review AI-generated documentation for accuracy
+- **Maintain CLAUDE.md**: Keep project-specific instructions in a CLAUDE.md file for consistent documentation style
+
 ## Using in Other Projects
 
 ### Option 1: NPM Link (Development)

package/assets/css/notion-style.css

@@ -450,7 +450,7 @@ pre code {
   border-bottom: 1px solid var(--color-border-default);
   padding: var(--space-2) 0;
   position: fixed;
-  top: calc(var(--header-height) + 3.5rem);
+  top: var(--header-height);
   left: 0;
   right: 0;
   z-index: 900;
@@ -506,16 +506,6 @@ pre code {
   margin-top: calc(var(--header-height) + var(--breadcrumb-height) + 3.5rem);
 }
 
-/* Sidebar */
-.sidebar {
-  width: var(--sidebar-width);
-  background: var(--color-bg-secondary);
-  border-right: 1px solid var(--color-border-default);
-  display: flex;
-  flex-direction: column;
-  position: relative;
-}
-
 .sidebar-header {
   padding: var(--space-3);
   border-bottom: 1px solid var(--color-border-default);
@@ -681,18 +671,6 @@ pre code {
 }
 
 /* Main Content */
-.main-wrapper {
-  display: flex;
-  padding-top: calc(var(--header-height) + var(--breadcrumb-height));
-  min-height: 100vh;
-  transition: padding-top var(--duration-normal);
-}
-
-/* Adjust layout when banner is visible */
-.main-wrapper.banner-visible {
-  padding-top: calc(var(--header-height) + var(--breadcrumb-height) + 3.5rem);
-}
-
 .content {
   flex: 1;
   padding: 40px var(--space-8);

package/html/README.html

@@ -29,7 +29,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.4.6">Last updated: Jul 21, 2025, 11:05 AM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.8">Last updated: Jul 21, 2025, 11:30 AM UTC</span>
                 </div>
                 
                 

package/html/css/notion-style.css

@@ -450,7 +450,7 @@ pre code {
   border-bottom: 1px solid var(--color-border-default);
   padding: var(--space-2) 0;
   position: fixed;
-  top: calc(var(--header-height) + 3.5rem);
+  top: var(--header-height);
   left: 0;
   right: 0;
   z-index: 900;
@@ -506,16 +506,6 @@ pre code {
   margin-top: calc(var(--header-height) + var(--breadcrumb-height) + 3.5rem);
 }
 
-/* Sidebar */
-.sidebar {
-  width: var(--sidebar-width);
-  background: var(--color-bg-secondary);
-  border-right: 1px solid var(--color-border-default);
-  display: flex;
-  flex-direction: column;
-  position: relative;
-}
-
 .sidebar-header {
   padding: var(--space-3);
   border-bottom: 1px solid var(--color-border-default);
@@ -681,18 +671,6 @@ pre code {
 }
 
 /* Main Content */
-.main-wrapper {
-  display: flex;
-  padding-top: calc(var(--header-height) + var(--breadcrumb-height));
-  min-height: 100vh;
-  transition: padding-top var(--duration-normal);
-}
-
-/* Adjust layout when banner is visible */
-.main-wrapper.banner-visible {
-  padding-top: calc(var(--header-height) + var(--breadcrumb-height) + 3.5rem);
-}
-
 .content {
   flex: 1;
   padding: 40px var(--space-8);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knowcode/doc-builder",
-  "version": "1.4.7",
+  "version": "1.4.9",
   "description": "Reusable documentation builder for markdown-based sites with Vercel deployment support",
   "main": "index.js",
   "bin": {

package/.claude/settings.local.json

@@ -1,22 +0,0 @@
-{
-  "permissions": {
-    "allow": [
-      "Bash(node:*)",
-      "Bash(git add:*)",
-      "Bash(git commit:*)",
-      "Bash(npm version:*)",
-      "Bash(npm pack)",
-      "Bash(cat:*)",
-      "Bash(rm:*)",
-      "Bash(npm publish:*)",
-      "Bash(git tag:*)",
-      "Bash(git push:*)",
-      "Bash(git pull:*)",
-      "Bash(git rebase:*)",
-      "Bash(npm info:*)",
-      "Bash(npx:*)",
-      "Bash(grep:*)"
-    ],
-    "deny": []
-  }
-}

package/package/CACHE-BUSTING-GUIDE.md

@@ -1,82 +0,0 @@
-# Cache Busting Guide for @knowcode/doc-builder
-
-If you're not seeing updates after upgrading to a new version, it's likely due to caching. Follow these steps:
-
-## 1. Clean Everything Locally
-
-```bash
-# Remove old build artifacts
-rm -rf html/
-
-# Clear npm cache
-npm cache clean --force
-
-# Remove node_modules and reinstall
-rm -rf node_modules
-npm install
-
-# Make sure you have the latest version
-npm install @knowcode/doc-builder@latest
-```
-
-## 2. Rebuild with Fresh Files
-
-```bash
-# Build fresh documentation
-npx @knowcode/doc-builder build
-```
-
-## 3. Deploy with Force Flag
-
-```bash
-# Force Vercel to ignore cache
-vercel --prod --force
-```
-
-## 4. Clear Browser Cache
-
-- **Chrome/Edge**: Cmd+Shift+R (Mac) or Ctrl+Shift+R (Windows)
-- **Firefox**: Cmd+Shift+R (Mac) or Ctrl+Shift+R (Windows)
-- **Safari**: Cmd+Option+R
-- Or use Incognito/Private browsing mode
-
-## 5. Clear Vercel/CDN Cache (if applicable)
-
-If using Vercel:
-1. Go to your project dashboard
-2. Settings → Functions → Purge Cache
-3. Or redeploy with a different domain temporarily
-
-## 6. Add Cache Busting to Your Build
-
-Edit your `doc-builder.config.js` to add version query strings:
-
-```javascript
-module.exports = {
-  // ... other config
-  cacheBust: true, // This will add ?v=timestamp to CSS/JS files
-};
-```
-
-## Common Issues
-
-- **"I updated but nothing changed"** - It's cache. Follow all steps above.
-- **"Tooltips still don't work"** - Clear browser cache and check console for errors
-- **"Spacing is still wrong"** - The CSS is cached. Hard refresh the page.
-
-## Verify You Have The Right Version
-
-Check the version in your package.json:
-```bash
-npm list @knowcode/doc-builder
-```
-
-Should show: `@knowcode/doc-builder@1.3.13` or higher.
-
-## Still Not Working?
-
-1. Open browser DevTools
-2. Go to Network tab
-3. Check "Disable cache" checkbox
-4. Refresh the page
-5. Look at the CSS/JS files being loaded - they should not show "(from cache)"