@knowcode/doc-builder 1.4.17 → 1.4.19

package/CHANGELOG.md

@@ -5,6 +5,30 @@ 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.19] - 2025-07-21
+
+### Fixed
+- Fixed large white gap appearing at 768px breakpoint
+- Removed duplicate CSS definitions for breadcrumbs
+- Corrected margin-top calculation for mobile layout
+
+### Background
+- Duplicate breadcrumb CSS definitions were causing conflicts
+- Main wrapper had incorrect margin-top on mobile (80px instead of 40px)
+- Now properly accounts for only the fixed header height on mobile
+
+## [1.4.18] - 2025-07-21
+
+### Fixed
+- Fixed responsive breakpoint - sidebar now remains visible on tablets (768px-1024px)
+- Removed large gap above content on mobile devices
+- Improved mobile layout consistency
+
+### Background
+- Sidebar was disappearing at 1024px instead of 768px
+- Mobile layout had excessive padding causing large gaps
+- Now follows proper responsive design patterns for tablets vs mobile
+
 ## [1.4.17] - 2025-07-21
 
 ### Improved

package/assets/css/notion-style.css

@@ -443,26 +443,7 @@ pre code {
   color: var(--color-text-primary);
 }
 
-/* Breadcrumbs */
-.breadcrumbs {
-  background: var(--color-bg-default);
-  border-bottom: 1px solid var(--color-border-default);
-  padding: var(--space-2) 0;
-  position: fixed;
-  top: var(--header-height);
-  left: 0;
-  right: 0;
-  z-index: 900;
-  transition: top var(--duration-normal);
-}
-
-.breadcrumbs.banner-visible {
-  top: calc(var(--header-height) + 3.5rem);
-}
-
-.breadcrumbs:not(.banner-visible) {
-  top: var(--header-height);
-}
+/* Breadcrumbs - definition moved to line 888 to avoid duplication */
 
 .breadcrumb-item {
   display: inline-flex;
@@ -899,10 +880,18 @@ tr:hover {
   right: 0;
   height: var(--breadcrumb-height);
   z-index: 900;
-  transition: background-color var(--duration-normal);
+  transition: top var(--duration-normal), background-color var(--duration-normal);
   gap: var(--space-2);
 }
 
+.breadcrumbs.banner-visible {
+  top: calc(var(--header-height) + 3.5rem);
+}
+
+.breadcrumbs:not(.banner-visible) {
+  top: var(--header-height);
+}
+
 .breadcrumb-item {
   display: flex;
   align-items: center;
@@ -942,10 +931,7 @@ tr:hover {
   opacity: 1;
 }
 
-/* Adjust breadcrumbs when banner is visible */
-.breadcrumbs.banner-visible {
-  top: calc(var(--header-height) + 3.5rem);
-}
+/* Banner visibility handled in main breadcrumbs definition */
 
 /* Menu Toggle (Mobile) */
 .menu-toggle {
@@ -959,7 +945,14 @@ tr:hover {
 }
 
 /* Responsive Design */
-@media (max-width: 1024px) {
+/* Keep sidebar visible on tablets, hide only on mobile */
+
+@media (max-width: 768px) {
+  .header-content {
+    padding: 0 var(--space-4);
+  }
+  
+  /* Hide sidebar on mobile */
   .sidebar {
     transform: translateX(-100%);
     transition: transform var(--duration-normal) var(--easing-out);
@@ -971,6 +964,7 @@ tr:hover {
   
   .main-wrapper {
     margin-left: 0;
+    margin-top: var(--header-height); /* Only account for fixed header on mobile */
   }
   
   .content {
@@ -983,21 +977,6 @@ tr:hover {
   }
 }
 
-@media (max-width: 768px) {
-  .header-content {
-    padding: 0 var(--space-4);
-  }
-  
-  /* Adjust mobile layout when banner is visible */
-  .main-wrapper.banner-visible {
-    padding-top: calc(var(--header-height) + var(--breadcrumb-height) + 4rem);
-  }
-  
-  .sidebar.banner-visible {
-    top: calc(var(--header-height) + var(--breadcrumb-height) + 4rem);
-  }
-}
-
 /* Mermaid Diagrams */
 .mermaid {
   background: var(--color-bg-secondary);

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.17">Last updated: Jul 21, 2025, 04:26 PM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.19">Last updated: Jul 21, 2025, 05:36 PM UTC</span>
                 </div>
                 
                 

package/html/claude-workflow-guide.html

@@ -29,7 +29,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.4.17">Last updated: Jul 21, 2025, 04:26 PM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.19">Last updated: Jul 21, 2025, 05:36 PM UTC</span>
                 </div>
                 
                 

package/html/css/notion-style.css

@@ -443,26 +443,7 @@ pre code {
   color: var(--color-text-primary);
 }
 
-/* Breadcrumbs */
-.breadcrumbs {
-  background: var(--color-bg-default);
-  border-bottom: 1px solid var(--color-border-default);
-  padding: var(--space-2) 0;
-  position: fixed;
-  top: var(--header-height);
-  left: 0;
-  right: 0;
-  z-index: 900;
-  transition: top var(--duration-normal);
-}
-
-.breadcrumbs.banner-visible {
-  top: calc(var(--header-height) + 3.5rem);
-}
-
-.breadcrumbs:not(.banner-visible) {
-  top: var(--header-height);
-}
+/* Breadcrumbs - definition moved to line 888 to avoid duplication */
 
 .breadcrumb-item {
   display: inline-flex;
@@ -899,10 +880,18 @@ tr:hover {
   right: 0;
   height: var(--breadcrumb-height);
   z-index: 900;
-  transition: background-color var(--duration-normal);
+  transition: top var(--duration-normal), background-color var(--duration-normal);
   gap: var(--space-2);
 }
 
+.breadcrumbs.banner-visible {
+  top: calc(var(--header-height) + 3.5rem);
+}
+
+.breadcrumbs:not(.banner-visible) {
+  top: var(--header-height);
+}
+
 .breadcrumb-item {
   display: flex;
   align-items: center;
@@ -942,10 +931,7 @@ tr:hover {
   opacity: 1;
 }
 
-/* Adjust breadcrumbs when banner is visible */
-.breadcrumbs.banner-visible {
-  top: calc(var(--header-height) + 3.5rem);
-}
+/* Banner visibility handled in main breadcrumbs definition */
 
 /* Menu Toggle (Mobile) */
 .menu-toggle {
@@ -959,7 +945,14 @@ tr:hover {
 }
 
 /* Responsive Design */
-@media (max-width: 1024px) {
+/* Keep sidebar visible on tablets, hide only on mobile */
+
+@media (max-width: 768px) {
+  .header-content {
+    padding: 0 var(--space-4);
+  }
+  
+  /* Hide sidebar on mobile */
   .sidebar {
     transform: translateX(-100%);
     transition: transform var(--duration-normal) var(--easing-out);
@@ -971,6 +964,7 @@ tr:hover {
   
   .main-wrapper {
     margin-left: 0;
+    margin-top: var(--header-height); /* Only account for fixed header on mobile */
   }
   
   .content {
@@ -983,21 +977,6 @@ tr:hover {
   }
 }
 
-@media (max-width: 768px) {
-  .header-content {
-    padding: 0 var(--space-4);
-  }
-  
-  /* Adjust mobile layout when banner is visible */
-  .main-wrapper.banner-visible {
-    padding-top: calc(var(--header-height) + var(--breadcrumb-height) + 4rem);
-  }
-  
-  .sidebar.banner-visible {
-    top: calc(var(--header-height) + var(--breadcrumb-height) + 4rem);
-  }
-}
-
 /* Mermaid Diagrams */
 .mermaid {
   background: var(--color-bg-secondary);

package/html/documentation-index.html

@@ -29,7 +29,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.4.17">Last updated: Jul 21, 2025, 04:26 PM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.19">Last updated: Jul 21, 2025, 05:36 PM UTC</span>
                 </div>
                 
                 

package/html/guides/document-standards.html

@@ -29,7 +29,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.4.17">Last updated: Jul 21, 2025, 04:26 PM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.19">Last updated: Jul 21, 2025, 05:36 PM UTC</span>
                 </div>
                 
                 

package/html/index.html

@@ -29,7 +29,7 @@
             
             <div class="header-actions">
                 <div class="deployment-info">
-                    <span class="deployment-date" title="Built with doc-builder v1.4.17">Last updated: Jul 21, 2025, 04:26 PM UTC</span>
+                    <span class="deployment-date" title="Built with doc-builder v1.4.19">Last updated: Jul 21, 2025, 05:36 PM UTC</span>
                 </div>
                 
                 

package/package.json

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