mordoc 1.0.2 → 1.0.3

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "https://github.com/shiva-varanasi/mordoc.git"
   },
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A modern documentation site generator powered by Vite, React, and Markdoc.",
   "type": "module",
   "files": [

package/src/app/content/Content.module.css

@@ -234,32 +234,61 @@
 
 .prose :global(ul),
 .prose :global(ol) {
-  margin: 0 0 16px 16px;
-  padding: 0;
+  margin: 1rem 0;
+  padding-left: 1.5rem;
   font-size: 16px;
   line-height: 1.7;
   color: var(--color-content-fg);
 }
 
 .prose :global(ul) {
-  list-style: disc inside;
+  list-style: disc;
+  list-style-position: outside;
 }
 
 .prose :global(ol) {
-  list-style: decimal inside;
+  list-style: decimal;
+  list-style-position: outside;
+}
+
+.prose :global(ul ul) {
+  list-style-type: circle;
+}
+
+.prose :global(ul ul ul) {
+  list-style-type: square;
+}
+
+.prose :global(ol ol) {
+  list-style-type: lower-alpha;
+}
+
+.prose :global(ol ol ol) {
+  list-style-type: lower-roman;
 }
 
 .prose :global(li) {
+  margin-bottom: 0.5rem;
+  line-height: 1.7;
+}
+
+.prose :global(li:last-child) {
   margin-bottom: 0;
 }
 
-.prose :global(li + li) {
-  margin-top: 8px;
+/* Markdoc loose lists wrap item text in <p> — override global .prose p margins */
+.prose :global(li > p) {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+}
+
+.prose :global(li > p:last-child) {
+  margin-bottom: 0;
 }
 
 .prose :global(li > ul),
 .prose :global(li > ol) {
-  margin-top: 8px;
+  margin-top: 0.5rem;
   margin-bottom: 0;
 }
 
@@ -316,7 +345,7 @@
   border-radius: var(--radius-sm);
   font-family: var(--font-mono);
   font-size: 0.875em;
-  font-weight: 500;
+  font-weight: 400;
 }
 
 /* Reset inline-code styles for code inside a pre — the CodeBlock component owns that styling */
@@ -334,14 +363,14 @@
   width: 100%;
   margin: 1.25rem 0;
   border-collapse: collapse;
-  font-size: 0.9rem;
+  font-size: 1rem;
 }
 
 .prose :global(th) {
   padding: 0.625rem 0.875rem;
   text-align: left;
   font-weight: 600;
-  font-size: 0.8125rem;
+  font-size: 1rem;
   color: var(--color-fg);
   border-bottom: 1px solid var(--color-border);
 }

package/src/app/sidenav/Sidenav.module.css

@@ -169,10 +169,10 @@
   align-items: center;
   width: 100%;
   min-height: var(--sidenav-item-h);
-  padding: var(--sidenav-item-pad-y) 8px var(--sidenav-item-pad-y) 24px;
+  padding: var(--sidenav-item-pad-y) 8px var(--sidenav-item-pad-y) 8px;
   border-radius: var(--radius-md);
   font-size: 14px;
-  font-weight: 400;
+  font-weight: 500;
   line-height: 1.4;
   color: var(--sidenav-fg);
   text-decoration: none;
@@ -186,7 +186,7 @@
 .navLink.navLinkActive {
   background: var(--accent-subtle);
   color: var(--accent-emphasis);
-  font-weight: 500;
+  font-weight: 600;
 }
 
 /* ============================================================
@@ -195,6 +195,7 @@
 
 .groupContent {
   padding-top: 4px;
+  padding-left: 16px;
 }
 
 /* ============================================================

package/src/app/sidenav/Sidenav.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import { NavLink, useLocation, useNavigate } from 'react-router';
 import { useMordocData } from '../data-context.js';
 import { detectCurrentLang, buildLangPrefix, stripLangPrefix, resolveLabel } from '../lang-utils.js';
@@ -51,6 +51,10 @@ function SidenavNode({ item, depth }: { item: SidenavItem; depth: number }) {
   const isLabelActive = item.path ? location.pathname === item.path : false;
   const [open, setOpen] = useState(isGroupActive || isLabelActive);
 
+  useEffect(() => {
+    if (isGroupActive || isLabelActive) setOpen(true);
+  }, [isGroupActive, isLabelActive]);
+
   // Leaf item — path only, no children
   if (item.path && !item.children) {
     const isTop = depth === 0;