mnfst 0.5.80 → 0.5.81

package/lib/manifest.typography.css

@@ -41,18 +41,10 @@
     .h4,
     .h5,
     .h6 {
-        font-weight: bolder;
+        font-weight: 550;
         word-wrap: break-word
     }
 
-    :where(h1, h2, h3, h4):not(.unstyle),
-    .h1,
-    .h2,
-    .h3,
-    .h4 {
-        font-weight: 700;
-    }
-
     :where(h1, h2, h3):not(.unstyle),
     .h1,
     .h2,
@@ -62,18 +54,18 @@
 
     :where(h1):not(.unstyle),
     .h1 {
-        font-size: 2.25rem;
+        font-size: 3rem;
         line-height: 1.25
     }
 
     :where(h2):not(.unstyle),
     .h2 {
-        font-size: 1.5rem
+        font-size: 2.25rem
     }
 
     :where(h3):not(.unstyle),
     .h3 {
-        font-size: 1.25rem;
+        font-size: 1.75rem;
         line-height: 1.4
     }
 
@@ -84,18 +76,21 @@
 
     :where(h5):not(.unstyle),
     .h5 {
-        font-weight: 600;
-        font-size: .875rem;
+        font-size: 1rem;
         line-height: 1rem;
-        color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09))
+        color: var(--color-content-neutral, black);
+
+        & a:hover {
+            color: var(--color-content-stark, black)
+        }
     }
 
     :where(h6):not(.unstyle),
     .h6 {
-        font-weight: 600;
+        font-family: var(--font-mono);
         font-size: 0.8125rem;
         line-height: 1.4;
-        text-transform: uppercase;
+        color: var(--color-brand-content, black)
     }
 
     /* Paragraphs */
@@ -106,18 +101,15 @@
 
     /* Links */
     :where(a:not([role=button]), button.link):not(.unstyle) {
-        text-decoration: underline;
-        text-underline-offset: 2px;
+        text-align: unset;
+        text-decoration: none;
         cursor: pointer;
-        transition: var(--transition, all .05s ease-in-out);
-
-        &:hover {
-            color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09))
-        }
+        transition: var(--transition, all .05s ease-in-out)
+    }
 
-        &:active {
-            color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09))
-        }
+    :where(abbr, address, blockquote, code, del, figcaption, h1, h2, h3, h4, h5, h6, ins, legend, p, small, cite, q, .h1, .h2, .h3, .h4, .h5, .h6, .paragraph, .small, .caption, .label):not(.unstyle)>a {
+        text-decoration: underline;
+        text-underline-offset: 2px
     }
 
     /* Blockquotes */
@@ -127,8 +119,8 @@
         max-width: 100%;
         margin: calc(var(--spacing, 0.25rem) * 4) 0;
         padding: 0 calc(var(--spacing, 0.25rem) * 4);
-        color: var(--color-content-stark, oklch(16.6% 0.026 267));
-        border-inline-start: 0.25rem solid color-mix(in oklch, var(--color-content-stark, oklch(16.6% 0.026 267)) 25%, transparent);
+        color: var(--color-content-stark, black);
+        border-inline-start: 0.25rem solid color-mix(in oklch, var(--color-content-stark, black) 25%, transparent);
         border-inline-end: none;
 
         & * {
@@ -141,12 +133,13 @@
         display: inline-block;
         width: fit-content;
         height: fit-content;
-        padding: 0.1ch 0.5ch;
+        padding: 0 0.7ch;
         font-size: 82.5%;
+        line-height: 1.4;
         word-wrap: break-word;
-        color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09));
-        background-color: color-mix(in oklch, var(--color-content-neutral, oklch(48.26% 0.0365 255.09)) 10%, transparent);
-        border: 1px solid color-mix(in oklch, var(--color-content-subtle, oklch(67.4% 0.0318 251.27)) 10%, transparent);
+        color: var(--color-content-neutral, grey);
+        background-color: color-mix(in oklch, var(--color-content-neutral, grey) 10%, transparent);
+        border: 1px solid color-mix(in oklch, var(--color-content-subtle, silver) 10%, transparent);
         border-radius: var(--radius, 0.5rem)
     }
 
@@ -154,11 +147,10 @@
     :where(figcaption):not(.unstyle),
     .caption {
         font-size: 0.8125rem;
-        color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09));
+        color: var(--color-content-neutral, grey);
 
-        & a {
-            font-weight: inherit;
-            color: inherit
+        & a:hover {
+            color: var(--color-content-stark, black)
         }
     }
 
@@ -171,7 +163,11 @@
     :where(small):not(.unstyle),
     .small {
         font-size: 0.875rem;
-        color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09))
+        color: var(--color-content-neutral, grey);
+
+        & a:hover {
+            color: var(--color-content-stark, black)
+        }
     }
 
     /* Icons */
@@ -198,8 +194,8 @@
         font-weight: 600;
         line-height: 1;
         text-align: center;
-        color: var(--color-content-neutral, oklch(48.26% 0.0365 255.09));
-        background-color: color-mix(in oklch, var(--color-content-neutral, oklch(48.26% 0.0365 255.09)) 10%, transparent);
+        color: var(--color-content-neutral, grey);
+        background-color: color-mix(in oklch, var(--color-content-neutral, grey) 10%, transparent);
         border-radius: calc(var(--radius, 0.5rem) / 1.5);
 
         &:not(:last-of-type) {
@@ -242,7 +238,7 @@
         font-weight: 500;
         font-size: 0.75rem;
         line-height: 1;
-        color: var(--color-field-inverse, oklch(16.6% 0.026 267));
+        color: var(--color-field-inverse, black);
         background-color: var(--color-field-surface, oklch(91.79% 0.0029 264.26));
         border-radius: 100px;
 

package/lib/manifest.utilities.css

@@ -221,7 +221,7 @@
 
     /* Prose styles for long-form content */
     :where(.prose, .prose details) {
-        width: 65ch;
+        width: 42rem;
         max-width: 100%;
 
         /* Asides inside a prose element are used as callouts */
@@ -292,6 +292,10 @@
             }
         }
 
+        &>h1 {
+            font-size: 2.25rem
+        }
+
         &>h1+p {
             margin-top: 0.625rem;
             font-size: 1.125rem;
@@ -299,11 +303,13 @@
         }
 
         &>h2 {
+            font-size: 1.75rem;
             margin-top: 1rem;
             margin-bottom: calc(1rem * 0.6667)
         }
 
         &>h3 {
+            font-size: 1.25rem;
             margin-top: calc(1rem * 2.4)
         }
 

package/lib/manifest.utilities.js

