Style
Work on the pipeline that produces the style.
What this app owns
apps/style is the Sass + Lightning CSS pipeline that produces the Coolify theme. The build emits:
dist/main.user.css: Stylus-friendly build with userstyle metadata.dist/main.css: Raw CSS bundle referenced by the Traefik dynamic-config install.- Supporting assets and source maps consumed by the API release flow.
Manual Stylus installs load main.user.css, while the API serves a published release and the dynamic proxy injects the latest CSS.
File layout
Local workflow
Start the watcher:
pnpm --filter @repo/style devThis watches apps/style/src/** and rebuilds CSS to dist/.
Start the API server:
pnpm --filter @repo/api devThe API serves the CSS from http://localhost:8080/release/latest/?asset=main.user.css. In development, it reads directly from the style app's dist/ folder.
Install the stylesheet inside Stylus, enable Live Reload, and add http://localhost:8080/* to allowed hosts.
Edit Sass partials for components, theme utilities, pages, etc., under apps/style/src/.
Update documentation when you change installation or update behavior. Update both updating.mdx and installation/dynamic-config.mdx so the documentation reflects Stylus and Traefik paths together.
Testing
Run these commands from the repo root:
-
Linting:
pnpm --filter @repo/style lint -
Formatting:
pnpm --filter @repo/style format -
Type checking:
pnpm --filter @repo/style typecheck -
Spell checking:
pnpm --filter @repo/style check:spelling
Deployment
-
Build the production bundle:
pnpm --filter @repo/style build -
This outputs
dist/artifacts that are published via GitHub Releases and served by the API. -
To release a new version:
- Run
pnpm changesetto create a changeset describing your changes - Run
pnpm versionto update package versions based on changesets - Commit and push the changes (the GitHub workflow handles building and publishing)
- Run
Last updated on