@rettangoli/sites 1.0.0-rc5 → 1.0.1

package/README.md

@@ -71,7 +71,8 @@ build:
   keepMarkdownFiles: false
 imports:
   templates:
-    docs/documentation: https://example.com/templates/docs-documentation.yaml
+    base: https://example.com/templates/base.yaml
+    docs: https://example.com/templates/docs.yaml
   partials:
     docs/nav: https://example.com/partials/docs-nav.yaml
 ```
@@ -93,7 +94,7 @@ Example mappings:
 - `pages/docs/intro.md` -> `_site/docs/intro/index.html` and `_site/docs/intro.md`
 
 `imports` lets you map aliases to remote YAML files (HTTP/HTTPS only). Use aliases in pages/templates:
-- page frontmatter: `template: docs/documentation`
+- page frontmatter: `template: base` or `template: docs`
 - template/page content: `$partial: docs/nav`
 
 Imported files are cached on disk under `.rettangoli/sites/imports/{templates|partials}/` (hashed filenames).
@@ -104,16 +105,43 @@ When an alias exists both remotely and locally, local files under `templates/` a
 
 If you want to publish a manual `llms.txt`, place it in `static/llms.txt`; it will be copied to `_site/llms.txt`.
 
-## Pre-published Import Assets
+## System Frontmatter
 
-`@rettangoli/sites` publishes reusable template/partial YAML assets under `sites/` for URL imports.
+Use `_bind` to map global data keys into page-local variables.
 
-- Docs template: `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/docs/documentation.yaml`
-- Docs partial: `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/partials/docs/mobile-nav.yaml`
-- Rettangoli.dev shells: `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/*.yaml`
-- Default scaffold base: `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/default/base.yaml`
+Example:
+
+```yaml
+---
+template: base
+_bind:
+  docs: feDocs
+---
+```
+
+This resolves `docs` from `data/feDocs.yaml` for that page.
+`_bind` is a system property and is not exposed to templates directly.
+
+Rules:
+
+- `_bind` must be an object
+- each `_bind` value must be a non-empty string
+- each `_bind` value must point to an existing `data/*.yaml` key
+- `_bind` is removed from public frontmatter before rendering/collections
+
+Binding order:
 
-See `sites/README.md` for full alias examples and required data contract.
+1. build page context from `deepMerge(globalData, frontmatterWithoutSystemKeys)`
+2. apply `_bind` aliases on top (alias wins for that key)
+
+## Reusable Asset Package
+
+`@rettangoli/sites` is the engine only.
+
+Reusable themes, templates, partials, helper assets, schemas, and VT coverage now live in `packages/rettangoli-sitekit/` and publish from `@rettangoli/sitekit`.
+
+Use `@rettangoli/sitekit` when you want curated importable site assets.
+Keep `@rettangoli/sites` for build/watch/init behavior.
 
 ## Template Authoring Pattern
 
@@ -159,12 +187,14 @@ Available in YAML templates/pages without extra setup:
 - `formatDate(value, format = "YYYYMMDDHHmmss", useUtc = true)`
 - `now(format = "YYYYMMDDHHmmss", useUtc = true)`
 - `sort(list, key, order = "asc")`
+- `chunk(list, size = 1, pad = false, fillValue = null)`
 - `md(content)`
 - `toQueryString(object)`
 
-`formatDate` tokens: `YYYY`, `MM`, `DD`, `HH`, `mm`, `ss`.
+`formatDate` tokens: `YYYY`, `MMM`, `MM`, `DD`, `D`, `HH`, `mm`, `ss`.
 `decodeURI`/`decodeURIComponent` return the original input when decoding fails.
 `sort` supports `order` as `asc` or `desc` (default: `asc`), accepts dot-path keys (for example `data.date`), and returns a new array.
+`chunk` splits arrays into rows of `size`; with `pad = true`, the last row is padded with `fillValue`.
 `md` returns raw rendered HTML from Markdown for template insertion.
 
 ## Screenshots
@@ -177,6 +207,16 @@ Use VT against your generated site:
 2. Add `vt` config in `rettangoli.config.yaml`.
 3. Run `rtgl vt generate`, `rtgl vt report`, and `rtgl vt accept`.
 
+Docker runtime (recommended for stable Playwright/browser versions):
+
+```bash
+IMAGE="han4wluc/rtgl:playwright-v1.57.0-rtgl-v1.0.5"
+docker pull "$IMAGE"
+docker run --rm -v "$PWD:/workspace" -w /workspace "$IMAGE" rtgl vt screenshot
+docker run --rm -v "$PWD:/workspace" -w /workspace "$IMAGE" rtgl vt report
+docker run --rm -v "$PWD:/workspace" -w /workspace "$IMAGE" rtgl vt accept
+```
+
 Example:
 
 ```yaml
@@ -200,6 +240,8 @@ url: /
 
 `bun run preview` (or any equivalent local server command) must serve your built site on `vt.url` (for example serving `_site/` on port `4173`).
 
+For a maintained example asset pack and VT lab, see `packages/rettangoli-sitekit/`.
+
 ## Full Architecture And Analysis
 
 See `docs/architecture-and-analysis.md` for:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rettangoli/sites",
-  "version": "1.0.0-rc5",
+  "version": "1.0.1",
   "description": "Generate static sites using Markdown and YAML for docs, blogs, and marketing sites.",
   "author": {
     "name": "Luciano Hanyon Wu",
@@ -14,8 +14,7 @@
   "files": [
     "src",
     "components",
-    "templates",
-    "sites"
+    "templates"
   ],
   "dependencies": {
     "gray-matter": "^4.0.3",
@@ -49,6 +48,11 @@
     "admin",
     "dashboard"
   ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/yuusoft-org/rettangoli",
+    "directory": "packages/rettangoli-sites"
+  },
   "bugs": {
     "url": "https://github.com/yuusoft-org/rettangoli/issues"
   },

package/src/builtinTemplateFunctions.js

@@ -25,16 +25,20 @@ function formatDateImpl(value, format = 'YYYYMMDDHHmmss', useUtc = true) {
   }
 
   const read = (localGetter, utcGetter) => (useUtc ? utcGetter.call(date) : localGetter.call(date));
+  const monthIndex = read(date.getMonth, date.getUTCMonth);
+  const day = read(date.getDate, date.getUTCDate);
   const tokens = {
     YYYY: String(read(date.getFullYear, date.getUTCFullYear)),
-    MM: pad2(read(date.getMonth, date.getUTCMonth) + 1),
-    DD: pad2(read(date.getDate, date.getUTCDate)),
+    MMM: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][monthIndex],
+    MM: pad2(monthIndex + 1),
+    DD: pad2(day),
+    D: String(day),
     HH: pad2(read(date.getHours, date.getUTCHours)),
     mm: pad2(read(date.getMinutes, date.getUTCMinutes)),
     ss: pad2(read(date.getSeconds, date.getUTCSeconds)),
   };
 
-  return String(format).replace(/YYYY|MM|DD|HH|mm|ss/g, (token) => tokens[token]);
+  return String(format).replace(/YYYY|MMM|MM|DD|D|HH|mm|ss/g, (token) => tokens[token]);
 }
 
 function jsonStringify(value, space = 0) {
@@ -141,6 +145,32 @@ function sortImpl(value, key, order = 'asc') {
   });
 }
 
+function chunkImpl(value, size = 1, pad = false, fillValue = null) {
+  if (!Array.isArray(value)) {
+    return [];
+  }
+
+  const parsedSize = Number(size);
+  if (!Number.isFinite(parsedSize) || parsedSize <= 0) {
+    return [];
+  }
+
+  const chunkSize = Math.max(1, Math.trunc(parsedSize));
+  const rows = [];
+  for (let index = 0; index < value.length; index += chunkSize) {
+    rows.push(value.slice(index, index + chunkSize));
+  }
+
+  if (pad && rows.length > 0) {
+    const lastRow = rows[rows.length - 1];
+    while (lastRow.length < chunkSize) {
+      lastRow.push(fillValue);
+    }
+  }
+
+  return rows;
+}
+
 function mdImpl(content) {
   return {
     __html: markdownRenderer.render(String(content ?? '')),
@@ -156,6 +186,7 @@ export const builtinTemplateFunctions = {
   formatDate: formatDateImpl,
   now: (format = 'YYYYMMDDHHmmss', useUtc = true) => formatDateImpl(new Date(), format, useUtc),
   sort: sortImpl,
+  chunk: chunkImpl,
   md: mdImpl,
   toQueryString,
 };

package/src/cli/watch.js

@@ -7,6 +7,14 @@ import { loadSiteConfig } from '../utils/loadSiteConfig.js';
 
 const RELOAD_MODES = new Set(['body', 'full']);
 
+function normalizePort(port) {
+  const normalizedPort = Number(port);
+  if (!Number.isInteger(normalizedPort) || normalizedPort < 1 || normalizedPort > 65535) {
+    throw new Error(`Invalid port "${port}". Allowed values: integers from 1 to 65535.`);
+  }
+  return normalizedPort;
+}
+
 export function createClientScript(reloadMode = 'body') {
   const shouldUseBodyReplacement = reloadMode === 'body';
   const reloadSnippet = shouldUseBodyReplacement
@@ -332,6 +340,7 @@ const watchSite = async (options = {}) => {
     quiet = false,
     reloadMode = 'body'
   } = options;
+  const normalizedPort = normalizePort(port);
   const normalizedReloadMode = String(reloadMode).toLowerCase();
   if (!RELOAD_MODES.has(normalizedReloadMode)) {
     throw new Error(`Invalid reload mode "${reloadMode}". Allowed values: body, full.`);
@@ -347,7 +356,7 @@ const watchSite = async (options = {}) => {
   logger.log('Initial build complete');
 
   // Start custom dev server
-  const server = new DevServer(port, path.resolve(rootDir, outputPath), logger, normalizedReloadMode);
+  const server = new DevServer(normalizedPort, path.resolve(rootDir, outputPath), logger, normalizedReloadMode);
   server.start();
 
   // Watch all relevant directories

package/src/createSiteBuilder.js

@@ -40,6 +40,41 @@ function isObject(item) {
   return item && typeof item === 'object' && !Array.isArray(item);
 }
 
+function splitSystemFrontmatter(frontmatter, globalData, pagePath) {
+  const normalized = isObject(frontmatter) ? { ...frontmatter } : {};
+  const bindConfig = normalized._bind;
+  delete normalized._bind;
+
+  if (bindConfig === undefined) {
+    return { frontmatter: normalized, bindings: {} };
+  }
+
+  if (!isObject(bindConfig)) {
+    throw new Error(`Invalid _bind in ${pagePath}: expected an object mapping local names to global data keys.`);
+  }
+
+  const bindings = {};
+  for (const [rawLocalKey, rawSourceKey] of Object.entries(bindConfig)) {
+    const localKey = String(rawLocalKey).trim();
+    if (localKey === '') {
+      throw new Error(`Invalid _bind in ${pagePath}: local key names must be non-empty.`);
+    }
+
+    if (typeof rawSourceKey !== 'string' || rawSourceKey.trim() === '') {
+      throw new Error(`Invalid _bind in ${pagePath} for "${localKey}": expected a non-empty global data key string.`);
+    }
+
+    const sourceKey = rawSourceKey.trim();
+    if (!Object.prototype.hasOwnProperty.call(globalData, sourceKey)) {
+      throw new Error(`Invalid _bind in ${pagePath} for "${localKey}": global data key "${sourceKey}" not found.`);
+    }
+
+    bindings[localKey] = globalData[sourceKey];
+  }
+
+  return { frontmatter: normalized, bindings };
+}
+
 function parseYamlWithContext(content, contextLabel) {
   try {
     return yaml.load(content, { schema: yaml.JSON_SCHEMA });
@@ -157,6 +192,39 @@ function readImportedYamlFromCache(fs, cachePath, aliasLabel) {
   return parseYamlWithContext(content, `${aliasLabel} (cache: ${cachePath})`);
 }
 
+function resolveDirentKind(fs, itemPath, item) {
+  if (item.isDirectory()) {
+    return 'directory';
+  }
+
+  if (item.isFile()) {
+    return 'file';
+  }
+
+  if (typeof item.isSymbolicLink === 'function' && item.isSymbolicLink()) {
+    let stats;
+    try {
+      stats = fs.statSync(itemPath);
+    } catch (error) {
+      throw new Error(`Broken symbolic link at "${itemPath}": ${error.message}`);
+    }
+
+    if (stats.isDirectory()) {
+      return 'directory';
+    }
+
+    if (stats.isFile()) {
+      return 'file';
+    }
+  }
+
+  return null;
+}
+
+function isSchemaSidecarFile(fileName) {
+  return fileName.endsWith('.schema.yaml') || fileName.endsWith('.schema.yml');
+}
+
 async function fetchRemoteYaml(url, fetchImpl, aliasLabel) {
   const effectiveFetch = fetchImpl || globalThis.fetch;
   if (typeof effectiveFetch !== 'function') {
@@ -315,13 +383,18 @@ export function createSiteBuilder({
       const items = fs.readdirSync(dir, { withFileTypes: true });
       items.forEach(item => {
         const itemPath = path.join(dir, item.name);
-        if (item.isDirectory()) {
+        const itemKind = resolveDirentKind(fs, itemPath, item);
+        if (itemKind === 'directory') {
           const newBasePath = basePath ? `${basePath}/${item.name}` : item.name;
           readPartialsRecursively(itemPath, newBasePath);
           return;
         }
 
-        if (!item.isFile() || (!item.name.endsWith('.yaml') && !item.name.endsWith('.yml'))) {
+        if (
+          itemKind !== 'file' ||
+          (!item.name.endsWith('.yaml') && !item.name.endsWith('.yml')) ||
+          isSchemaSidecarFile(item.name)
+        ) {
           return;
         }
 
@@ -364,12 +437,17 @@ export function createSiteBuilder({
 
       items.forEach(item => {
         const itemPath = path.join(dir, item.name);
+        const itemKind = resolveDirentKind(fs, itemPath, item);
 
-        if (item.isDirectory()) {
+        if (itemKind === 'directory') {
           // Recursively read subdirectories
           const newBasePath = basePath ? `${basePath}/${item.name}` : item.name;
           readTemplatesRecursively(itemPath, newBasePath);
-        } else if (item.isFile() && (item.name.endsWith('.yaml') || item.name.endsWith('.yml'))) {
+        } else if (
+          itemKind === 'file' &&
+          (item.name.endsWith('.yaml') || item.name.endsWith('.yml')) &&
+          !isSchemaSidecarFile(item.name)
+        ) {
           // Read and convert YAML file
           const fileContent = fs.readFileSync(itemPath, 'utf8');
           const nameWithoutExt = path.basename(item.name, path.extname(item.name));
@@ -411,13 +489,15 @@ export function createSiteBuilder({
         for (const item of items) {
           const itemPath = path.join(fullDir, item.name);
           const relativePath = basePath ? path.join(basePath, item.name) : item.name;
+          const itemKind = resolveDirentKind(fs, itemPath, item);
 
-          if (item.isDirectory()) {
+          if (itemKind === 'directory') {
             // Recursively scan subdirectories
             scanPages(dir, relativePath);
-          } else if (item.isFile() && (item.name.endsWith('.yaml') || item.name.endsWith('.yml') || item.name.endsWith('.md'))) {
+          } else if (itemKind === 'file' && (item.name.endsWith('.yaml') || item.name.endsWith('.yml') || item.name.endsWith('.md'))) {
             // Extract frontmatter and content
             const { frontmatter, content } = extractFrontmatterAndContent(itemPath);
+            const { frontmatter: publicFrontmatter } = splitSystemFrontmatter(frontmatter, globalData, itemPath);
 
             // Calculate URL
             const baseFileName = item.name.replace(/\.(yaml|yml|md)$/, '');
@@ -435,9 +515,9 @@ export function createSiteBuilder({
             }
 
             // Process tags
-            if (frontmatter.tags) {
+            if (publicFrontmatter.tags) {
               // Normalize tags to array
-              const tags = Array.isArray(frontmatter.tags) ? frontmatter.tags : [frontmatter.tags];
+              const tags = Array.isArray(publicFrontmatter.tags) ? publicFrontmatter.tags : [publicFrontmatter.tags];
 
               // Add to collections
               tags.forEach(tag => {
@@ -447,7 +527,7 @@ export function createSiteBuilder({
                     collections[trimmedTag] = [];
                   }
                   collections[trimmedTag].push({
-                    data: frontmatter,
+                    data: publicFrontmatter,
                     url: url,
                     content: content
                   });
@@ -471,6 +551,7 @@ export function createSiteBuilder({
       if (!quiet) console.log(`Processing ${pagePath}...`);
 
       const { frontmatter, content: rawContent } = extractFrontmatterAndContent(pagePath);
+      const { frontmatter: publicFrontmatter, bindings: boundData } = splitSystemFrontmatter(frontmatter, globalData, pagePath);
 
       // Calculate URL for current page
       let url;
@@ -489,7 +570,8 @@ export function createSiteBuilder({
       }
 
       // Deep merge global data with frontmatter and collections for the page context
-      const pageData = deepMerge(globalData, frontmatter);
+      const pageData = deepMerge(globalData, publicFrontmatter);
+      Object.assign(pageData, boundData);
       pageData.collections = collections;
       pageData.page = { url };
       pageData.build = { isScreenshotMode };
@@ -521,11 +603,11 @@ export function createSiteBuilder({
 
       // Find the template specified in frontmatter
       let templateToUse = null;
-      if (frontmatter.template) {
+      if (publicFrontmatter.template) {
         // Look up template by exact path
-        templateToUse = templates[frontmatter.template];
+        templateToUse = templates[publicFrontmatter.template];
         if (!templateToUse) {
-          throw new Error(`Template "${frontmatter.template}" not found in ${pagePath}. Available templates: ${Object.keys(templates).join(', ')}`);
+          throw new Error(`Template "${publicFrontmatter.template}" not found in ${pagePath}. Available templates: ${Object.keys(templates).join(', ')}`);
         }
       }
 
@@ -617,11 +699,12 @@ export function createSiteBuilder({
       for (const item of items) {
         const itemPath = path.join(fullDir, item.name);
         const relativePath = basePath ? path.join(basePath, item.name) : item.name;
+        const itemKind = resolveDirentKind(fs, itemPath, item);
 
-        if (item.isDirectory()) {
+        if (itemKind === 'directory') {
           // Recursively process subdirectories
           await processAllPages(dir, relativePath);
-        } else if (item.isFile()) {
+        } else if (itemKind === 'file') {
           if (item.name.endsWith('.yaml') || item.name.endsWith('.yml')) {
             // Process YAML file
             const outputFileName = item.name.replace(/\.(yaml|yml)$/, '.html');

package/templates/default/README.md

@@ -228,12 +228,14 @@ Use these directly in `${...}` expressions:
 - `formatDate(value, format = "YYYYMMDDHHmmss", useUtc = true)`
 - `now(format = "YYYYMMDDHHmmss", useUtc = true)`
 - `sort(list, key, order = "asc")`
+- `chunk(list, size = 1, pad = false, fillValue = null)`
 - `md(content)`
 - `toQueryString(object)`
 
-Date format tokens: `YYYY`, `MM`, `DD`, `HH`, `mm`, `ss`.
+Date format tokens: `YYYY`, `MMM`, `MM`, `DD`, `D`, `HH`, `mm`, `ss`.
 `decodeURI`/`decodeURIComponent` return the original input when decoding fails.
 `sort` supports `order` as `asc` or `desc` (default: `asc`), accepts dot-path keys (for example `data.date`), and returns a new array.
+`chunk` splits arrays into rows of `size`; with `pad = true`, the last row is padded with `fillValue`.
 `md` returns raw rendered HTML from Markdown for template insertion.
 
 ## Static Files
@@ -242,3 +244,22 @@ Everything in `static/` is copied to `_site/`:
 
 - `static/css/theme.css` → `_site/css/theme.css`
 - `static/images/logo.png` → `_site/images/logo.png`
+
+## Theme Classes
+
+`static/css/theme.css` now includes multiple themes in one file.
+Set exactly one class on `body` (or `html`) to choose the active palette.
+
+Examples:
+- `slate-dark` (default in starter templates)
+- `slate-light`
+- `mono-dark`
+- `mono-light`
+- `catppuccin-mocha`
+- `catppuccin-macchiato`
+- `catppuccin-frappe`
+- `catppuccin-latte`
+- `github-dark`
+- `github-light`
+- `nord-dark`
+- `nord-light`

package/templates/default/static/css/theme.css

@@ -23,7 +23,7 @@ body {
   height: 100%;
   width: 100%;
   margin: 0;
-  font-family: system-ui, -apple-system, "Helvetica Neue", sans-serif;
+  font-family: var(--font-family-sans);
   display: flex;
   flex-direction: column;
   background-color: var(--background);
@@ -34,14 +34,16 @@ body {
 }
 
 a {
-  color: inherit;
-  text-decoration: underline;
+  color: var(--anchor-color);
+  text-decoration: var(--anchor-text-decoration);
   text-decoration-thickness: 1px;
   text-underline-offset: 4px;
   text-decoration-color: var(--muted-foreground);
 }
 
 a:hover {
+  color: var(--anchor-color-hover);
+  text-decoration: var(--anchor-text-decoration-hover);
   text-decoration-color: var(--foreground);
 }
 
@@ -51,6 +53,7 @@ a:hover {
 
 :root {
   --width-stretch: 100%;
+  --font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
 
   --spacing-xs: 2px;
   --spacing-sm: 4px;
@@ -64,6 +67,7 @@ a:hover {
   --border-radius-lg: 8px;
   --border-radius-xl: 16px;
   --border-radius-f: 50%;
+  --border-radius-full: 9999px;
 
   --border-width-xs: 1px;
   --border-width-sm: 2px;
@@ -71,9 +75,9 @@ a:hover {
   --border-width-lg: 8px;
   --border-width-xl: 16px;
 
-  --shadow-sm: 0px 2px 6px rgba(0, 0, 0, .45);
-  --shadow-md: 0px 5px 12px rgba(0, 0, 0, .45);
-  --shadow-lg: 0px 10px 24px rgba(0, 0, 0, .45);
+  --shadow-sm: 0px 2px 6px rgba(0, 0, 0, .45), 0px 3px 5px rgba(0, 0, 0, .35), inset 0px .5px 0px rgba(255, 255, 255, .08), inset 0px 0px .5px rgba(255, 255, 255, .35);
+  --shadow-md: 0px 5px 12px rgba(0, 0, 0, .45), 0px 3px 5px rgba(0, 0, 0, .35), inset 0px .5px 0px rgba(255, 255, 255, .08), inset 0px 0px .5px rgba(255, 255, 255, .35);
+  --shadow-lg: 0px 10px 24px rgba(0, 0, 0, .45), 0px 3px 5px rgba(0, 0, 0, .35), inset 0px .5px 0px rgba(255, 255, 255, .08), inset 0px 0px .5px rgba(255, 255, 255, .35);
 
   --h1-font-size: 3rem;
   --h1-font-weight: 600;
@@ -115,10 +119,74 @@ a:hover {
   --xs-line-height: 1;
   --xs-letter-spacing: normal;
 
+  --anchor-color: inherit;
+  --anchor-color-hover: inherit;
+  --anchor-text-decoration: underline;
+  --anchor-text-decoration-hover: underline;
+
+  /* Sensible fallback in case no theme class is set. */
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.305 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.985 0 0);
+  --background: rgb(29 29 29);
+  --foreground: rgb(242 242 242);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.371 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+}
+
+/* rtgl mono */
+.mono-light {
+  --primary: #171717;
+  --primary-foreground: #fafafa;
+  --secondary: #f5f5f5;
+  --secondary-foreground: #171717;
+  --destructive: #e40014;
+  --destructive-foreground: #fcf3f3;
+  --background: #ffffff;
+  --foreground: #0a0a0a;
+  --muted: #f5f5f5;
+  --muted-foreground: #737373;
+  --accent: #f5f5f5;
+  --accent-foreground: #171717;
+  --border: #e5e5e5;
+  --input: #e5e5e5;
+  --ring: #a1a1a1;
+}
+
+.mono-dark {
+  --background: #0a0a0a;
+  --foreground: #fafafa;
+  --primary: #e5e5e5;
+  --primary-foreground: #171717;
+  --secondary: #262626;
+  --secondary-foreground: #fafafa;
+  --muted: #262626;
+  --muted-foreground: #a1a1a1;
+  --accent: #404040;
+  --accent-foreground: #fafafa;
+  --destructive: #ff6568;
+  --destructive-foreground: #df2225;
+  --border: #ffffff1a;
+  --input: #ffffff26;
+  --ring: #737373;
+}
+
+/* rtgl slate */
+.slate-light {
   --primary: oklch(0.205 0 0);
   --primary-foreground: oklch(0.985 0 0);
   --secondary: oklch(0.97 0 0);
   --secondary-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(0.145 0 0);
   --background: oklch(1 0 0);
   --foreground: oklch(0.145 0 0);
   --muted: oklch(0.97 0 0);
@@ -130,9 +198,9 @@ a:hover {
   --ring: oklch(0.708 0 0);
 }
 
-.dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
+.slate-dark {
+  --background: rgb(29 29 29);
+  --foreground: rgb(242 242 242);
   --primary: oklch(0.922 0 0);
   --primary-foreground: oklch(0.305 0 0);
   --secondary: oklch(0.269 0 0);
@@ -141,11 +209,160 @@ a:hover {
   --muted-foreground: oklch(0.708 0 0);
   --accent: oklch(0.371 0 0);
   --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.985 0 0);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
   --ring: oklch(0.556 0 0);
 }
 
+/* catppuccin */
+.catppuccin-latte {
+  --primary: #1e66f5;
+  --primary-foreground: #eff1f5;
+  --secondary: #ccd0da;
+  --secondary-foreground: #4c4f69;
+  --destructive: #d20f39;
+  --destructive-foreground: #eff1f5;
+  --background: #eff1f5;
+  --foreground: #4c4f69;
+  --muted: #e6e9ef;
+  --muted-foreground: #6c6f85;
+  --accent: #dce0e8;
+  --accent-foreground: #4c4f69;
+  --border: #bcc0cc;
+  --input: #ccd0da;
+  --ring: #7287fd;
+}
+
+.catppuccin-frappe {
+  --primary: #8caaee;
+  --primary-foreground: #303446;
+  --secondary: #414559;
+  --secondary-foreground: #c6d0f5;
+  --destructive: #e78284;
+  --destructive-foreground: #303446;
+  --background: #303446;
+  --foreground: #c6d0f5;
+  --muted: #414559;
+  --muted-foreground: #a5adce;
+  --accent: #51576d;
+  --accent-foreground: #c6d0f5;
+  --border: #626880;
+  --input: #51576d;
+  --ring: #babbf1;
+}
+
+.catppuccin-macchiato {
+  --primary: #8aadf4;
+  --primary-foreground: #24273a;
+  --secondary: #363a4f;
+  --secondary-foreground: #cad3f5;
+  --destructive: #ed8796;
+  --destructive-foreground: #24273a;
+  --background: #24273a;
+  --foreground: #cad3f5;
+  --muted: #363a4f;
+  --muted-foreground: #a5adcb;
+  --accent: #494d64;
+  --accent-foreground: #cad3f5;
+  --border: #6e738d;
+  --input: #494d64;
+  --ring: #b7bdf8;
+}
+
+.catppuccin-mocha {
+  --background: #1e1e2e;
+  --foreground: #cdd6f4;
+  --primary: #89b4fa;
+  --primary-foreground: #1e1e2e;
+  --secondary: #313244;
+  --secondary-foreground: #cdd6f4;
+  --muted: #313244;
+  --muted-foreground: #a6adc8;
+  --accent: #45475a;
+  --accent-foreground: #cdd6f4;
+  --destructive: #f38ba8;
+  --destructive-foreground: #1e1e2e;
+  --border: #585b70;
+  --input: #45475a;
+  --ring: #b4befe;
+}
+
+/* common extras */
+.github-light {
+  --background: #ffffff;
+  --foreground: #1f2328;
+  --primary: #0969da;
+  --primary-foreground: #ffffff;
+  --secondary: #f6f8fa;
+  --secondary-foreground: #24292f;
+  --muted: #f6f8fa;
+  --muted-foreground: #57606a;
+  --accent: #ddf4ff;
+  --accent-foreground: #0969da;
+  --destructive: #cf222e;
+  --destructive-foreground: #ffffff;
+  --border: #d0d7de;
+  --input: #d0d7de;
+  --ring: #0969da;
+}
+
+.github-dark {
+  --background: #0d1117;
+  --foreground: #c9d1d9;
+  --primary: #58a6ff;
+  --primary-foreground: #0d1117;
+  --secondary: #21262d;
+  --secondary-foreground: #c9d1d9;
+  --muted: #21262d;
+  --muted-foreground: #8b949e;
+  --accent: #30363d;
+  --accent-foreground: #c9d1d9;
+  --destructive: #f85149;
+  --destructive-foreground: #0d1117;
+  --border: #30363d;
+  --input: #30363d;
+  --ring: #58a6ff;
+}
+
+.nord-light {
+  --background: #eceff4;
+  --foreground: #2e3440;
+  --primary: #5e81ac;
+  --primary-foreground: #eceff4;
+  --secondary: #e5e9f0;
+  --secondary-foreground: #2e3440;
+  --muted: #e5e9f0;
+  --muted-foreground: #4c566a;
+  --accent: #d8dee9;
+  --accent-foreground: #2e3440;
+  --destructive: #bf616a;
+  --destructive-foreground: #eceff4;
+  --border: #d8dee9;
+  --input: #d8dee9;
+  --ring: #81a1c1;
+}
+
+.nord-dark {
+  --background: #2e3440;
+  --foreground: #eceff4;
+  --primary: #88c0d0;
+  --primary-foreground: #2e3440;
+  --secondary: #3b4252;
+  --secondary-foreground: #eceff4;
+  --muted: #3b4252;
+  --muted-foreground: #d8dee9;
+  --accent: #434c5e;
+  --accent-foreground: #eceff4;
+  --destructive: #bf616a;
+  --destructive-foreground: #eceff4;
+  --border: #4c566a;
+  --input: #4c566a;
+  --ring: #88c0d0;
+}
+
+
 h1 {
   font-size: var(--h1-font-size);
   font-weight: var(--h1-font-weight);

package/templates/default/templates/base.yaml

@@ -7,8 +7,8 @@
         - $if site.assets.loadConstructStyleSheetsPolyfill:
             - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
         - $if site.assets.loadUiFromCdn:
-            - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-    - body.dark:
+            - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc15/dist/rettangoli-iife-ui.min.js":
+    - body.slate-dark:
         - rtgl-view w="f":
             - rtgl-view h="64":
             - rtgl-view w="f" ah="c":

package/templates/default/templates/post.yaml

@@ -7,8 +7,8 @@
         - $if site.assets.loadConstructStyleSheetsPolyfill:
             - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
         - $if site.assets.loadUiFromCdn:
-            - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-    - body.dark:
+            - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc15/dist/rettangoli-iife-ui.min.js":
+    - body.slate-dark:
         - rtgl-view h="64":
         - rtgl-view w="f" ah="c":
             - rtgl-view d="h" g="xl" pb="lg" md-w="100vw" lg-w="768" w="1024" ph="lg":

package/sites/README.md

@@ -1,107 +0,0 @@
-# Rettangoli Sites Import Assets
-
-This folder contains publish-only YAML templates/partials for `@rettangoli/sites` URL imports.
-These files are distribution assets, not `@rettangoli/sites` runtime source code.
-
-## Docs Bundle
-
-Template URL:
-
-`https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/docs/documentation.yaml`
-
-Partial URL:
-
-`https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/partials/docs/mobile-nav.yaml`
-
-`sites.config.yaml` example:
-
-```yaml
-imports:
-  templates:
-    docs/documentation: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/docs/documentation.yaml
-  partials:
-    docs/mobile-nav: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/partials/docs/mobile-nav.yaml
-```
-
-Page frontmatter example:
-
-```yaml
----
-template: docs/documentation
-title: Getting Started
-sidebarId: intro
----
-```
-
-Required template data:
-
-- `title`
-- `docsLayout.sidebar.header` (object for sidebar header)
-- `docsLayout.sidebar.items` (sidebar items)
-- `docsLayout.assets.stylesheets` (array of stylesheet URLs)
-- `docsLayout.assets.scripts` (array of script URLs)
-
-Optional data:
-
-- `docsLayout.metaDescription`
-- `docsLayout.canonicalUrl`
-
-Create `data/docsLayout.yaml`:
-
-```yaml
-assets:
-  stylesheets:
-    - https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc14/dist/themes/base.css
-    - https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc14/dist/themes/theme-rtgl-slate.css
-  scripts:
-    - https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js
-    - https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc14/dist/rettangoli-iife-ui.min.js
-
-metaDescription: Documentation portal
-canonicalUrl: https://example.com/docs/getting-started/
-
-sidebar:
-  header:
-    label: Docs
-    href: /
-  items:
-    - title: Introduction
-      type: groupLabel
-      items:
-        - id: intro
-          title: Introduction
-          href: /docs/introduction/
-```
-
-## Rettangoli.dev Shell Templates
-
-These templates mirror `apps/rettangoli.dev/templates/*` so the app can consume
-them via URL imports instead of local template files.
-
-Template URLs:
-
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/base.yaml`
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/documentation.yaml`
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/fe-documentation.yaml`
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/sites-documentation.yaml`
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/vt-documentation.yaml`
-
-`sites.config.yaml` alias example:
-
-```yaml
-imports:
-  templates:
-    base: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/base.yaml
-    documentation: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/documentation.yaml
-    fe-documentation: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/fe-documentation.yaml
-    sites-documentation: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/sites-documentation.yaml
-    vt-documentation: https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/rettangoli-dev/vt-documentation.yaml
-```
-
-## Default Scaffold Base Template
-
-This template mirrors `packages/rettangoli-sites/templates/default/templates/base.yaml`.
-
-Template URL:
-
-- `https://cdn.jsdelivr.net/npm/@rettangoli/sites@<version>/sites/templates/default/base.yaml`

package/sites/partials/docs/mobile-nav.yaml

@@ -1,7 +0,0 @@
-- $if docsLayout && docsLayout.sidebar && docsLayout.sidebar.header && docsLayout.sidebar.items:
-    - 'rtgl-view hide md-show w=f d=v bgc=bg':
-        - 'rtgl-view pos=fix w=f h=56 bgc=bg av=c ph=lg bwb=xs z=10 style="top:0;left:0"':
-            - 'a href="${docsLayout.sidebar.header.href}" style="text-decoration:none;display:contents;color:inherit;"':
-                - rtgl-text s=md: ${docsLayout.sidebar.header.label}
-        - rtgl-view h=56:
-        - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(docsLayout.sidebar.header))}" items="${encodeURIComponent(jsonStringify(docsLayout.sidebar.items))}" w=f:

package/sites/templates/default/base.yaml

@@ -1,20 +0,0 @@
-- html lang="en":
-    - head:
-        - meta charset="utf-8":
-        - meta name="viewport" content="width=device-width,initial-scale=1":
-        - title: ${title} - ${site.name}
-        - link rel="stylesheet" href="/css/theme.css":
-        - $if site.assets.loadConstructStyleSheetsPolyfill:
-            - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - $if site.assets.loadUiFromCdn:
-            - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-    - body.dark:
-        - rtgl-view w="f":
-            - rtgl-view h="64":
-            - rtgl-view w="f" ah="c":
-                - rtgl-view w="f" ph="lg" pb="lg" ah="c" md-w="100vw" lg-w="768" w="1024":
-                    - "${content}"
-                - rtgl-view h="30vh":
-                - $partial: footer
-            - rtgl-view pos="abs" edge="t" ah="c" bgc="bg":
-                - $partial: header

package/sites/templates/docs/documentation.yaml

@@ -1,34 +0,0 @@
-- html lang="en":
-    - head:
-        - meta charset="utf-8":
-        - meta name="viewport" content="width=device-width,initial-scale=1":
-        - title: ${title}
-        - $if docsLayout && docsLayout.metaDescription:
-            - meta name="description" content="${docsLayout.metaDescription}":
-        - $if docsLayout && docsLayout.canonicalUrl:
-            - link rel="canonical" href="${docsLayout.canonicalUrl}":
-        - $if docsLayout && docsLayout.assets && docsLayout.assets.stylesheets:
-            - $for href in docsLayout.assets.stylesheets:
-                - link rel="stylesheet" href="${href}":
-        - $if docsLayout && docsLayout.assets && docsLayout.assets.scripts:
-            - $for src in docsLayout.assets.scripts:
-                - script src="${src}":
-
-    - body.dark:
-        - $partial: docs/mobile-nav
-          docsLayout: ${docsLayout}
-          sidebarId: ${sidebarId}
-
-        - rtgl-view bgc="bg" w="f" d=h:
-            - $if docsLayout && docsLayout.sidebar && docsLayout.sidebar.header && docsLayout.sidebar.items:
-                - 'rtgl-view md-hide pos=fix h=100vh bgc=bg style="left: 0"':
-                    - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(docsLayout.sidebar.header))}" items="${encodeURIComponent(jsonStringify(docsLayout.sidebar.items))}":
-            - rtgl-view md-hide xl-show hide w=272:
-            - rtgl-view w="1fg" ah=c:
-                - rtgl-view pv="lg" lg-w="100vw" w="720" ph="lg" sv id="content-container":
-                    - rtgl-view hide md-show h=56:
-                    - rtgl-text s="h1" mb="lg": ${title}
-                    - "${content}"
-                    - rtgl-view h=200:
-            - 'rtgl-view xl-hide style="position: fixed; right: 0"':
-                - rtgl-page-outline id="page-outline" target-id="content-container" scroll-container-id="window" offset-top="80":

