2a5c3ad440
For some reason the link wasn't sized correctly, it's smaller than the logo and looks buggy. Setting this as an inline-block fixes this. I tested this on Firefox and Chromium, it doesn't appear to be an issue on Chrome but this fix doesn't regress there either. |
||
|---|---|---|
| .. | ||
| src | ||
| static | ||
| styles | ||
| tests | ||
| .gitignore | ||
| biome.json | ||
| index.html | ||
| package.json | ||
| playwright.config.ts | ||
| preview.html | ||
| README.md | ||
| tsconfig.default.json | ||
| tsconfig.json | ||
| vite.config.mts | ||
SlintPad
This directory contains the frontend code for SlintPad, the online code editor which is hosted on https://slint.dev/editor (last stable) and https://slint.dev/snapshots/master/editor (nightly).
You need to install the following components:
To try it out locally type this in this directory:
## only need to run this once
pnpm install
pnpm build:wasm_interpreter # Build the wasm interpreter used in `preview.html`
pnpm build:wasm_lsp # Build the wasm LSP used by the text editor
## Run this to refresh slintpad (dev mode!)
pnpm start # Run in development mode
## Run this to refresh slintpad (build mode!)
pnpm build # Build the web UI code
pnpm preview # Start a server serving the slintpad UI
Documentation
The index.html page contains a code editor and every key press reload the preview.
The preview.html page contains only the preview and the code must be given via query parameter.
-
?load_url=query argument make it possible to load the .slint code directly from an URL. If the slint code contains relative path for imports or images, they are loaded relative to that slint file. That way it is possible to load code from github (via raw.githubusercontent) or gists.Example: this loads the printerdemo.slint file from the github URL
-
?snippet=query argument, followed by the URL-encoded slint code, will simply load this code.Example: a simple code with "Hello Slint"
-
?style=query argument, followed by the name of the style to use.Example: The "Hello Slint" using different styles
-
?gz=Like?snippet=but compressed with gzip and base64 encoded. -
?lib=lib_name=<url>query argument, followed by the name of the library and the URL to load it from.Example: The to use the
@materiallibrary: