domma-cms 1.10.38 → 1.11.0

package/server/services/markdown.js

@@ -19,7 +19,7 @@ import {contentsOverrideFromAttrs} from './pageContents.js';
 import {buildMenuNav} from './menuRender.js';
 import {checkVisibility} from '../middleware/auth.js';
 import {getRoleHierarchy, getRoleLevel} from './roles.js';
-import {buildTextStyle} from '../../public/js/text-style.mjs';
+import {buildTextStyle, buildTextMotion} from '../../public/js/text-style.mjs';
 import {buildScribeStyle} from '../../public/js/scribe-style.mjs';
 import {CHARACTERS, resolveCharacterSize} from '../../public/js/celebrations/character-catalog.mjs';
 import {publicButtonSettings} from '../../public/js/form-submit.mjs';
@@ -2348,7 +2348,10 @@ function processGridBlocks(markdown) {
         const revealStagger = attrs['reveal-stagger'] ? ` data-reveal-stagger="${escapeAttr(attrs['reveal-stagger'])}"` : '';
         const revealDelay = attrs['reveal-delay'] ? ` data-reveal-delay="${escapeAttr(attrs['reveal-delay'])}"` : '';
         const revealDirection = attrs['reveal-direction'] ? ` data-reveal-direction="${escapeAttr(attrs['reveal-direction'])}"` : '';
-        return `<div class="${classes.join(' ')}"${id}${reveal}${revealMode}${revealAnimation}${revealDuration}${revealStagger}${revealDelay}${revealDirection}>${inner}</div>\n`;
+        // Swoosh in again each time the row comes back up into view; cards that lean toward the pointer.
+        const revealReplay = isTruthyAttr(attrs['reveal-replay']) ? ' data-reveal-replay="true"' : '';
+        const tilt = isTruthyAttr(attrs.tilt) ? ' data-tilt="true"' : '';
+        return `<div class="${classes.join(' ')}"${id}${reveal}${revealMode}${revealAnimation}${revealDuration}${revealStagger}${revealDelay}${revealDirection}${revealReplay}${tilt}>${inner}</div>\n`;
     }
   );
 
@@ -3690,19 +3693,27 @@ function processTextBlocks(markdown) {
         const attrs = parseShortcodeAttrs(attrStr || '');
         // The attribute → CSS mapping is shared with the admin editor's live
         // preview (public/js/text-style.mjs), so the two cannot disagree.
-        const style = buildTextStyle(attrs);
+        // Gradient, shine, light-up and word-by-word (text-motion.mjs moves them).
+        const motion = buildTextMotion(attrs);
+        const style = [buildTextStyle(attrs), motion.style].filter(Boolean).join(';');
         const styleAttr = style ? ` style="${style}"` : '';
-        const classAttr = attrs.class ? ` class="${escapeAttr(attrs.class)}"` : '';
+        const classes = [...motion.classes, ...(attrs.class ? [attrs.class] : [])].join(' ');
+        const classAttr = classes ? ` class="${escapeAttr(classes)}"` : '';
         const idAttr = attrs.id ? ` id="${escapeAttr(attrs.id)}"` : '';
 
         return `<span${styleAttr}${classAttr}${idAttr}>${inner.trim()}</span>`;
     }
 
-    // Note: [\s\S]*? allows multi-line body content (deliberate divergence from badge's [^\n]*?)
-    const result = scrubbed.replace(
-        /\[text([^\]]*)\]([\s\S]*?)\[\/text\]/gi,
-        (_, attrStr, body) => buildText(attrStr, body)
-    );
+    // Note: [\s\S]*? allows multi-line body content (deliberate divergence from badge's [^\n]*?).
+    // Innermost first, round again until none is left, so a [text] can sit inside another -
+    // a gradient phrase inside a headline that rises word by word.
+    const INNERMOST = /\[text(\s[^\]]*)?\]((?:(?!\[text[\s\]])[\s\S])*?)\[\/text\]/gi;
+    let result = scrubbed;
+    for (let pass = 0; pass < 8; pass++) {
+        const next = result.replace(INNERMOST, (_, attrStr, body) => buildText(attrStr, body));
+        if (next === result) break;
+        result = next;
+    }
 
     return restore(result);
 }