package/sites/templates/rettangoli-dev/base.yaml

@@ -1,24 +0,0 @@
-- html lang="en":
-    - head:
-        - $partial: seo1
-          page: ${page}
-          seo: ${seo}
-          title: ${title}
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/base.css":
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/theme-rtgl-slate.css":
-        - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-        - script src="/public/rtgl-icons.js":
-
-    - body.dark:
-        - rtgl-view:
-            - rtgl-view pos="abs" edge="t" ah="c" bgc="bg":
-                - $partial: navbar1
-                  title: ${site.navbar.title}
-                  cta: ${site.navbar.cta}
-            - rtgl-view w=f:
-                - rtgl-view h="48":
-                - rtgl-view w="f" ah="c":
-                    - rtgl-view w=f ph="lg" pb="lg" ah=c:
-                        - "${content}"
-        - script src="/public/mobile-nav.js":

package/sites/templates/rettangoli-dev/documentation.yaml

@@ -1,33 +0,0 @@
-- html lang="en":
-    - head:
-        - $partial: seo1
-          page: ${page}
-          seo: ${seo}
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/base.css":
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/theme-rtgl-slate.css":
-        - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-        - script src="/public/rtgl-icons.js":
-
-    - body.dark:
-        - $partial: mobile-nav1
-          headerLabel: ${docs.header.label}
-          headerHref: ${docs.header.href}
-          header: ${docs.header}
-          items: ${docs.items}
-          sidebarId: ${sidebarId}
-
-        - rtgl-view bgc="bg" w="f" d=h:
-            - 'rtgl-view md-hide pos=fix h=100vh bgc=bg style="left: 0"':
-                - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(docs.header))}" items="${encodeURIComponent(jsonStringify(docs.items))}":
-            - rtgl-view md-hide xl-show hide w=272:
-            - rtgl-view w="1fg" ah=c:
-                - rtgl-view pv="lg" lg-w="100vw" w="720" ph="lg" sv id="content-container":
-                    - rtgl-view hide md-show h=56:
-                    - rtgl-text s="h1" mb="lg": ${title}
-                    - "${content}"
-                    - rtgl-view h=200:
-            - 'rtgl-view xl-hide style="position: fixed; right: 0"':
-                - rtgl-page-outline id="page-outline" target-id="content-container" scroll-container-id="window" offset-top="80":
-
-        - script src="/public/mobile-nav.js":

