Skip to content

Adopt skainet-docs-ui v1.1.1 + Diátaxis card-grid landing (#501)#502

Merged
michalharakal merged 1 commit intodevelopfrom
feature/501-skainet-docs-ui-v1
Apr 13, 2026
Merged

Adopt skainet-docs-ui v1.1.1 + Diátaxis card-grid landing (#501)#502
michalharakal merged 1 commit intodevelopfrom
feature/501-skainet-docs-ui-v1

Conversation

@michalharakal
Copy link
Copy Markdown
Contributor

Closes #501.

Summary

Swap mainline's Antora UI bundle for the new SKaiNET-branded
`skainet-docs-ui`
release, pinned to `v1.1.1`, and rewrite the docs landing page
to use its `.card-grid` component for a real Diátaxis
four-card grid.

Two-line scope

```diff
ui:
bundle:

```diff

  • == Quick links
    • link:../api/index.html[API reference (Dokka)] (bundled at publish time)
  • [.card-grid]
    • xref:tutorials/java-getting-started.adoc[Tutorials]
  • Learning-oriented walkthroughs. Start here if you are new to
  • SKaiNET — set up a project, build your first tensor, run a
  • forward pass.
    • xref:how-to/build.adoc[How-to guides]
  • ... (etc, four cards total)
    ```

What ships in the new bundle

The skainet-docs-ui repo is the shared Antora UI for every
SKaiNET docs site (mainline, SKaiNET-transformers, future
siblings). Forked from upstream antora-ui-default and
SKaiNET-ified across six commits:

Phase What
1 Scaffold from upstream antora-ui-default (vanilla bundle works)
2 SKaiNET red palette via vars.css (light + dark mode)
3 Orbitron + Inter + Fira Code via Google Fonts
4 Dark mode toggle + header partial override (FOUC-safe inline bootstrap)
5 Aesthetic polish (6px scrollbar, rounded code blocks, focus glow)
6 GitHub Actions release workflow + v1.0.0 tag
v1.1.0 `.card-grid` CSS for landing pages
v1.1.1 Override upstream MPL-2.0 footer with SKaiNET footer

Visual changes you'll see

  • Brand color flips from upstream Antora blue to SKaiNET red `#dc2626`
  • Typography flips from Roboto / Roboto Mono to Orbitron headings + Inter body + Fira Code monospace
  • Dark mode toggle button (🌓) in the navbar top-right; persists via localStorage; respects `prefers-color-scheme` on first visit
  • Code blocks rounded 8px, GitHub-light `#f6f8fa` in light mode and GitHub-dark `#0d1117` in dark mode, with a 1px border in the matching shade
  • Landing page replaces the placeholder "Quick links" with a responsive 4-card Diátaxis grid (Tutorials / How-to / Reference / Explanation)
  • Footer replaces upstream "This page was built using the Antora default UI ... MPL-2.0" with SKaiNET attribution + cross-repo links to skainet-docs-ui / mainline / SKaiNET-transformers
  • Scrollbar thin 6px in the SKaiNET muted-fg color
  • Focus glow primary-red on links + buttons + nav items via `:focus-visible`
  • Card hover lifts the .doc body slightly and adds a soft two-layer shadow in light mode

Verification

Local docker build of the docs site against the published v1.1.1 bundle URL (no local override):

```bash
docker run --rm --user "$(id -u):$(id -g)" \
-v "$PWD:/antora" -w /antora \
skainet-antora:local docs/antora-playbook.yml
python3 -m http.server --directory docs/build/site 8080
```

  • exit 0, no warnings, no errors
  • `docs/build/site/skainet/index.html` contains `<div class="ulist card-grid">` with four `
  • ` cards
  • rendered footer references `skainet-docs-ui` and `MIT`, no MPL-2.0
  • inline `` script with the FOUC-safe theme bootstrap is present
  • navbar has the `#theme-toggle` button
  • code blocks render in the new GitHub-light/dark style
  • Mainline mermaid extension (docs/.docker/local-mermaid-extension.js) still resolves the diagrams to inline SVGs
  • CI: full multiplatform docs.yml workflow on this branch

Out of scope

  • Bumping SKaiNET-transformers's playbook to the same bundle.
    Coordinated as a separate PR on that repo.
  • Self-hosted fonts (Phase 5 still goes through Google Fonts at
    page load — fine for v1, can move to bundled @font-face files
    in a UI v1.2).
  • Search wiring (`SITE_SEARCH_PROVIDER` env var still unset; the
    UI ships an input box already, just needs a search backend).

🤖 Generated with Claude Code

Two coupled changes that swap mainline's Antora UI bundle for
the new SKaiNET-branded skainet-docs-ui release and rewrite
the landing page to use its card-grid component.

## docs/antora-playbook.yml

Pin ui.bundle.url to:

    https://github.com/SKaiNET-developers/skainet-docs-ui/releases/download/v1.1.1/ui-bundle.zip

Replaces the upstream gitlab.com/antora/antora-ui-default URL
that mainline had been pinned to since the Antora migration in
#494/#495. The new bundle is the shared SKaiNET docs UI from
the new skainet-docs-ui repo (https://github.com/SKaiNET-developers/skainet-docs-ui)
which ships:

  - SKaiNET red palette (#dc2626) with light + dark mode
  - Orbitron (display) + Inter (body) + Fira Code (mono)
  - Class-based dark mode toggle (FOUC-safe via inline head bootstrap)
  - 6px thin custom scrollbar
  - Rounded code blocks with GitHub-light / GitHub-dark
  - Primary-red focus glow on links / buttons
  - SKaiNET footer (replaces the upstream MPL-2.0 / antora-ui
    boilerplate)
  - .card-grid CSS for landing-page card grids
  - Mobile responsive (hamburger menu from upstream preserved)

Pinned to v1.1.1 specifically (not floating on latest) so
mainline builds are reproducible. Bumping the pin is a one-line
follow-up PR whenever skainet-docs-ui ships a new minor.

## docs/modules/ROOT/pages/index.adoc

Replaces the placeholder "Quick links" section with a real
[.card-grid] block that surfaces the four Diátaxis sections
(Tutorials / How-to / Reference / Explanation) as clickable
cards with one-line descriptions. Each card links to the first
real page of its section:

  Tutorials   -> tutorials/java-getting-started.adoc
  How-to      -> how-to/build.adoc
  Reference   -> reference/architecture.adoc
                 (with inline xrefs to operator catalog +
                  ops-status-matrix + Dokka API)
  Explanation -> explanation/skainet-for-ai.adoc

The [.card-grid] role is rendered into a responsive grid by
the new CSS in skainet-docs-ui's src/css/skainet-polish.css
(landed in v1.1.0). Falls back to a normal bulleted list on
any consumer that doesn't ship the SKaiNET CSS — never a
broken render.

The Diátaxis NOTE admonition pointing at SKaiNET-transformers
for LLM runtimes stays — that was added in the original
migration to make the repo split visible.

## Verification

Local Antora build against the published v1.1.1 bundle URL
(no --ui-bundle-url override):

    docker run --rm --user "$(id -u):$(id -g)" \
        -v "$PWD:/antora" -w /antora \
        skainet-antora:local docs/antora-playbook.yml

  - exit 0
  - rendered index.html contains <div class="ulist card-grid">
    with the four cards
  - rendered footer contains the SKaiNET-attribution links to
    skainet-docs-ui, mainline, and SKaiNET-transformers
  - all other pages (tutorials, how-to, reference, explanation,
    operator catalog, ops-status-matrix) render unchanged but
    in the new red-on-dark/light theme

Closes #501.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@michalharakal michalharakal merged commit c551f14 into develop Apr 13, 2026
6 checks passed
@github-actions
Copy link
Copy Markdown

📖 Documentation Preview

The documentation has been built successfully for this PR.

Generated Files:

  • Operator documentation: docs/modules/operators/_generated_/
  • JSON schema output: operators.json

Artifacts:

  • Download the documentation-preview-502 artifact to view the complete documentation locally.

This comment will be updated automatically when the PR is updated.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Adopt skainet-docs-ui v1.0.0 (SKaiNET-branded Antora UI)

1 participant