feat: Replace the gulp UI toolchain with Vite (#874)

* chore: Commit the minified images

gulp-imagemin minified these on every build; the minified versions are
committed so the build does not need an image pipeline.

* chore: Remove upstream leftovers from the UI

The .gitlab-ci.yml and the docs/ component are inherited from
antora-ui-default and were never used here.

* chore: Add a NOTICE file for the bundled third-party components

Minification strips embedded license header comments from the built
css/js, so the attributions (Font Awesome, highlight.js, Asciidoctor
Tabs, Octicons, the OFL fonts, and the MPL-2.0 upstream fork) live in
a NOTICE file. The build ships it in the UI bundle, which publishes it
on the site.

* feat: Replace the gulp UI toolchain with Vite

Vite is what stackable-apps and stackable-cockpit build with, and the
gulp pipeline was frozen: gulp-eslint/gulp-stylelint are unmaintained
and pinned eslint 6 / stylelint 13. Upstream antora-ui-default still
ships the same frozen toolchain, so there is no upstream modernisation
to converge with. Everything starts on the current majors: vite 8,
eslint 10, stylelint 17, archiver 8, Node 24.

- build.mjs produces the identical bundle layout: js entries are built
  as self-contained classic scripts (one vite pass each), the css in a
  separate pass, static directories are copied, NOTICE and LICENSE are
  included, everything is zipped to build/ui-bundle.zip. Verified by
  building the full site with both toolchains: every page is
  byte-identical.
- The vendor bundle sources become ESM and reference the browser build
  of @asciidoctor/tabs explicitly (vite does not honor the style and
  browser package fields the way browserify/postcss-import did).
- CSS custom properties are no longer inlined at build time; every
  supported browser handles var(), and the upcoming design-token work
  needs them preserved.
- The standalone gulp preview is gone; render UI changes with real
  content via 'make build-truly-local' or the deploy preview.
- The stylelint config accepts the inherited upstream css conventions
  instead of reformatting everything right before the planned upstream
  re-sync.
- package-lock.json is regenerated; @antora/* and pagefind are pinned
  to their previously locked versions so the rendered site and search
  assets stay identical (bumping those is Renovate's job).
- Node 24 in .nvmrc/engines/CI, matching stackable-apps. The root
  .nvmrc also raises the Netlify build to Node 24.

* fix: Remove invalid css declarations and lint leftovers

background-color/min-width do not accept 'none'; browsers ignored the
declarations, so removing them does not change rendering. Also an
unused event parameter and a stale eslint-disable directive.

* chore: Add prettier, mirroring the stackable-apps configuration

Scoped away from the inherited upstream src/ files until the planned
upstream re-sync, so the diff against antora-ui-default stays readable.
prettier --check runs as part of npm run lint (and therefore in CI).

knip is deliberately not added: handlebars templates and classic
browser scripts have no import graph, and most dependencies are
referenced from playbook YAML or css, so it would need to ignore
nearly everything to stay quiet.

Author: lfrancke

.github/workflows/ui.yml

@@ -14,7 +14,8 @@ jobs:
       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
       - uses: actions/setup-node@cdca7365b2dadb8aad0a33bc7601856ffabcc48e # v4.3.0
         with:
-          node-version: '16'
+          node-version: '24'
           cache: npm
       - run: npm ci
+      - run: npm run lint --workspace ui
       - run: npm run bundle --workspace ui

.nvmrc

@@ -0,0 +1 @@
+24

Makefile

@@ -40,7 +40,7 @@ build-prod: build-ui
 	node_modules/.bin/antora generate antora-playbook.yml --fetch $(ANTORAFLAGS)
 
 build-ui:
-	node_modules/.bin/gulp --cwd ui bundle
+	npm run bundle --workspace ui
 
 build-search-index:
 	npm run build-search-index

README.adoc

@@ -62,7 +62,7 @@ content:
 
 The design & layout lives in the `ui/` directory of this repository.
 
-`LIVERELOAD=true gulp` may be used to recreate the built documentation after each edit.
+To see UI changes rendered with real content, rebuild with `make build-truly-local`.
 
 == More useful links