@janga/norna 0.7.2 → 0.7.3

package/starters/basic/site/theme.md

@@ -6,36 +6,90 @@
 # Available structure:
 # navigation:
 #   brand: site-wide brand/home text; defaults to the homepage title
-# presentation:
-#   backgroundColor: quoted hex color, e.g. "#000000"
-#   textColor: quoted hex color, e.g. "#f7f4ee"
-#   inlineStyles:
-#     style-name:
-#       color: quoted hex color
-#   typography:
-#     preset: quiet-gallery | compact-gallery | text-forward | statement
-#     overrides:
-#       heading:
+# layout:
+#   pageWidth: CSS length, e.g. 1180px
+#   gutter:
+#     desktop: CSS length or clamp(), e.g. clamp(1.25rem, 4vw, 3rem)
+#     mobile: CSS length, e.g. 1rem
+#   spacing:
+#     firstSectionTop:
+#       desktop: CSS length or clamp(), e.g. clamp(1.875rem, 3vw, 2.75rem)
+#       mobile: CSS length, e.g. 1.375rem
+#     sectionGap:
+#       desktop: CSS length or clamp(), e.g. clamp(2.55rem, 4.2vw, 3.9rem)
+#       mobile: CSS length, e.g. 2.25rem
+#     finalSectionBottom:
+#       desktop: CSS length or clamp(), e.g. clamp(2.55rem, 4.2vw, 3.9rem)
+#       mobile: CSS length, e.g. 2.25rem
+#     sectionHeadingToBody:
+#       desktop: CSS length or clamp(), e.g. clamp(0.5625rem, 1.25vw, 0.75rem)
+#       mobile: CSS length, e.g. 0.4375rem
+#     bodyToImages:
+#       desktop: CSS length or clamp(), e.g. clamp(1.25rem, 2.5vw, 2rem)
+#       mobile: CSS length, e.g. 1.25rem
+#     imageGap:
+#       desktop: CSS length or clamp(), e.g. clamp(1.5rem, 3.5vw, 2.75rem)
+#       mobile: CSS length, e.g. 2.75rem
+#     subheadingTop:
+#       desktop: CSS length, e.g. 2rem
+#       mobile: CSS length, e.g. 1.6rem
+#     subheadingRuleTop:
+#       desktop: CSS length, e.g. 1rem
+#       mobile: CSS length, e.g. 0.8rem
+# gallery:
+#   width: CSS length, e.g. 900px
+#   maxAvailableWidthPercent:
+#     desktop: number from 1 through 100
+#     mobile: number from 1 through 100
+#   maxAvailableHeightPercent:
+#     desktop: number from 1 through 100
+#     mobile: number from 1 through 100
+# typography:
+#   fontFamily: CSS font-family stack
+#   preset: quiet-gallery | compact-gallery | text-forward | statement
+#   overrides:
+#     headings:
+#       h2:
 #         align:
 #           desktop: left | center | right
 #           mobile: left | center | right
 #         size: small | medium | large | xlarge
 #         lineHeight: number from 1 through 3
 #         spacing: CSS length, e.g. 0.65em
-#       body:
+#       h3:
 #         align:
 #           desktop: left | center | right
 #           mobile: left | center | right
 #         size: small | medium | large | xlarge
 #         lineHeight: number from 1 through 3
-#         paragraphSpacing: CSS length, e.g. 0.85em
-#       caption:
+#         spacing: CSS length, e.g. 0.9rem
+#       h4:
 #         align:
 #           desktop: left | center | right
 #           mobile: left | center | right
 #         size: small | medium | large | xlarge
 #         lineHeight: number from 1 through 3
-#         spacing: CSS length, e.g. 0.5em
+#         spacing: CSS length, e.g. 0.85rem
+#     body:
+#       align:
+#         desktop: left | center | right
+#         mobile: left | center | right
+#       size: small | medium | large | xlarge
+#       lineHeight: number from 1 through 3
+#       paragraphSpacing: CSS length, e.g. 0.85em
+#     caption:
+#       align:
+#         desktop: left | center | right
+#         mobile: left | center | right
+#       size: small | medium | large | xlarge
+#       lineHeight: number from 1 through 3
+#       spacing: CSS length, e.g. 0.5em
+# presentation:
+#   backgroundColor: quoted hex color, e.g. "#000000"
+#   textColor: quoted hex color, e.g. "#f7f4ee"
+#   inlineStyles:
+#     style-name:
+#       color: quoted hex color
 # frame:
 #   colors: presentation | theme
 #   colors:
@@ -43,15 +97,54 @@
 #     textColor: quoted hex color
 # norna:end theme-help
 navigation:
-  brand: Example Gallery
+  brand: Example Site
+layout:
+  pageWidth: 1180px
+  gutter:
+    desktop: clamp(1.25rem, 4vw, 3rem)
+    mobile: 1rem
+  spacing:
+    firstSectionTop:
+      desktop: clamp(1.875rem, 3vw, 2.75rem)
+      mobile: 1.375rem
+    sectionGap:
+      desktop: clamp(2.55rem, 4.2vw, 3.9rem)
+      mobile: 2.25rem
+    finalSectionBottom:
+      desktop: clamp(2.55rem, 4.2vw, 3.9rem)
+      mobile: 2.25rem
+    sectionHeadingToBody:
+      desktop: clamp(0.5625rem, 1.25vw, 0.75rem)
+      mobile: 0.4375rem
+    bodyToImages:
+      desktop: clamp(1.25rem, 2.5vw, 2rem)
+      mobile: 1.25rem
+    imageGap:
+      desktop: clamp(1.5rem, 3.5vw, 2.75rem)
+      mobile: 2.75rem
+    subheadingTop:
+      desktop: 2rem
+      mobile: 1.6rem
+    subheadingRuleTop:
+      desktop: 1rem
+      mobile: 0.8rem
+gallery:
+  width: 900px
+  maxAvailableWidthPercent:
+    desktop: 100
+    mobile: 100
+  maxAvailableHeightPercent:
+    desktop: 74
+    mobile: 68
+typography:
+  fontFamily: "Arial, 'Helvetica Neue', Helvetica, sans-serif"
+  preset: quiet-gallery
 presentation:
   backgroundColor: "#000000"
   textColor: "#f7f4ee"
   inlineStyles:
     highlight:
       color: "#ffd84d"
-  typography:
-    preset: quiet-gallery
 frame:
   colors: presentation
 ---

package/starters/project/.github/workflows/deploy.yml

@@ -0,0 +1,65 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: github-pages
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 24.18.0
+          cache: npm
+
+      - name: Install image tools
+        run: sudo apt-get update && sudo apt-get install -y imagemagick
+
+      - name: Restore generated images
+        uses: actions/cache@v4
+        with:
+          path: site/.norna/public/images/generated
+          key: norna-images-${{ hashFiles('site/.norna/generated-images.json') }}
+          restore-keys: |
+            norna-images-
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build
+        run: npm run build
+
+      - name: Configure Pages
+        uses: actions/configure-pages@v5
+
+      - name: Upload Pages artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

package/starters/project/README.md

@@ -0,0 +1,72 @@
+# Project Starter
+
+This is a compact Norna starter for small open source projects, CLI tools,
+libraries, and similar project sites.
+
+## Setup
+
+```sh
+npm install
+npm run dev
+```
+
+If the standard local port is blocked, start with:
+
+```sh
+npm run dev -- --kill
+```
+
+## Files
+
+- `site/config.mjs`: technical settings such as URL, language labels, GitHub
+  repository, and deploy workflow.
+- `site/theme.md`: site-wide visual settings such as brand text, colors,
+  frame colors, and inline text styles.
+- `site/content.md`: homepage title, sections, project summary, links,
+  install command, example usage, features, and next steps.
+- `site/routes/guide/route-content.md`: short secondary page with realistic
+  project guide content.
+- `site/public/robots.txt`: static public file copied into the built site.
+
+The starter intentionally does not include generated output, `node_modules`, or
+a local Norna installation. It does include `package-lock.json` because the
+GitHub Pages workflow uses `npm ci`.
+
+## Adapt The Starter
+
+1. Replace the project name, tagline, links, install command, example usage,
+   features, and use cases in `site/content.md`.
+2. Replace the guide examples in `site/routes/guide/route-content.md`, or
+   delete the route if the homepage is enough.
+3. Edit `site/theme.md` for brand name, colors, frame colors, and inline text
+   styles.
+4. Edit `site/config.mjs` for public URL, GitHub repository, footer text, and
+   deploy workflow name.
+5. Update `package.json` with the site's package name and keep
+   `package-lock.json` committed.
+
+## Common Commands
+
+```sh
+npm run norna:check
+npm run norna:typography:show
+npm run build
+```
+
+To verify the same install path used by GitHub Pages:
+
+```sh
+npm ci
+npm run build
+```
+
+Generic Norna documentation lives in the Norna repository:
+
+- `docs/getting-started.md`
+- `docs/site-structure.md`
+- `docs/content.md`
+- `docs/theme.md`
+- `docs/typography.md`
+- `docs/routes.md`
+- `docs/configuration.md`
+- `docs/commands.md`