@@ -2399,7 +2399,6 @@ TailwindCompiler.prototype.generateUtilitiesFromVars = function (cssText, usedDa
                 let selector = `.${escapeClassName(variantClass)}`;
                 let hasMediaQuery = false;
                 let mediaQueryRule = '';
-                let nestedSelector = null; // For variants that end with & (CSS nesting)
 
                 for (const variant of parsed.variants) {
                     if (variant.isArbitrary) {
@@ -2417,18 +2416,10 @@ TailwindCompiler.prototype.generateUtilitiesFromVars = function (cssText, usedDa
                             selector = { baseClass: selector, arbitrarySelector };
                         }
                     } else if (variant.selector.includes('&')) {
-                        // Check if selector ends with & (indicates CSS nesting)
-                        if (variant.selector.trim().endsWith('&')) {
-                            // This is a nested selector - move & to the beginning for CSS nesting
-                            const selectorWithoutAmpersand = variant.selector.trim().slice(0, -1).trim();
-                            const nestedSelectorText = `&${selectorWithoutAmpersand}`;
-                            nestedSelector = nestedSelector ? `${nestedSelector} ${nestedSelectorText}` : nestedSelectorText;
-                        } else {
-                            // Handle variants like .dark &, .light &, .group &, etc.
-                            // Replace & with the actual selector
-                            const replacedSelector = variant.selector.replace(/&/g, selector);
-                            selector = replacedSelector;
-                        }
+                        // Substitute & with the current selector. This produces flat CSS that
+                        // works for both ancestor patterns (`.dark &` → `.dark .X`) and
+                        // self-extending patterns (`& > p` → `.X > p`).
+                        selector = variant.selector.replace(/&/g, selector);
                     } else if (variant.selector.startsWith(':')) {
                         // For pseudo-classes, append to selector
                         selector = `${selector}${variant.selector}`;
@@ -2444,9 +2435,6 @@ TailwindCompiler.prototype.generateUtilitiesFromVars = function (cssText, usedDa
                 if (typeof selector === 'object' && selector.arbitrarySelector) {
                     // Handle arbitrary selectors with nested CSS (for non-& selectors)
                     rule = `${selector.baseClass} {\n    ${selector.arbitrarySelector} {\n        ${cssContent}\n    }\n}`;
-                } else if (nestedSelector) {
-                    // Handle nested selectors (variants ending with &)
-                    rule = `${selector} {\n    ${nestedSelector} {\n        ${cssContent}\n    }\n}`;
                 } else {
                     // Regular selector
                     rule = `${selector} { ${cssContent} }`;
@@ -2719,7 +2707,7 @@ TailwindCompiler.prototype.generateCustomUtilities = function (usedData) {
                 let selector = `.${escapeClassName(variantClass)}`;
                 let hasMediaQuery = false;
                 let mediaQueryRule = '';
-                let nestedSelector = null; // For variants that end with & (CSS nesting)
+                let nestedSelector = null;
 
                 for (const variant of parsed.variants) {
                     if (variant.isArbitrary) {
@@ -2737,18 +2725,10 @@ TailwindCompiler.prototype.generateCustomUtilities = function (usedData) {
                             selector = { baseClass: selector, arbitrarySelector };
                         }
                     } else if (variant.selector.includes('&')) {
-                        // Check if selector ends with & (indicates CSS nesting)
-                        if (variant.selector.trim().endsWith('&')) {
-                            // This is a nested selector - move & to the beginning for CSS nesting
-                            const selectorWithoutAmpersand = variant.selector.trim().slice(0, -1).trim();
-                            const nestedSelectorText = `&${selectorWithoutAmpersand}`;
-                            nestedSelector = nestedSelector ? `${nestedSelector} ${nestedSelectorText}` : nestedSelectorText;
-                        } else {
-                            // Handle variants like .dark &, .light &, .group &, etc.
-                            // Replace & with the actual selector
-                            const replacedSelector = variant.selector.replace(/&/g, selector);
-                            selector = replacedSelector;
-                        }
+                        // Substitute & with the current selector. This produces flat CSS that
+                        // works for both ancestor patterns (`.dark &` → `.dark .X`) and
+                        // self-extending patterns (`& > p` → `.X > p`).
+                        selector = variant.selector.replace(/&/g, selector);
                     } else if (variant.selector.startsWith(':')) {
                         // For pseudo-classes, append to selector
                         selector = `${selector}${variant.selector}`;

package/package.json

@@ -1,13 +1,12 @@
 {
     "name": "mnfst",
-    "version": "0.5.80",
+    "version": "0.5.81",
     "private": false,
     "workspaces": [
         "templates/starter",
         "packages/render",
         "packages/types",
-        "packages/test",
-        "packages/export"
+        "packages/test"
     ],
     "main": "lib/manifest.js",
     "style": "lib/manifest.css",
@@ -24,18 +23,16 @@
         "start:docs": "node packages/run/serve.mjs docs",
         "start:starter": "node packages/run/serve.mjs templates/starter --port 3001",
         "start:dist": "node packages/run/serve.mjs src/test-prerender --port 5003",
-        "prerender": "node src/scripts/manifest.render.mjs --root src",
+        "render": "node src/scripts/manifest.render.mjs --root src",
         "prerender:docs": "node src/scripts/manifest.render.mjs --root docs",
         "prerender:starter": "node src/scripts/manifest.render.mjs --root templates/starter",
-        "render": "node src/scripts/manifest.render.mjs --root src",
         "release": "npm version patch --no-git-tag-version && npm publish",
         "release:run": "cd packages/run && npm version patch --no-git-tag-version && npm publish --auth-type=web",
         "release:render": "cd packages/render && npm version patch --no-git-tag-version && npm publish --auth-type=web",
         "release:types": "cd packages/types && npm version patch --no-git-tag-version && npm publish --auth-type=web",
         "release:test": "cd packages/test && npm version patch --no-git-tag-version && npm publish --auth-type=web",
-        "release:export": "cd packages/export && npm version patch --no-git-tag-version && npm publish --auth-type=web",
         "release:starter": "cd packages/create-starter && npm version patch --no-git-tag-version && npm publish --auth-type=web",
-        "release:all": "npm run release:run && npm run release:render && npm run release:types && npm run release:test && npm run release:export && npm run release:starter && npm run release",
+        "release:all": "npm run release:run && npm run release:render && npm run release:types && npm run release:test && npm run release:starter && npm run release",
         "prepublishOnly": "npm run build",
         "test": "vitest run",
         "lint": "echo 'No linting configured'"