@@ -3985,8 +3996,8 @@ function processSpacerBlocks(markdown) {
  * Any Behaviour setting of the menu, as attributes (see NAVBAR_OVERRIDE_ATTRS in
  * menus.js): position, orientation, side, align, variant, hover-open, hover,
  * selected, accent, class, font, font-size, font-weight, letter-spacing,
- * icon-size, width, collapsible, collapsed, autohide, hide-on-scroll and the
- * float-* panel options. `true` / `false` switch a setting on or off; an empty
+ * icon-size, width, collapsible, collapsed, autohide, hide-on-scroll, bar, dropdown,
+ * tiles, morph and the float-* panel options. `true` / `false` switch a setting on or off; an empty
  * value clears it. Leaves a hidden marker the renderer reads (the first tag on
  * a page counts) - it draws nothing itself.
  *

package/server/services/menus.js

@@ -22,6 +22,9 @@ import {
     PRESET_COLOUR_VARS, PRESET_COLOUR_FALLBACKS, colourToCss, cssClassProblems
 } from '../../public/js/menu-decor.mjs';
 import {fileIn} from './safePath.js';
+import {normaliseLook, lookProblems, itemLookProblems} from '../../public/js/menu-look.mjs';
+
+export {normaliseLook};
 
 /**
  * Bust the response-cache tags that menu changes affect. Public pages are
@@ -312,6 +315,8 @@ export const NAVBAR_OVERRIDE_ATTRS = {
     'width': ['dock', 'width', 'num'], 'collapsible': ['dock', 'collapsible', 'bool'],
     'collapsed': ['dock', 'collapsed', 'bool'], 'autohide': ['dock', 'autohide', 'bool'],
     'hide-on-scroll': ['dock', 'hideOnScroll', 'bool'],
+    'bar': ['look', 'bar'], 'dropdown': ['look', 'dropdown'], 'tiles': ['look', 'tiles'],
+    'morph': ['look', 'morph', 'bool'],
     'float-anchor': ['float', 'anchor'], 'float-x': ['float', 'offsetX', 'num'], 'float-y': ['float', 'offsetY', 'num'],
     'float-width': ['float', 'width', 'num'], 'float-radius': ['float', 'radius', 'num'],
     'float-shadow': ['float', 'shadow'], 'float-accent': ['float', 'accent'], 'float-opacity': ['float', 'opacity', 'num'],
@@ -367,6 +372,10 @@ export function applyMenuOverride(menu, override) {
         const dock = normaliseDock(next.dock);
         if (dock) next.dock = dock; else delete next.dock;
     }
+    if (next.look) {
+        const look = normaliseLook(next.look);
+        if (look) next.look = look; else delete next.look;
+    }
     return next;
 }
 
@@ -620,6 +629,7 @@ export async function createMenu(input) {
         ...(input.style    != null && {style:    input.style}),
         ...(normaliseDock(input.dock) && {dock: normaliseDock(input.dock)}),
         ...(normaliseMobile(input.mobile) && {mobile: normaliseMobile(input.mobile)}),
+        ...(normaliseLook(input.look) && {look: normaliseLook(input.look)}),
         ...(binding != null && {binding}),
         items: Array.isArray(input.items) ? input.items : [],
         meta: {
@@ -669,6 +679,7 @@ export async function updateMenu(slug, input) {
         ...(input.style    != null && {style:    input.style}),
         ...(normaliseDock(input.dock) && {dock: normaliseDock(input.dock)}),
         ...(normaliseMobile(input.mobile) && {mobile: normaliseMobile(input.mobile)}),
+        ...(normaliseLook(input.look) && {look: normaliseLook(input.look)}),
         ...(binding != null && {binding}),
         items: Array.isArray(input.items) ? input.items : [],
         meta: {
@@ -886,6 +897,8 @@ export function validateMenu(menu) {
             }
         }
     }
+    // Bar shape and dropdown style - see public/js/menu-look.mjs.
+    errors.push(...lookProblems(menu.look));
     if (menu.highlight != null) {
         if (typeof menu.highlight !== 'object' || Array.isArray(menu.highlight)) {
             errors.push('highlight must be an object');
@@ -996,6 +1009,8 @@ export function validateMenu(menu) {
             if (item.colour != null && !isValidColour(item.colour)) {
                 errors.push(`Item ${path}: colour must be a preset key or #rrggbb`);
             }
+            // Card dropdown fields (description, tile, chip, panel) - menu-look.mjs.
+            for (const p of itemLookProblems(item, isValidColour)) errors.push(`Item ${path}: ${p}`);
             for (const p of cssClassProblems(item.class)) errors.push(`Item ${path}: class: ${p}`);
             // Per-item highlight override. Same shape and same value sets as
             // the menu-level `highlight` block validated above - an item that

package/server/services/renderer.js

@@ -390,6 +390,8 @@ export async function renderPage(page, opts = {}) {
             // wires it; width and autohide also shape the body below, from the first paint.
             ...(navMenu.dock && {dock: navMenu.dock}),
             ...(navMenu.mobile && {mobile: navMenu.mobile}),
+            // Bar shape and card dropdowns - drawn by menu-cards.mjs in the browser.
+            ...(navMenu.look && {look: navMenu.look}),
             // Item highlighting: the navbar is built in the browser, so the
             // config has to travel to site.js rather than being rendered here.
             ...(navMenu.highlight && {highlight: navMenu.highlight}),
@@ -1205,6 +1207,8 @@ export async function renderBlogPage(templatePath, data = {}, seoMeta = {}) {
             // wires it; width and autohide also shape the body below, from the first paint.
             ...(navMenu.dock && {dock: navMenu.dock}),
             ...(navMenu.mobile && {mobile: navMenu.mobile}),
+            // Bar shape and card dropdowns - drawn by menu-cards.mjs in the browser.
+            ...(navMenu.look && {look: navMenu.look}),
             // Item highlighting: the navbar is built in the browser, so the
             // config has to travel to site.js rather than being rendered here.
             ...(navMenu.highlight && {highlight: navMenu.highlight}),

package/server/templates/page.html

@@ -30,6 +30,9 @@
     <!-- Menu item hover / current-page effects. Loaded after site.css so a
          menu's own highlight wins over the blanket link styling there. -->
     <link rel="stylesheet" href="/public/css/menu-highlight.css?v=20261024-menu-highlight-fix">
+    <link rel="stylesheet" href="/public/css/menu-cards.css?v=20261029-menu-cards">
+    <link rel="stylesheet" href="/public/css/footer-showcase.css?v=20261029-footer-showcase">
+    <link rel="stylesheet" href="/public/css/page-motion.css?v=20261029-page-motion">
 
   <!-- Font overrides -->
   {{fontStyleTag}}
@@ -185,7 +188,7 @@
     <script src="/public/js/form-logic-engine.js?v=20261025-dropzone-disable" defer></script>
 
     <!-- Site initialisation -->
-    <script src="/public/js/site.js?v=20261025-dconfig-click2" type="module"></script>
+    <script src="/public/js/site.js?v=20261029-page-motion" type="module"></script>
     <script src="/public/js/collection-context.js?v=20261010-utf8-payloads" type="module"></script>
     {{ctxMenusModule}}