docs: Add small refinements to CSS adjacent pages (#31683)

Follow up to https://github.com/zed-industries/zed/pull/31681. Was
visiting some of these pages and noticed these somewhat small formatting
and copywriting improvement opportunities. The docs for Svelte in
particular felt somewhat unorganized.

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2025-05-29 08:43:54 -03:00 committed by GitHub
parent e3354543c0
commit 45f9edcbb9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 29 additions and 34 deletions

View file

@ -3,7 +3,7 @@
The Agent Panel provides you with a way to interact with LLMs. The Agent Panel provides you with a way to interact with LLMs.
You can use it for various tasks, such as generating code, asking questions about your code base, and general inquiries such as emails and documentation. You can use it for various tasks, such as generating code, asking questions about your code base, and general inquiries such as emails and documentation.
To open the Agent Panel, use the `agent: new thread` action in [the Command Palette](../getting-started.md#command-palette) or click the ✨ (sparkles) icon in the status bar. To open the Agent Panel, use the `agent: new thread` action in [the Command Palette](./getting-started.md#command-palette) or click the ✨ (sparkles) icon in the status bar.
If you're using the Agent Panel for the first time, you'll need to [configure at least one LLM provider](./configuration.md). If you're using the Agent Panel for the first time, you'll need to [configure at least one LLM provider](./configuration.md).

View file

@ -1,18 +1,19 @@
# CSS # CSS
CSS support is available natively in Zed. Zed has built-in support for CSS.
- Tree-sitter: [tree-sitter/tree-sitter-css](https://github.com/tree-sitter/tree-sitter-css) - Tree-sitter: [tree-sitter/tree-sitter-css](https://github.com/tree-sitter/tree-sitter-css)
- Language Servers: - Language Servers:
- [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice) - [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice)
- [tailwindcss-language-server](https://github.com/tailwindlabs/tailwindcss-intellisense) - [tailwindcss-language-server](https://github.com/tailwindlabs/tailwindcss-intellisense)
<!-- ## Tailwind CSS
TBD: Document CSS
TBD: Document [Tailwind CSS](./tailwindcss.md)
-->
## See also: Zed also supports [Tailwind CSS](./tailwindcss.md) out-of-the-box for languages and frameworks like JavaScript, Astro, Svelte, and more.
<!-- TBD: Document CS -->
## Recommended Reading
- [HTML](./html.md) - [HTML](./html.md)
- [TypeScript](./typescript.md) - [TypeScript](./typescript.md)

View file

@ -5,9 +5,7 @@ HTML support is available through the [HTML extension](https://github.com/zed-in
- Tree-sitter: [tree-sitter/tree-sitter-html](https://github.com/tree-sitter/tree-sitter-html) - Tree-sitter: [tree-sitter/tree-sitter-html](https://github.com/tree-sitter/tree-sitter-html)
- Language Server: [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice) - Language Server: [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice)
This extension is automatically installed. This extension is automatically installed, but if you do not want to use it, you can add the following to your settings:
If you do not want to use the HTML extension, you can add the following to your settings:
```json ```json
{ {
@ -19,9 +17,9 @@ If you do not want to use the HTML extension, you can add the following to your
## Formatting ## Formatting
By default Zed uses [Prettier](https://prettier.io/) for formatting HTML By default Zed uses [Prettier](https://prettier.io/) for formatting HTML.
You can disable `format_on_save` by adding the following to your Zed settings: You can disable `format_on_save` by adding the following to your Zed `settings.json`:
```json ```json
"languages": { "languages": {
@ -31,11 +29,11 @@ You can disable `format_on_save` by adding the following to your Zed settings:
} }
``` ```
You can still trigger formatting manually with {#kb editor::Format} or by opening the command palette ( {#kb commandPalette::Toggle} and selecting `Format Document`. You can still trigger formatting manually with {#kb editor::Format} or by opening [the Command Palette](..//getting-started.md#command-palette) ({#kb command_palette::Toggle}) and selecting "Format Document".
### LSP Formatting ### LSP Formatting
If you prefer you can use `vscode-html-language-server` instead of Prettier for auto-formatting by adding the following to your Zed settings: To use the `vscode-html-language-server` language server auto-formatting instead of Prettier, add the following to your Zed settings:
```json ```json
"languages": { "languages": {
@ -45,7 +43,7 @@ If you prefer you can use `vscode-html-language-server` instead of Prettier for
} }
``` ```
You can customize various [formatting options](https://code.visualstudio.com/docs/languages/html#_formatting) for `vscode-html-language-server` via Zed settings.json: You can customize various [formatting options](https://code.visualstudio.com/docs/languages/html#_formatting) for `vscode-html-language-server` via your Zed `settings.json`:
```json ```json
"lsp": { "lsp": {
@ -66,7 +64,7 @@ You can customize various [formatting options](https://code.visualstudio.com/doc
} }
``` ```
## See also: ## See also
- [CSS](./css.md) - [CSS](./css.md)
- [JavaScript](./javascript.md) - [JavaScript](./javascript.md)

View file

@ -7,7 +7,10 @@ JavaScript support is available natively in Zed.
## Code formatting ## Code formatting
Formatting on save is enabled by default for JavaScript, using TypeScript's built-in code formatting. But many JavaScript projects use other command-line code-formatting tools, such as [Prettier](https://prettier.io/). You can use one of these tools by specifying an _external_ code formatter for JavaScript in your settings. See [the configuration docs](../configuring-zed.md) for more information. Formatting on save is enabled by default for JavaScript, using TypeScript's built-in code formatting.
But many JavaScript projects use other command-line code-formatting tools, such as [Prettier](https://prettier.io/).
You can use one of these tools by specifying an _external_ code formatter for JavaScript in your settings.
See [the configuration docs](../configuring-zed.md) for more information.
For example, if you have Prettier installed and on your `PATH`, you can use it to format JavaScript files by adding the following to your `settings.json`: For example, if you have Prettier installed and on your `PATH`, you can use it to format JavaScript files by adding the following to your `settings.json`:
@ -34,12 +37,12 @@ In JSX strings, the [`tailwindcss-language-server`](./tailwindcss.md) is used pr
## JSDoc ## JSDoc
Zed supports JSDoc syntax in JavaScript and TypeScript comments that match the JSDoc syntax. Zed uses [tree-sitter/tree-sitter-jsdoc](https://github.com/tree-sitter/tree-sitter-jsdoc) for parsing and highlighting JSDoc. Zed supports JSDoc syntax in JavaScript and TypeScript comments that match the JSDoc syntax.
Zed uses [tree-sitter/tree-sitter-jsdoc](https://github.com/tree-sitter/tree-sitter-jsdoc) for parsing and highlighting JSDoc.
## ESLint ## ESLint
You can configure Zed to format code using `eslint --fix` by running the ESLint You can configure Zed to format code using `eslint --fix` by running the ESLint code action when formatting:
code action when formatting:
```json ```json
{ {

View file

@ -7,7 +7,7 @@ Svelte support is available through the [Svelte extension](https://github.com/ze
## Extra theme styling configuration ## Extra theme styling configuration
You can modify how certain styles such as directives and modifiers appear in attributes: You can modify how certain styles, such as directives and modifiers, appear in attributes:
```json ```json
"syntax": { "syntax": {
@ -24,7 +24,7 @@ You can modify how certain styles such as directives and modifiers appear in att
## Inlay Hints ## Inlay Hints
Zed sets the following initialization options for inlay hints: When inlay hints is enabled in Zed, to make the language server send them back, Zed sets the following initialization options:
```json ```json
"inlayHints": { "inlayHints": {
@ -51,9 +51,7 @@ Zed sets the following initialization options for inlay hints:
} }
``` ```
to make the language server send back inlay hints when Zed has them enabled in the settings. To override these settings, use the following:
Use
```json ```json
"lsp": { "lsp": {
@ -72,6 +70,4 @@ Use
} }
``` ```
to override these settings. See [the TypeScript language server `package.json`](https://github.com/microsoft/vscode/blob/main/extensions/typescript-language-features/package.json) for more information.
See https://github.com/microsoft/vscode/blob/main/extensions/typescript-language-features/package.json for more information.

View file

@ -12,7 +12,7 @@ TBD: Document the difference between Language servers
## Language servers ## Language servers
By default Zed uses [vtsls](https://github.com/yioneko/vtsls) for TypeScript, TSX and JavaScript files. By default Zed uses [vtsls](https://github.com/yioneko/vtsls) for TypeScript, TSX, and JavaScript files.
You can configure the use of [typescript-language-server](https://github.com/typescript-language-server/typescript-language-server) per language in your settings file: You can configure the use of [typescript-language-server](https://github.com/typescript-language-server/typescript-language-server) per language in your settings file:
```json ```json
@ -65,12 +65,9 @@ Prettier will also be used for TypeScript files by default. To disable this:
## Inlay Hints ## Inlay Hints
Zed sets the following initialization options to make the language server send back inlay hints Zed sets the following initialization options to make the language server send back inlay hints (that is, when Zed has inlay hints enabled in the settings).
(that is, when Zed has inlay hints enabled in the settings).
You can override these settings in your Zed settings file. You can override these settings in your Zed `settings.json` when using `typescript-language-server`:
When using `typescript-language-server`:
```json ```json
{ {