@brillout/docpress 0.10.13 → 0.10.15

package/Layout.tsx

@@ -32,7 +32,7 @@ const navLeftWidthMin = 300
 const navLeftWidthMax = 370
 const containerQuerySmallNav = 550
 const containerQueryMobileNav = 1000
-const containerQueryMobileLayout = (mainViewMax + navLeftWidthMin) as 1143 // 1143 = 840 + 300
+const containerQueryMobileLayout = (mainViewMax + navLeftWidthMin) as 1140 // 1140 = 840 + 300
 const containerQueryExtraSpace = (mainViewMax + navLeftWidthMax + blockMargin) as 1213 // 1213 = 840 + 370 + 3
 
 // Avoid whitespace at the bottom of pages with almost no content
@@ -110,7 +110,7 @@ function LayoutDocsPage({ children }: { children: React.ReactNode }) {
     width: ${navLeftWidthMax}px !important;
   }
 }`
-    let navLeftHide = css`
+    let navLeftHidden = css`
 #nav-left, #nav-left-margin {
   display: none;
 }
@@ -127,18 +127,18 @@ function LayoutDocsPage({ children }: { children: React.ReactNode }) {
 }
 `
     if (!hideNavLeftAlways) {
-      navLeftHide = css`
+      navLeftHidden = css`
 @container container-viewport (max-width: ${containerQueryMobileLayout - 1}px) {
-  ${navLeftHide}
+  ${navLeftHidden}
 }
 @container container-viewport (min-width: ${containerQueryMobileLayout}px) {
-  .nav-head-top {
+  .nav-head-full-width {
     display: none !important;
   }
 }
 `
     }
-    style += navLeftHide
+    style += navLeftHidden
 
     return style
   }
@@ -315,7 +315,7 @@ function NavHead({ isNavLeft }: { isNavLeft?: true }) {
 
   return (
     <div
-      className={cls(['nav-head-full-width', !isNavLeft && 'nav-head-top', 'link-hover-animation'])}
+      className={cls(['nav-head-top', !isNavLeft && 'nav-head-full-width', 'link-hover-animation'])}
       style={{
         display: 'flex',
         justifyContent: isNavLeft ? 'flex-end' : 'center',
@@ -430,7 +430,7 @@ function NavHead({ isNavLeft }: { isNavLeft?: true }) {
   transition-property: opacity;
   pointer-events: none;
 }
-html:not(.unexpand-nav) :has(.nav-head-full-width:hover) .show-on-nav-hover,
+html:not(.unexpand-nav) :has(.nav-head-top:hover) .show-on-nav-hover,
 html:not(.unexpand-nav) :has(.show-on-nav-hover:hover) .show-on-nav-hover,
 html:not(.unexpand-nav).menu-modal-show .show-on-nav-hover {
   opacity: 1;

package/NavItemComponent.tsx

@@ -43,7 +43,7 @@ function NavItemComponent({
   const icon = navItem.titleIcon && (
     <img
       src={navItem.titleIcon}
-      style={{ height: iconSize, width: iconSize, marginRight: 8, ...navItem.titleIconStyle }}
+      style={{ height: iconSize, width: iconSize, marginRight: 8, marginLeft: 4, ...navItem.titleIconStyle }}
     />
   )
 

package/components/HorizontalLine.tsx

@@ -12,7 +12,7 @@ function HorizontalLine({ primary }: { primary?: true }) {
           margin: 0,
           border: 0,
           // Same as `.doc-page h2::after`
-          borderTop: '1px solid #eaeaea',
+          borderTop: '1px solid rgba(0, 0, 0, 0.1)',
           maxWidth: 500,
           width: '80%',
         }}

package/css/heading.css

@@ -9,7 +9,7 @@ h3 {
 }
 
 .doc-page h1 {
-  margin-top: 20px;
+  margin-top: 0px;
   margin-bottom: 20px;
 }
 
@@ -27,7 +27,7 @@ h3 {
   height: 1px;
   top: -45px;
   /* Same as <HorizontalLine> */
-  background-color: #eaeaea;
+  background-color: rgba(0, 0, 0, 0.1);
   --width: min(80%, 500px);
   width: var(--width);
   left: calc((100% - var(--width)) / 2);

package/dist/NavItemComponent.js

@@ -24,7 +24,7 @@ function NavItemComponent(_a) {
     var titleJsx = parseMarkdownMini(navItem.title);
     var titleInNavJsx = parseMarkdownMini(navItem.titleInNav);
     var iconSize = 25;
-    var icon = navItem.titleIcon && (React.createElement("img", { src: navItem.titleIcon, style: __assign({ height: iconSize, width: iconSize, marginRight: 8 }, navItem.titleIconStyle) }));
+    var icon = navItem.titleIcon && (React.createElement("img", { src: navItem.titleIcon, style: __assign({ height: iconSize, width: iconSize, marginRight: 8, marginLeft: 4 }, navItem.titleIconStyle) }));
     if (navItem.level === 1 || navItem.level === 4) {
         assert(navItem.url === undefined);
     }

package/dist/components/HorizontalLine.js

@@ -9,7 +9,7 @@ function HorizontalLine(_a) {
                 margin: 0,
                 border: 0,
                 // Same as `.doc-page h2::after`
-                borderTop: '1px solid #eaeaea',
+                borderTop: '1px solid rgba(0, 0, 0, 0.1)',
                 maxWidth: 500,
                 width: '80%',
             } })));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brillout/docpress",
-  "version": "0.10.13",
+  "version": "0.10.15",
   "type": "module",
   "dependencies": {
     "@brillout/picocolors": "^1.0.10",