package/sites/templates/rettangoli-dev/fe-documentation.yaml

@@ -1,33 +0,0 @@
-- html lang="en":
-    - head:
-        - $partial: seo1
-          page: ${page}
-          seo: ${seo}
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/base.css":
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/theme-rtgl-slate.css":
-        - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-        - script src="/public/rtgl-icons.js":
-
-    - body.dark:
-        - $partial: mobile-nav1
-          headerLabel: ${feDocs.header.label}
-          headerHref: ${feDocs.header.href}
-          header: ${feDocs.header}
-          items: ${feDocs.items}
-          sidebarId: ${sidebarId}
-
-        - rtgl-view bgc="bg" w="f" d=h:
-            - 'rtgl-view md-hide pos=fix h=100vh bgc=bg style="left: 0"':
-                - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(feDocs.header))}" items="${encodeURIComponent(jsonStringify(feDocs.items))}":
-            - rtgl-view md-hide xl-show hide w=272:
-            - rtgl-view w="1fg" ah=c:
-                - rtgl-view pv="lg" lg-w="100vw" w="720" ph="lg" sv id="content-container":
-                    - rtgl-view hide md-show h=56:
-                    - rtgl-text s="h1" mb="lg": ${title}
-                    - "${content}"
-                    - rtgl-view h=200:
-            - 'rtgl-view xl-hide style="position: fixed; right: 0"':
-                - rtgl-page-outline id="page-outline" target-id="content-container" scroll-container-id="window" offset-top="80":
-
-        - script src="/public/mobile-nav.js":

package/sites/templates/rettangoli-dev/sites-documentation.yaml

@@ -1,33 +0,0 @@
-- html lang="en":
-    - head:
-        - $partial: seo1
-          page: ${page}
-          seo: ${seo}
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/base.css":
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/theme-rtgl-slate.css":
-        - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-        - script src="/public/rtgl-icons.js":
-
-    - body.dark:
-        - $partial: mobile-nav1
-          headerLabel: ${sitesDocs.header.label}
-          headerHref: ${sitesDocs.header.href}
-          header: ${sitesDocs.header}
-          items: ${sitesDocs.items}
-          sidebarId: ${sidebarId}
-
-        - rtgl-view bgc="bg" w="f" d=h:
-            - 'rtgl-view md-hide pos=fix h=100vh bgc=bg style="left: 0"':
-                - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(sitesDocs.header))}" items="${encodeURIComponent(jsonStringify(sitesDocs.items))}":
-            - rtgl-view md-hide xl-show hide w=272:
-            - rtgl-view w="1fg" ah=c:
-                - rtgl-view pv="lg" lg-w="100vw" w="720" ph="lg" sv id="content-container":
-                    - rtgl-view hide md-show h=56:
-                    - rtgl-text s="h1" mb="lg": ${title}
-                    - "${content}"
-                    - rtgl-view h=200:
-            - 'rtgl-view xl-hide style="position: fixed; right: 0"':
-                - rtgl-page-outline id="page-outline" target-id="content-container" scroll-container-id="window" offset-top="80":
-
-        - script src="/public/mobile-nav.js":

package/sites/templates/rettangoli-dev/vt-documentation.yaml

@@ -1,33 +0,0 @@
-- html lang="en":
-    - head:
-        - $partial: seo1
-          page: ${page}
-          seo: ${seo}
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/base.css":
-        - link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/themes/theme-rtgl-slate.css":
-        - script src="https://cdn.jsdelivr.net/npm/construct-style-sheets-polyfill@3.1.0/dist/adoptedStyleSheets.min.js":
-        - script src="https://cdn.jsdelivr.net/npm/@rettangoli/ui@1.0.0-rc13/dist/rettangoli-iife-ui.min.js":
-        - script src="/public/rtgl-icons.js":
-
-    - body.dark:
-        - $partial: mobile-nav1
-          headerLabel: ${vtDocs.header.label}
-          headerHref: ${vtDocs.header.href}
-          header: ${vtDocs.header}
-          items: ${vtDocs.items}
-          sidebarId: ${sidebarId}
-
-        - rtgl-view bgc="bg" w="f" d=h:
-            - 'rtgl-view md-hide pos=fix h=100vh bgc=bg style="left: 0"':
-                - rtgl-sidebar selected-item-id=${sidebarId} header="${encodeURIComponent(jsonStringify(vtDocs.header))}" items="${encodeURIComponent(jsonStringify(vtDocs.items))}":
-            - rtgl-view md-hide xl-show hide w=272:
-            - rtgl-view w="1fg" ah=c:
-                - rtgl-view pv="lg" lg-w="100vw" w="720" ph="lg" sv id="content-container":
-                    - rtgl-view hide md-show h=56:
-                    - rtgl-text s="h1" mb="lg": ${title}
-                    - "${content}"
-                    - rtgl-view h=200:
-            - 'rtgl-view xl-hide style="position: fixed; right: 0"':
-                - rtgl-page-outline id="page-outline" target-id="content-container" scroll-container-id="window" offset-top="80":
-
-        - script src="/public/mobile-nav.js":